Skip to content

Commit e636222

Browse files
stwrtstwrt
committed
[grid-lanes] display:grid subgrid should contribute item sizes to correct tracks
https://bugs.webkit.org/show_bug.cgi?id=307587 rdar://170168798 Reviewed by Sammy Gill. When an explicitly placed subgrid uses display:grid (instead of display:grid-lanes) inside a grid-lanes container, the subgrid's items should contribute their intrinsic sizes only to the specific tracks where they are placed, not to all tracks in the subgrid's span. The issue was in computeDefiniteAndIndefiniteItemsForMasonry, which determines whether items have indefinite positions based on their CSS style (via resolveGridPositionsFromStyle). For auto-placed items inside the subgrid, this returns indefinite even though a display:grid subgrid has already placed them to specific tracks via its grid auto-placement algorithm. The fix checks whether the item's parent is a regular grid (not grid-lanes) using isMasonry(). If so, we treat items as having definite positions since the grid has placed them, and they contribute only to their actual tracks rather than all tracks in the subgrid span. Tests: imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing-ref.html imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing.html * LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing-expected.html: Copied from LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing-expected.html. * LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing-ref.html: Copied from LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing-expected.html. * LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing.html: Copied from LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing.html. * LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing-expected.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing-ref.html: * LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing.html: * Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp: (WebCore::GridTrackSizingAlgorithm::computeDefiniteAndIndefiniteItemsForMasonry): Canonical link: https://commits.webkit.org/308253@main
1 parent 8624238 commit e636222

File tree

7 files changed

+233
-36
lines changed

7 files changed

+233
-36
lines changed

‎LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing-expected.html‎

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<!DOCTYPE HTML>
2+
<!--
3+
Any copyright is dedicated to the Public Domain.
4+
http://creativecommons.org/publicdomain/zero/1.0/
5+
-->
6+
<html>
7+
<head>
8+
<meta charset="utf-8">
9+
<title>Verify correct sizing of intrinsically sized tracks when using subgrid in CSS Grid Lanes</title>
10+
<link rel="author" title="Brandon Stewart" href="mailto:[email protected]">
11+
<link rel="help" href="https://drafts.csswg.org/css-grid-3/#subgrids">
12+
<style>
13+
grid {
14+
display: inline-grid;
15+
grid-template-columns: auto min-content max-content;
16+
border: 1px solid;
17+
background: lightgrey;
18+
}
19+
20+
subgrid {
21+
display: grid;
22+
grid: subgrid / subgrid;
23+
grid-column: 2 / span 2;
24+
grid-row: 1 / span 2;
25+
background: lightblue;
26+
}
27+
</style>
28+
</head>
29+
30+
<body>
31+
<grid>
32+
<item>1</item>
33+
<subgrid>
34+
<item>2</item>
35+
<item>3</item>
36+
<item>4</item>
37+
</subgrid>
38+
<item>5</item>
39+
</grid>
40+
41+
<grid>
42+
<item style="width: 1ch">1</item>
43+
<subgrid>
44+
<item style="width: 2ch">2</item>
45+
<item>3</item>
46+
<item>4</item>
47+
</subgrid>
48+
<item>5</item>
49+
</grid>
50+
51+
<grid>
52+
<item>1</item>
53+
<subgrid>
54+
<item>2</item>
55+
<item style="width: 3ch">3</item>
56+
<item>4</item>
57+
</subgrid>
58+
<item>5</item>
59+
</grid>
60+
61+
<grid>
62+
<item style="width: 1ch">1</item>
63+
<subgrid>
64+
<item>2</item>
65+
<item>3</item>
66+
<item style="width: 4ch">4</item>
67+
</subgrid>
68+
<item>5</item>
69+
</grid>
70+
</body>
71+
</html>

‎LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing-ref.html‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
<!DOCTYPE HTML>
2+
<!--
3+
Any copyright is dedicated to the Public Domain.
4+
http://creativecommons.org/publicdomain/zero/1.0/
5+
-->
6+
<html>
7+
<head>
8+
<meta charset="utf-8">
9+
<title>Verify correct sizing of intrinsically sized tracks when using subgrid in CSS Grid Lanes</title>
10+
<link rel="author" title="Brandon Stewart" href="mailto:[email protected]">
11+
<link rel="help" href="https://drafts.csswg.org/css-grid-3/#subgrids">
12+
<style>
13+
grid {
14+
display: inline-grid;
15+
grid-template-columns: auto min-content max-content;
16+
border: 1px solid;
17+
background: lightgrey;
18+
}
19+
20+
subgrid {
21+
display: grid;
22+
grid: subgrid / subgrid;
23+
grid-column: 2 / span 2;
24+
grid-row: 1 / span 2;
25+
background: lightblue;
26+
}
27+
</style>
28+
</head>
29+
30+
<body>
31+
<grid>
32+
<item>1</item>
33+
<subgrid>
34+
<item>2</item>
35+
<item>3</item>
36+
<item>4</item>
37+
</subgrid>
38+
<item>5</item>
39+
</grid>
40+
41+
<grid>
42+
<item style="width: 1ch">1</item>
43+
<subgrid>
44+
<item style="width: 2ch">2</item>
45+
<item>3</item>
46+
<item>4</item>
47+
</subgrid>
48+
<item>5</item>
49+
</grid>
50+
51+
<grid>
52+
<item>1</item>
53+
<subgrid>
54+
<item>2</item>
55+
<item style="width: 3ch">3</item>
56+
<item>4</item>
57+
</subgrid>
58+
<item>5</item>
59+
</grid>
60+
61+
<grid>
62+
<item style="width: 1ch">1</item>
63+
<subgrid>
64+
<item>2</item>
65+
<item>3</item>
66+
<item style="width: 4ch">4</item>
67+
</subgrid>
68+
<item>5</item>
69+
</grid>
70+
71+
</body>
72+
</html>

‎LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-display-grid-intrinsic-sizing.html‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
<!DOCTYPE HTML>
2+
<!--
3+
Any copyright is dedicated to the Public Domain.
4+
http://creativecommons.org/publicdomain/zero/1.0/
5+
-->
6+
<html>
7+
8+
<head>
9+
<meta charset="utf-8">
10+
<title>Verify correct sizing of intrinsically sized tracks when using subgrid in CSS Grid Lanes</title>
11+
<link rel="author" title="Brandon Stewart" href="mailto:[email protected]">
12+
<link rel="help" href="https://drafts.csswg.org/css-grid-3/#subgrids">
13+
<link rel="match" href="grid-lanes-subgrid-intrinsic-sizing-ref.html">
14+
<style>
15+
grid {
16+
display: inline-grid-lanes;
17+
grid-template-columns: auto min-content max-content;
18+
border: 1px solid;
19+
background: lightgrey;
20+
}
21+
22+
subgrid {
23+
display: grid;
24+
grid-template-columns: subgrid;
25+
grid-column: 2 / span 2;
26+
background: lightblue;
27+
}
28+
</style>
29+
</head>
30+
31+
<body>
32+
<!-- Verify basic subgrid -->
33+
<grid>
34+
<item>1</item>
35+
<subgrid>
36+
<item>2</item>
37+
<item>3</item>
38+
<item>4</item>
39+
</subgrid>
40+
<item>5</item>
41+
</grid>
42+
43+
<!-- Verify subgrid with first item in subgrid set to 2ch -->
44+
<grid>
45+
<item>1</item>
46+
<subgrid>
47+
<item style="width: 2ch">2</item>
48+
<item>3</item>
49+
<item>4</item>
50+
</subgrid>
51+
<item>5</item>
52+
</grid>
53+
54+
<!-- Verify subgrid with second item in subgrid set to 3ch -->
55+
<grid>
56+
<item>1</item>
57+
<subgrid>
58+
<item>2</item>
59+
<item style="width: 3ch">3</item>
60+
<item>4</item>
61+
</subgrid>
62+
<item>5</item>
63+
</grid>
64+
65+
<!-- Verify subgrid with final item in subgrid set to 4ch -->
66+
<grid>
67+
<item>1</item>
68+
<subgrid>
69+
<item>2</item>
70+
<item>3</item>
71+
<item style="width: 4ch">4</item>
72+
</subgrid>
73+
<item>5</item>
74+
</grid>
75+
76+
</body>
77+
78+
</html>

‎LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing-expected.html‎

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -68,14 +68,5 @@
6868
<item>5</item>
6969
</grid>
7070

71-
<grid>
72-
<item style="width: 1ch">1</item>
73-
<subgrid>
74-
<item style="width: 3ch">2</item>
75-
<item style="width: 3ch">3</item>
76-
<item>4</item>
77-
</subgrid>
78-
<item>5</item>
79-
</grid>
8071
</body>
8172
</html>

‎LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing-ref.html‎

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -68,14 +68,5 @@
6868
<item>5</item>
6969
</grid>
7070

71-
<grid>
72-
<item style="width: 1ch">1</item>
73-
<subgrid>
74-
<item style="width: 3ch">2</item>
75-
<item style="width: 3ch">3</item>
76-
<item>4</item>
77-
</subgrid>
78-
<item>5</item>
79-
</grid>
8071
</body>
8172
</html>

‎LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-lanes/tentative/subgrid/track-sizing/grid-lanes-subgrid-intrinsic-sizing.html‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -72,15 +72,5 @@
7272
<item>5</item>
7373
</grid>
7474

75-
<!-- Verify behavior when subgrid is set to grid-lanes too -->
76-
<grid>
77-
<item>1</item>
78-
<subgrid style="display: grid-lanes;">
79-
<item>2</item>
80-
<item style="width: 3ch">3</item>
81-
<item>4</item>
82-
</subgrid>
83-
<item>5</item>
84-
</grid>
8575
</body>
8676
</html>

‎Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1784,19 +1784,23 @@ void GridTrackSizingAlgorithm::computeDefiniteAndIndefiniteItemsForMasonry(StdMa
17841784
traverseSubgridTreeForIntrinsicSizing([&](RenderBox& gridItem, GridSpan gridItemSpan) {
17851785
// Determine if this item has an indefinite position in the masonry grid-axis.
17861786
// Check against the item's immediate parent grid, using the direction mapped
1787-
// into that parent's coordinate space.
1788-
auto* parentGrid = dynamicDowncast<RenderGrid>(gridItem.parent());
1789-
auto parentDirection = parentGrid
1790-
? GridLayoutFunctions::flowAwareDirectionForGridItem(*m_renderGrid, *parentGrid, m_direction)
1791-
: m_direction;
1792-
bool isIndefinite = parentGrid && Style::GridPositionsResolver::resolveGridPositionsFromStyle(*parentGrid, gridItem, parentDirection).isIndefinite();
1793-
bool isDirectChildOfMasonryGrid = gridItem.parent() == m_renderGrid;
1787+
// into that parent's coordinate space. The parent is always a RenderGrid since
1788+
// traverseSubgridTreeForIntrinsicSizing only visits children of grid containers.
1789+
CheckedRef parentGrid = downcast<RenderGrid>(*gridItem.parent());
1790+
auto parentDirection = GridLayoutFunctions::flowAwareDirectionForGridItem(*m_renderGrid, parentGrid, m_direction);
1791+
// For display:grid subgrids (not display:grid-lanes) inside a grid-lanes parent,
1792+
// items have been placed by the grid's auto-placement algorithm, so they should
1793+
// not be considered indefinite even if their CSS style uses auto placement.
1794+
// We check isMasonry() (no direction argument) to see if the parent uses grid-lanes
1795+
// display at all, rather than checking the specific direction.
1796+
bool isIndefinite = parentGrid->isMasonry() && Style::GridPositionsResolver::resolveGridPositionsFromStyle(parentGrid, gridItem, parentDirection).isIndefinite();
1797+
bool isDirectChildOfMasonryGrid = parentGrid.ptr() == m_renderGrid;
17941798

17951799
if (isIndefinite && !isDirectChildOfMasonryGrid) {
17961800
// Items inside a masonry subgrid with indefinite placement could land in any
17971801
// track the subgrid spans. Apply their contribution as a definite single-span
17981802
// item to each content-sized track in the subgrid's span.
1799-
auto subgridSpan = m_renderGrid->gridSpanForGridItem(*parentGrid, m_direction);
1803+
auto subgridSpan = m_renderGrid->gridSpanForGridItem(parentGrid, m_direction);
18001804
for (auto trackIndex : subgridSpan) {
18011805
if (!isTrackContentSized(trackIndex))
18021806
continue;

0 commit comments

Comments
 (0)