Diff
Modified: trunk/LayoutTests/ChangeLog (234130 => 234131)
--- trunk/LayoutTests/ChangeLog 2018-07-24 02:18:12 UTC (rev 234130)
+++ trunk/LayoutTests/ChangeLog 2018-07-24 04:50:20 UTC (rev 234131)
@@ -1,3 +1,14 @@
+2018-07-23 Manuel Rego Casasnovas <[email protected]>
+
+ [css-grid] Add support for calc() in gutter properties
+ https://bugs.webkit.org/show_bug.cgi?id=187902
+
+ Reviewed by Simon Fraser.
+
+ Two tests are now passing thanks to this change.
+
+ * TestExpectations:
+
2018-07-23 Andy VanWagoner <[email protected]>
[INTL] Language tags are not canonicalized
Modified: trunk/LayoutTests/TestExpectations (234130 => 234131)
--- trunk/LayoutTests/TestExpectations 2018-07-24 02:18:12 UTC (rev 234130)
+++ trunk/LayoutTests/TestExpectations 2018-07-24 04:50:20 UTC (rev 234131)
@@ -2109,7 +2109,6 @@
imported/w3c/web-platform-tests/css/css-text-decor/text-emphasis-style-007.html [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-display/run-in/run-in-basic-007.xht [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-grid/grid-items/percentage-size-replaced-subitems-001.html [ ImageOnlyFailure ]
-imported/w3c/web-platform-tests/css/css-grid/alignment/grid-gutters-012.html [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/cssom-view/scrollingElement-quirks-dynamic-002.html [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-text-decor/text-emphasis-position-above-right-002.xht [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-display/run-in/run-in-contains-abspos-001.xht [ ImageOnlyFailure ]
@@ -2137,7 +2136,6 @@
imported/w3c/web-platform-tests/css/css-ui/text-overflow-028.html [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-text-decor/text-emphasis-position-below-left-001.xht [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-display/display-contents-details.html [ ImageOnlyFailure ]
-imported/w3c/web-platform-tests/css/css-grid/alignment/grid-gutters-011.html [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-shapes/shape-outside/shape-image/gradients/shape-outside-linear-gradient-010.html [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-display/run-in/run-in-breaking-002.xht [ ImageOnlyFailure ]
imported/w3c/web-platform-tests/css/css-display/run-in/run-in-inline-between-003.xht [ ImageOnlyFailure ]
Modified: trunk/LayoutTests/imported/w3c/ChangeLog (234130 => 234131)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2018-07-24 02:18:12 UTC (rev 234130)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2018-07-24 04:50:20 UTC (rev 234131)
@@ -1,3 +1,18 @@
+2018-07-23 Manuel Rego Casasnovas <[email protected]>
+
+ [css-grid] Add support for calc() in gutter properties
+ https://bugs.webkit.org/show_bug.cgi?id=187902
+
+ Reviewed by Simon Fraser.
+
+ Two new WPT tests are imported to verify the expected behavior.
+
+ * web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-expected.txt: Added.
+ * web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl-expected.txt: Added.
+ * web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl.html: Added.
+ * web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002.html: Added.
+ * web-platform-tests/css/css-grid/abspos/w3c-import.log:
+
2018-07-23 Sihui Liu <[email protected]>
CrashTracer: com.apple.WebKit.Storage at WebCore: WebCore::encodeKey
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-expected.txt (0 => 234131)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-expected.txt 2018-07-24 04:50:20 UTC (rev 234131)
@@ -0,0 +1,4 @@
+
+PASS .grid 1
+PASS .grid 2
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl-expected.txt (0 => 234131)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl-expected.txt 2018-07-24 04:50:20 UTC (rev 234131)
@@ -0,0 +1,4 @@
+
+PASS .grid 1
+PASS .grid 2
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl.html (0 => 234131)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl.html 2018-07-24 04:50:20 UTC (rev 234131)
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Grid positioned items percentage and calc() gaps</title>
+<link rel="author" title="Manuel Rego Casasnovas" href=""
+<link rel="help" href=""
+<link rel="help" href=""
+<meta name="assert" content="This test checks the behavior of the positioned items in a grid container with percentage and calc() gaps.">
+<link rel="stylesheet" href=""
+<style>
+
+.grid {
+ grid-template-columns: 100px 100px 100px 100px;
+ grid-template-rows: 50px 50px 50px 50px;
+ width: 800px;
+ height: 600px;
+ border: 5px solid black;
+ margin: 30px;
+ padding: 15px;
+ /* Ensures that the grid container is the containing block of the absolutely positioned grid children. */
+ position: relative;
+}
+
+.grid > div {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background-color: lime;
+}
+
+</style>
+<script src=""
+<script src=""
+<script src=""
+
+<body _onload_="checkLayout('.grid')">
+
+<div id="log"></div>
+
+<div class="grid directionRTL" style="gap: 10%;">
+ <div style="grid-column: 2 / 4; grid-row: 2 / 4;"
+ data-offset-x="355" data-offset-y="125" data-expected-width="280" data-expected-height="160">
+ </div>
+</div>
+
+<div class="grid directionRTL" style="gap: calc(10% + 25px);">
+ <div style="grid-column: 2 / 4; grid-row: 2 / 4;"
+ data-offset-x="305" data-offset-y="150" data-expected-width="305" data-expected-height="185">
+ </div>
+</div>
+
+</body>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002.html (0 => 234131)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002.html 2018-07-24 04:50:20 UTC (rev 234131)
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Grid positioned items percentage and calc() gaps</title>
+<link rel="author" title="Manuel Rego Casasnovas" href=""
+<link rel="help" href=""
+<link rel="help" href=""
+<meta name="assert" content="This test checks the behavior of the positioned items in a grid container with percentage and calc() gaps.">
+<link rel="stylesheet" href=""
+<style>
+
+.grid {
+ grid-template-columns: 100px 100px 100px 100px;
+ grid-template-rows: 50px 50px 50px 50px;
+ width: 800px;
+ height: 600px;
+ border: 5px solid black;
+ margin: 30px;
+ padding: 15px;
+ /* Ensures that the grid container is the containing block of the absolutely positioned grid children. */
+ position: relative;
+}
+
+.grid > div {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background-color: lime;
+}
+
+</style>
+<script src=""
+<script src=""
+<script src=""
+
+<body _onload_="checkLayout('.grid')">
+
+<div id="log"></div>
+
+<div class="grid" style="gap: 10%;">
+ <div style="grid-column: 2 / 4; grid-row: 2 / 4;"
+ data-offset-x="195" data-offset-y="125" data-expected-width="280" data-expected-height="160">
+ </div>
+</div>
+
+<div class="grid" style="gap: calc(10% + 25px);">
+ <div style="grid-column: 2 / 4; grid-row: 2 / 4;"
+ data-offset-x="220" data-offset-y="150" data-expected-width="305" data-expected-height="185">
+ </div>
+</div>
+
+</body>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/w3c-import.log (234130 => 234131)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/w3c-import.log 2018-07-24 02:18:12 UTC (rev 234130)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/w3c-import.log 2018-07-24 04:50:20 UTC (rev 234131)
@@ -1,7 +1,7 @@
The tests in this directory were imported from the W3C repository.
Do NOT modify these tests directly in WebKit.
Instead, create a pull request on the WPT github:
- https://github.com/w3c/web-platform-tests
+ https://github.com/web-platform-tests/wpt
Then run the Tools/Scripts/import-w3c-tests in WebKit to reimport
@@ -41,6 +41,8 @@
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-content-alignment-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-content-alignment-rtl-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-001.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-rtl-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-implicit-grid-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-implicit-grid-line-001.html
Modified: trunk/Source/WebCore/ChangeLog (234130 => 234131)
--- trunk/Source/WebCore/ChangeLog 2018-07-24 02:18:12 UTC (rev 234130)
+++ trunk/Source/WebCore/ChangeLog 2018-07-24 04:50:20 UTC (rev 234131)
@@ -1,3 +1,24 @@
+2018-07-23 Manuel Rego Casasnovas <[email protected]>
+
+ [css-grid] Add support for calc() in gutter properties
+ https://bugs.webkit.org/show_bug.cgi?id=187902
+
+ Reviewed by Simon Fraser.
+
+ The parsing was already accepting calc() in grid row and column gaps,
+ however the code was not taking that into account properly.
+ If the calc() had a percentage it was ignored and that's wrong.
+
+ The fix is just a change in the ceck at RenderGrid::availableSpaceForGutters().
+
+ Tests: imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002-rtl.html
+ imported/w3c/web-platform-tests/css/css-grid/abspos/grid-positioned-items-gaps-002.html
+ imported/w3c/web-platform-tests/css/css-grid/alignment/grid-gutters-011.html
+ imported/w3c/web-platform-tests/css/css-grid/alignment/grid-gutters-012.html
+
+ * rendering/RenderGrid.cpp:
+ (WebCore::RenderGrid::availableSpaceForGutters const):
+
2018-07-23 Aditya Keerthi <[email protected]>
Remove extraneous #endif in html.css
Modified: trunk/Source/WebCore/rendering/RenderGrid.cpp (234130 => 234131)
--- trunk/Source/WebCore/rendering/RenderGrid.cpp 2018-07-24 02:18:12 UTC (rev 234130)
+++ trunk/Source/WebCore/rendering/RenderGrid.cpp 2018-07-24 04:50:20 UTC (rev 234131)
@@ -141,7 +141,7 @@
{
bool isRowAxis = direction == ForColumns;
const GapLength& gapLength = isRowAxis ? style().columnGap() : style().rowGap();
- if (gapLength.isNormal() || !gapLength.length().isPercent())
+ if (gapLength.isNormal() || !gapLength.length().isPercentOrCalculated())
return std::nullopt;
return isRowAxis ? availableLogicalWidth() : availableLogicalHeightForPercentageComputation();
