Skip to content

[css-anchor-position-1] Implement parsing support for position-area#35202

Closed
Scony wants to merge 1 commit intoWebKit:mainfrom
Scony:281289-css-anchoring-position-area-parsing
Closed

[css-anchor-position-1] Implement parsing support for position-area#35202
Scony wants to merge 1 commit intoWebKit:mainfrom
Scony:281289-css-anchoring-position-area-parsing

Conversation

@Scony
Copy link
Copy Markdown
Contributor

@Scony Scony commented Oct 15, 2024

9f0532f

[css-anchor-position-1] Implement parsing support for position-area
https://bugs.webkit.org/show_bug.cgi?id=281289

Reviewed by NOBODY (OOPS!).

This change adds parsing support for `position-area` CSS property as specified in:
https://drafts.csswg.org/css-anchor-position-1/#position-area

* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-computed-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-computed-insets-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-interpolation-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-parsing-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/property-interpolations-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/try-tactic-position-area-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/glib/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/ipad/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/mac-wk1/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* Source/WebCore/Headers.cmake:
* Source/WebCore/Sources.txt:
* Source/WebCore/WebCore.xcodeproj/project.pbxproj:
* Source/WebCore/animation/CSSPropertyAnimation.cpp:
(WebCore::CSSPropertyAnimationWrapperMap::CSSPropertyAnimationWrapperMap):
* Source/WebCore/css/CSSProperties.json:
* Source/WebCore/css/CSSValueKeywords.in:
* Source/WebCore/css/ComputedStyleExtractor.cpp:
(WebCore::toCSSValueID):
(WebCore::valueForPositionArea):
(WebCore::ComputedStyleExtractor::valueForPropertyInStyle const):
* Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::consumePositionArea):
* Source/WebCore/css/parser/CSSPropertyParserHelpers.h:
* Source/WebCore/rendering/style/PositionArea.cpp: Added.
(WebCore::PositionArea::isAmbiguous):
(WebCore::operator<<):
* Source/WebCore/rendering/style/PositionArea.h: Added.
* Source/WebCore/rendering/style/RenderStyle.cpp:
(WebCore::RenderStyle::conservativelyCollectChangedAnimatableProperties const):
* Source/WebCore/rendering/style/RenderStyle.h:
* Source/WebCore/rendering/style/RenderStyleInlines.h:
(WebCore::RenderStyle::initialPositionArea):
(WebCore::RenderStyle::positionArea const):
* Source/WebCore/rendering/style/RenderStyleSetters.h:
(WebCore::RenderStyle::setPositionArea):
* Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp:
(WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
(WebCore::StyleRareNonInheritedData::operator== const):
* Source/WebCore/rendering/style/StyleRareNonInheritedData.h:
* Source/WebCore/style/StyleBuilderConverter.h:
(WebCore::Style::BuilderConverter::convertPositionArea):

9f0532f

Misc iOS, visionOS, tvOS & watchOS macOS Linux Windows
✅ 🧪 style ✅ 🛠 ios ✅ 🛠 mac ✅ 🛠 wpe ✅ 🛠 win
✅ 🧪 bindings ✅ 🛠 ios-sim ✅ 🛠 mac-AS-debug ✅ 🧪 wpe-wk2 ✅ 🧪 win-tests
✅ 🧪 webkitperl ✅ 🧪 ios-wk2 ✅ 🧪 api-mac ✅ 🧪 api-wpe
✅ 🧪 ios-wk2-wpt ✅ 🧪 mac-wk1 ✅ 🛠 wpe-cairo
✅ 🧪 api-ios ✅ 🧪 mac-wk2 ✅ 🛠 gtk
✅ 🛠 vision ✅ 🧪 mac-AS-debug-wk2 ✅ 🧪 gtk-wk2
✅ 🛠 vision-sim ✅ 🧪 mac-wk2-stress ✅ 🧪 api-gtk
✅ 🧪 vision-wk2 ✅ 🧪 mac-intel-wk2
✅ 🛠 tv ✅ 🛠 mac-safer-cpp
✅ 🛠 tv-sim
✅ 🛠 watch
✅ 🛠 watch-sim

@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from 42a58c7 to 66dc9d3 Compare October 15, 2024 07:36
@Scony Scony requested a review from graouts as a code owner October 15, 2024 07:36
@Scony Scony self-assigned this Oct 15, 2024
@Scony Scony added the CSS Cascading Style Sheets implementation label Oct 15, 2024
@nt1m nt1m self-requested a review October 15, 2024 07:50
Copy link
Copy Markdown
Member

@nt1m nt1m left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Usually we implement the internal representation + computed style representation at the same time as parsing, simply because these decisions influence how we parse.

Is it possible to do this here?

@Scony
Copy link
Copy Markdown
Contributor Author

Scony commented Oct 15, 2024

Usually we implement the internal representation + computed style representation at the same time as parsing, simply because these decisions influence how we parse.

Is it possible to do this here?

Yes, it's doable - let me add that part as well then.

Converting to draft until I update the PR with computing support.

@Scony Scony marked this pull request as draft October 15, 2024 08:05
@webkit-ews-buildbot webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Oct 15, 2024
@Scony Scony removed the merging-blocked Applied to prevent a change from being merged label Oct 21, 2024
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from 66dc9d3 to 472cb69 Compare October 21, 2024 13:29
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from 472cb69 to 9f281e0 Compare October 21, 2024 13:31
@webkit-ews-buildbot webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Oct 21, 2024
@Scony Scony removed the merging-blocked Applied to prevent a change from being merged label Oct 21, 2024
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from 9f281e0 to d84f8db Compare October 21, 2024 18:46
@webkit-ews-buildbot webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Oct 21, 2024
@Scony Scony removed the merging-blocked Applied to prevent a change from being merged label Oct 22, 2024
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from d84f8db to cd84b8a Compare October 22, 2024 10:18
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from cd84b8a to a126638 Compare October 22, 2024 10:37
@Scony Scony marked this pull request as ready for review October 22, 2024 18:32
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from a126638 to bc286f6 Compare October 23, 2024 10:02
@Scony Scony requested a review from anttijk October 23, 2024 10:05
@webkit-ews-buildbot webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Oct 23, 2024
@Scony Scony removed the merging-blocked Applied to prevent a change from being merged label Oct 23, 2024
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from bc286f6 to ecfd60c Compare October 23, 2024 19:10
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from ecfd60c to 3419d2d Compare October 24, 2024 09:49
@webkit-ews-buildbot webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Oct 24, 2024
https://bugs.webkit.org/show_bug.cgi?id=281289

Reviewed by NOBODY (OOPS!).

This change adds parsing support for `position-area` CSS property as specified in:
https://drafts.csswg.org/css-anchor-position-1/#position-area

* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-computed-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-computed-insets-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-interpolation-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/position-area-parsing-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/property-interpolations-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-anchor-position/try-tactic-position-area-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/glib/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/ipad/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* LayoutTests/platform/mac-wk1/imported/w3c/web-platform-tests/css/css-cascade/all-prop-initial-xml-expected.txt:
* Source/WebCore/Headers.cmake:
* Source/WebCore/Sources.txt:
* Source/WebCore/WebCore.xcodeproj/project.pbxproj:
* Source/WebCore/animation/CSSPropertyAnimation.cpp:
(WebCore::CSSPropertyAnimationWrapperMap::CSSPropertyAnimationWrapperMap):
* Source/WebCore/css/CSSProperties.json:
* Source/WebCore/css/CSSValueKeywords.in:
* Source/WebCore/css/ComputedStyleExtractor.cpp:
(WebCore::toCSSValueID):
(WebCore::valueForPositionArea):
(WebCore::ComputedStyleExtractor::valueForPropertyInStyle const):
* Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::consumePositionArea):
* Source/WebCore/css/parser/CSSPropertyParserHelpers.h:
* Source/WebCore/rendering/style/PositionArea.cpp: Added.
(WebCore::PositionArea::isAmbiguous):
(WebCore::operator<<):
* Source/WebCore/rendering/style/PositionArea.h: Added.
* Source/WebCore/rendering/style/RenderStyle.cpp:
(WebCore::RenderStyle::conservativelyCollectChangedAnimatableProperties const):
* Source/WebCore/rendering/style/RenderStyle.h:
* Source/WebCore/rendering/style/RenderStyleInlines.h:
(WebCore::RenderStyle::initialPositionArea):
(WebCore::RenderStyle::positionArea const):
* Source/WebCore/rendering/style/RenderStyleSetters.h:
(WebCore::RenderStyle::setPositionArea):
* Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp:
(WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
(WebCore::StyleRareNonInheritedData::operator== const):
* Source/WebCore/rendering/style/StyleRareNonInheritedData.h:
* Source/WebCore/style/StyleBuilderConverter.h:
(WebCore::Style::BuilderConverter::convertPositionArea):
@Scony Scony removed the merging-blocked Applied to prevent a change from being merged label Oct 24, 2024
@Scony Scony force-pushed the 281289-css-anchoring-position-area-parsing branch from 3419d2d to 9f0532f Compare October 24, 2024 19:07
@Scony Scony requested a review from tuankiet65 October 25, 2024 06:20
Copy link
Copy Markdown
Member

@tuankiet65 tuankiet65 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I haven't checked the parsing/serialization/conversion code closely, but the test passes so I'm confident they're correct

enum CSSValueID : uint16_t;

struct PositionArea {

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No newline here

|| id == CSSValueXStart
);
};
auto isDescribingRows = [&isDescribingCols](const CSSValueID id) {
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe add newlines between the lambda definitions

},
"position-area": {
"values": [
"block-end",
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are parsing the value ourselves, I don't know if this would do anything. I think it also gives the wrong impression that these are the values that position-area accepts, while the reality is more complicated.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It mostly lists them on webkit.org/css-status , but nothing else really.

(Also none is missing from this list)

I'm fine either way regarding keeping this list.

// https://drafts.csswg.org/css-anchor-position-1/#position-area
RefPtr<CSSValue> consumePositionArea(CSSParserTokenRange& range, const CSSParserContext&)
{
auto matchesBranch1A = [](const CSSValueID id) {
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no need for const, here and below.


inline std::optional<PositionArea> BuilderConverter::convertPositionArea(BuilderState&, const CSSValue& value)
{
auto isDescribingCols = [](const CSSValueID id) {
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

same here

@nt1m nt1m requested a review from fantasai October 28, 2024 17:14
}
}

return std::nullopt;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should never get here, right? So this should also be ASSERT_NOT_REACHED();

Copy link
Copy Markdown
Contributor

@fantasai fantasai Oct 28, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A few comments...

First, it's not a good idea to name things after numerical indexes into the spec. The spec can get rearranged for editorial reasons, and it doesn't explain what the underlying logic is. The question you have to ask yourself is, why are are the branches oriented that way? I promise you there's good reasons. :) That logic is what you should use to organize your code.

Second, the grammar in the spec is written that way for understandability. It's not necessarily the best organization for implementing. In this case, if you consume the first ident, and it is not either center or span-all, then you can identify its axis as well as whether it should be first or second in canonical order. You can plug that into your output pair. With that information, you can know what kind of keyword is valid for the second axis, and validate and store it accordingly as well. If instead you fell through into the center or span-all case, then you store this value while you parse the second keyword, and then you can plug both into your output pair once you've identified the axis of the second keyword.

You can do this with switch/case, and it will not only be easier to understand, it'll also be faster than 50+ conditional branches (which is what || produces).

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This structure is about the computed value, not the specified value, right? So here you should think about how you intend to use the value, and encapsulate that logic accordingly. The users of this object don't care about the keywords. They are going to want to pass in some WritingMode information and get back out the used value in their own coordinate space. And they're going to want to get this information efficiently.

So think about abstracting the information in this class. What do the keywords really mean? Instead of maintaining a collection of keywords, you could, for example break this down into:

  • Which of the start/center/end tracks are selected? (3 bits per axis)
  • Am I interpreting the axis as a) physical coordinates b) container x/y logical coordinates c) self x/y logical coordinates d) container block/inline logical coordinates or e) self block/inline logical coordinates (3 bits per axis)

If you organize your values internally like this, then it'll be much easier to add on helper functions that rapidly return used values.

And also, if your parsing function is reliably returning the x or block value first, and the y or inline value second (which it should, because we should only be doing validation in one place, not two), then you can easily assign the parsed values into the computed value structure using switch/case.

@Scony
Copy link
Copy Markdown
Contributor Author

Scony commented Nov 5, 2024

@tuankiet65 @nt1m @fantasai thank you for comments! Those are my first steps implementing features in WebKit's CSS area so the comments from you all are very helpful.

Right now I've switched my focus a bit to anchor-center, but once I have some more time soon, I'll rework this PR according to the comments.

@Scony
Copy link
Copy Markdown
Contributor Author

Scony commented Dec 11, 2024

Due to the change of priorities I'm unable to work on it anymore. Therefore - as agreed offline - @tuankiet65 will continue the work on this feature.

@Scony Scony closed this Dec 11, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CSS Cascading Style Sheets implementation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants