- Revision
- 261949
- Author
- obru...@igalia.com
- Date
- 2020-05-20 13:24:52 -0700 (Wed, 20 May 2020)
Log Message
[css-grid] Fix auto repeat with multiple tracks and gutters
https://bugs.webkit.org/show_bug.cgi?id=182922
Reviewed by Manuel Rego Casasnovas.
LayoutTests/imported/w3c:
Import WPT test.
* web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001-expected.html: Added.
* web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html: Added.
* web-platform-tests/css/css-grid/grid-definition/w3c-import.log:
Source/WebCore:
The code that computes the number of auto repeat tracks wrongly assumes
that the second argument of the repeat() notation is a single track
function. That was true in the beginning, however specs were later on
modified to allow a <track-list>. We support a <track-list> as a second
argument since long ago but the code that computes the number of
auto-repeat tracks was never updated.
This patch modifies two places that relate to the gaps between the
auto-repeat tracks, which ensures the proper total length.
This is a port of https://crrev.com/620278 from Chromium.
Tests: fast/css-grid-layout/grid-auto-repeat-huge-grid.html
imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html
* rendering/RenderGrid.cpp:
(WebCore::RenderGrid::computeAutoRepeatTracksCount const):
LayoutTests:
Update test expectations.
* fast/css-grid-layout/grid-auto-repeat-huge-grid.html:
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (261948 => 261949)
--- trunk/LayoutTests/ChangeLog 2020-05-20 20:23:38 UTC (rev 261948)
+++ trunk/LayoutTests/ChangeLog 2020-05-20 20:24:52 UTC (rev 261949)
@@ -1,3 +1,14 @@
+2020-05-20 Oriol Brufau <obru...@igalia.com>
+
+ [css-grid] Fix auto repeat with multiple tracks and gutters
+ https://bugs.webkit.org/show_bug.cgi?id=182922
+
+ Reviewed by Manuel Rego Casasnovas.
+
+ Update test expectations.
+
+ * fast/css-grid-layout/grid-auto-repeat-huge-grid.html:
+
2020-05-20 Chris Dumez <cdu...@apple.com>
Disable support for BeforeLoadEvent
Modified: trunk/LayoutTests/fast/css-grid-layout/grid-auto-repeat-huge-grid.html (261948 => 261949)
--- trunk/LayoutTests/fast/css-grid-layout/grid-auto-repeat-huge-grid.html 2020-05-20 20:23:38 UTC (rev 261948)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-auto-repeat-huge-grid.html 2020-05-20 20:24:52 UTC (rev 261949)
@@ -180,8 +180,8 @@
autoFillGridElementCols.style.gridGap = "1000000px";
autoFitGridElementCols.style.gridGap = "1000000px";
- getTracksCheckingLength(autoFillGridElementCols, "grid-template-columns", 130, ["wideGrid", "lotsOfAutoRepeatWithAutoFillCols"]);
- getTracksCheckingLength(autoFitGridElementCols, "grid-template-columns", 82, ["wideGrid", "lotsOfAutoRepeatWithAutoFitCols"]);
+ getTracksCheckingLength(autoFillGridElementCols, "grid-template-columns", 30, ["wideGrid", "lotsOfAutoRepeatWithAutoFillCols"]);
+ getTracksCheckingLength(autoFitGridElementCols, "grid-template-columns", 34, ["wideGrid", "lotsOfAutoRepeatWithAutoFitCols"]);
autoFillGridElementCols.style.gridGap = "0px";
autoFitGridElementCols.style.gridGap = "0px";
@@ -202,8 +202,8 @@
autoFillGridElementRows.style.gridGap = "1000000px";
autoFitGridElementRows.style.gridGap = "1000000px";
- getTracksCheckingLength(autoFillGridElementRows, "grid-template-rows", 130, ["tallGrid", "lotsOfAutoRepeatWithAutoFillRows"]);
- getTracksCheckingLength(autoFitGridElementRows, "grid-template-rows", 82, ["tallGrid", "lotsOfAutoRepeatWithAutoFitRows"]);
+ getTracksCheckingLength(autoFillGridElementRows, "grid-template-rows", 30, ["tallGrid", "lotsOfAutoRepeatWithAutoFillRows"]);
+ getTracksCheckingLength(autoFitGridElementRows, "grid-template-rows", 34, ["tallGrid", "lotsOfAutoRepeatWithAutoFitRows"]);
autoFillGridElementRows.style.gridGap = "0px";
autoFitGridElementRows.style.gridGap = "0px";
Modified: trunk/LayoutTests/imported/w3c/ChangeLog (261948 => 261949)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2020-05-20 20:23:38 UTC (rev 261948)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2020-05-20 20:24:52 UTC (rev 261949)
@@ -1,5 +1,18 @@
2020-05-20 Oriol Brufau <obru...@igalia.com>
+ [css-grid] Fix auto repeat with multiple tracks and gutters
+ https://bugs.webkit.org/show_bug.cgi?id=182922
+
+ Reviewed by Manuel Rego Casasnovas.
+
+ Import WPT test.
+
+ * web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001-expected.html: Added.
+ * web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html: Added.
+ * web-platform-tests/css/css-grid/grid-definition/w3c-import.log:
+
+2020-05-20 Oriol Brufau <obru...@igalia.com>
+
Fix computeMarginLogicalSizeForChild to check auto margins in the right axis
https://bugs.webkit.org/show_bug.cgi?id=212113
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001-expected.html (0 => 261949)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001-expected.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001-expected.html 2020-05-20 20:24:52 UTC (rev 261949)
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta charset="utf-8">
+ <title>CSS Grid Layout Test: Auto Repaeat with Multiple Tracks and Gutters</title>
+ <link rel="author" title="Yu Shen" href=""
+ <style>
+ .match-container {
+ border: solid thick black;
+ position: relative;
+ margin: 10px;
+ }
+
+ .column {
+ width: 300px;
+ }
+
+ .row {
+ width: min-content;
+ height: 300px;
+ }
+
+ .item {
+ background: lime;
+ width: 50px;
+ height: 50px;
+ }
+
+ .column-second {
+ position: absolute;
+ top: 0;
+ left: 150px;
+ }
+
+ .row-second {
+ position: absolute;
+ top: 150px;
+ left: 0px;
+ }
+ </style>
+</head>
+
+<body>
+ <p>The test passes if it has the same visual effect as reference.</p>
+ <div class="match-container column">
+ <div class="item"></div>
+ <div class="item column-second"></div>
+ </div>
+ <div class="match-container row">
+ <div class="item"></div>
+ <div class="item row-second"></div>
+ </div>
+</body>
+
+</html>
\ No newline at end of file
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html (0 => 261949)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html 2020-05-20 20:24:52 UTC (rev 261949)
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <meta charset="utf-8">
+ <title>CSS Grid Layout Test: Auto Repaeat with Multiple Tracks and Gutters</title>
+ <link rel="author" title="Yu Shen" href=""
+ <link rel="help" href=""
+ <link rel="match" href=""
+ <style>
+ .grid-container {
+ display: grid;
+ border: solid thick;
+ margin: 10px;
+ }
+
+ .columns {
+ grid-template-columns: repeat(auto-fill, 50px 50px);
+ grid-auto-rows: 25px;
+ grid-column-gap: 100px;
+ width: 300px;
+ }
+
+ .rows {
+ grid-auto-flow: column;
+ grid-template-rows: repeat(auto-fill, 50px 50px);
+ grid-auto-columns: 25px;
+ grid-row-gap: 100px;
+ width: min-content;
+ height: 300px;
+ }
+
+ .grid-container>div {
+ background: lime;
+ }
+ </style>
+</head>
+
+<body>
+ <p>The test passes if it has the same visual effect as reference.</p>
+ <div class="grid-container columns">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div class="grid-container rows">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+</body>
+
+</html>
\ No newline at end of file
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/w3c-import.log (261948 => 261949)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/w3c-import.log 2020-05-20 20:23:38 UTC (rev 261948)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/w3c-import.log 2020-05-20 20:24:52 UTC (rev 261949)
@@ -23,6 +23,8 @@
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-min-max-size-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-min-size-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-min-size-002.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001-expected.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-fit-content-argument-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-inline-auto-repeat-001.html
Modified: trunk/Source/WebCore/ChangeLog (261948 => 261949)
--- trunk/Source/WebCore/ChangeLog 2020-05-20 20:23:38 UTC (rev 261948)
+++ trunk/Source/WebCore/ChangeLog 2020-05-20 20:24:52 UTC (rev 261949)
@@ -1,3 +1,28 @@
+2020-05-20 Oriol Brufau <obru...@igalia.com>
+
+ [css-grid] Fix auto repeat with multiple tracks and gutters
+ https://bugs.webkit.org/show_bug.cgi?id=182922
+
+ Reviewed by Manuel Rego Casasnovas.
+
+ The code that computes the number of auto repeat tracks wrongly assumes
+ that the second argument of the repeat() notation is a single track
+ function. That was true in the beginning, however specs were later on
+ modified to allow a <track-list>. We support a <track-list> as a second
+ argument since long ago but the code that computes the number of
+ auto-repeat tracks was never updated.
+
+ This patch modifies two places that relate to the gaps between the
+ auto-repeat tracks, which ensures the proper total length.
+
+ This is a port of https://crrev.com/620278 from Chromium.
+
+ Tests: fast/css-grid-layout/grid-auto-repeat-huge-grid.html
+ imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-multiple-values-001.html
+
+ * rendering/RenderGrid.cpp:
+ (WebCore::RenderGrid::computeAutoRepeatTracksCount const):
+
2020-05-20 Simon Fraser <simon.fra...@apple.com>
Plumb the display's nominal refresh rate down to ScrollingTree for use in scroll synchronization
Modified: trunk/Source/WebCore/rendering/RenderGrid.cpp (261948 => 261949)
--- trunk/Source/WebCore/rendering/RenderGrid.cpp 2020-05-20 20:23:38 UTC (rev 261948)
+++ trunk/Source/WebCore/rendering/RenderGrid.cpp 2020-05-20 20:24:52 UTC (rev 261949)
@@ -507,16 +507,16 @@
tracksSize += valueForLength(hasDefiniteMaxTrackBreadth ? track.maxTrackBreadth().length() : track.minTrackBreadth().length(), availableSize.value());
}
- // Add gutters as if there where only 1 auto repeat track. Gaps between auto repeat tracks will be added later when
- // computing the repetitions.
+ // Add gutters as if auto repeat tracks were only repeated once. Gaps between different repetitions will be added later when
+ // computing the number of repetitions of the auto repeat().
LayoutUnit gapSize = gridGap(direction, availableSize);
- tracksSize += gapSize * trackSizes.size();
+ tracksSize += gapSize * (trackSizes.size() + autoRepeatTrackListLength - 1);
LayoutUnit freeSpace = availableSize.value() - tracksSize;
if (freeSpace <= 0)
return autoRepeatTrackListLength;
- LayoutUnit autoRepeatSizeWithGap = autoRepeatTracksSize + gapSize;
+ LayoutUnit autoRepeatSizeWithGap = autoRepeatTracksSize + gapSize * autoRepeatTrackListLength;
unsigned repetitions = 1 + (freeSpace / autoRepeatSizeWithGap).toUnsigned();
freeSpace -= autoRepeatSizeWithGap * (repetitions - 1);
ASSERT(freeSpace >= 0);
