[webkit-changes] [WebKit/WebKit] 7545fa: Implement last baseline alignment for CSS Grid.

Sammy Gill noreply at github.com
Wed Oct 12 14:52:11 PDT 2022 

  Branch: refs/heads/main
  Home:   https://github.com/WebKit/WebKit
  Commit: 7545fa38ae640521e6ab05ffc5cf73031c8aa521
      https://github.com/WebKit/WebKit/commit/7545fa38ae640521e6ab05ffc5cf73031c8aa521
  Author: Sammy Gill <sammy.gill at apple.com>
  Date:   2022-10-12 (Wed, 12 Oct 2022)

  Changed paths:
    M LayoutTests/TestExpectations
    M LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/alignment/flex-align-baseline-grid-001-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/alignment/flex-align-baseline-grid-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/alignment/flex-align-baseline-grid-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-001-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-004-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-fieldset-001-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-fieldset-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-fieldset-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-001-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-004-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-grid-001-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-grid-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-grid-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-line-clamp-001.tentative-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-line-clamp-002.tentative-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-line-clamp-003.tentative-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-overflow-001-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-overflow-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-overflow-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-001-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-justify-baseline-002-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-justify-baseline-003-expected.txt
    M LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-justify-baseline-004-expected.txt
    A LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-001-expected.txt
    A LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-002-expected.txt
    A LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-003-expected.txt
    M Source/WebCore/rendering/GridBaselineAlignment.cpp
    M Source/WebCore/rendering/GridBaselineAlignment.h
    M Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp
    M Source/WebCore/rendering/RenderGrid.cpp
    M Source/WebCore/rendering/RenderGrid.h

  Log Message:
  -----------
  Implement last baseline alignment for CSS Grid.
https://bugs.webkit.org/show_bug.cgi?id=243524
rdar://98089709

Reviewed by Brent Fulgham.

In order to implement last baseline alignment for grid, there are a
couple of extra pieces of information we need to keep track of:
1.) The grid items that are participating in last baseline alignment
2.) The descent values of each of those items

Once we have this, then the rest is similar to how first baseline
alignment is done.

When determining which items are participating in last baseline
alignment, we need to know if any of those items also span into other
tracks. This is because if an item spans into multiple tracks, then
it will participate in last baseline alignment with the items in the
last track it spans. Any calls to updateBaselineAlignmentContext must
now take this into consideration to provide the correct span to update
the baseline sharing groups.

Computing the descent values for last baseline items is the same idea
as computing the ascent for baseline items. This allows us to figure
out the "shim" value that is used to add an artificial margin to items
so that all of the last baseline items align. From the spec:

For the items in each baseline-sharing group, add a “shim”
(effectively, additional margin) on the start/end side
(for first/last-baseline alignment) of each item so that,
when start/end-aligned together their baselines align as specified.

Spec reference:
https://www.w3.org/TR/css-grid-1/#algo-baseline-shims
https://www.w3.org/TR/css-grid-1/#grid-baselines
https://www.w3.org/TR/css-align-3/#baseline-sharing-group

* LayoutTests/TestExpectations:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-004-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-fieldset-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-fieldset-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-fieldset-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-flex-004-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-grid-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-grid-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-grid-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-line-clamp-001.tentative-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-line-clamp-002.tentative-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-line-clamp-003.tentative-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-overflow-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-overflow-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-overflow-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-justify-baseline-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-justify-baseline-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-justify-baseline-004-expected.txt:
* LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-001-expected.txt:
* LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-002-expected.txt:
* LayoutTests/platform/ios/imported/w3c/web-platform-tests/css/css-grid/alignment/grid-align-baseline-table-003-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/alignment/flex-align-baseline-grid-001-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/alignment/flex-align-baseline-grid-002-expected.txt:
* LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/alignment/flex-align-baseline-grid-003-expected.txt:

* Source/WebCore/rendering/GridBaselineAlignment.cpp:
(WebCore::GridBaselineAlignment::logicalAscentForChild const):
We need to take into consideration if the item is being last baseline
aligned here. If it is, then we need to compute its descent value
instead.

(WebCore::GridBaselineAlignment::ascentForChild const):
Similarly, depending on the alignment we will need to call into the
child's firstLineBaseline or lastLineBaseline method to get the first
line's baseline value or the last line's baseline value, respectively.

(WebCore::GridBaselineAlignment::updateBaselineAlignmentContext):
A little bit of cleanup was done here. Instead of calling
ascentForChild and then checking if we need to compute the descent, we
can instead call logicalAscentForChild which does the same for us.
Also, instead of polluting the contextsMap with nullptrs, we can first
try to get the item from the map and decide whether we need to insert
it into the map of update the baseline sharing group instead.

(WebCore::GridBaselineAlignment::baselineOffsetForChild const):
* Source/WebCore/rendering/GridBaselineAlignment.h:

* Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp:
(WebCore::GridTrackSizingAlgorithm::updateBaselineAlignmentContext):
(WebCore::GridTrackSizingAlgorithm::baselineOffsetForChild const):
In both of the cases above, we need to check if the item is being first
or last baseline aligned. If it is being last baseline aligned, then it
needs to be in the baseline sharing group for the last track it spans.

* Source/WebCore/rendering/RenderGrid.cpp:
(WebCore::RenderGrid::lastLineBaseline const):
Implementation to get the last line baseline for grid items. Definition
of the baseline is in the spec reference above.

(WebCore::RenderGrid::getBaselineChild const):
(WebCore::RenderGrid::columnAxisPositionForChild const):
(WebCore::RenderGrid::columnAxisOffsetForChild const):
A little bit of cleanup to separate the GridAxisEnd (used for last
baseline alignment) from the GridAxisCenter code. This required pulling
out some of the local variables so that they could be used in both
scopes. (startPosition + offsetFromStartPosition) should move the item
to the end of the axis and columnAxisOffsetForChild should provide the
baseline shim to align the item to the other last baselines. If an item
needs to be moved to GridAxisEnd but is not participating in last
baseline alignment, then the shim should be 0.

* Source/WebCore/rendering/RenderGrid.h:

Canonical link: https://commits.webkit.org/255455@main

More information about the webkit-changes mailing list