Changeset 236126 in webkit

Timestamp:

Sep 18, 2018, 8:13:40 AM (8 years ago)

Author:

Manuel Rego Casasnovas

Message:

[css-grid] Static position should use content-box, not padding-box
​https://bugs.webkit.org/show_bug.cgi?id=189698

Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

• web-platform-tests/css/css-grid/abspos/absolute-positioning-grid-container-parent-001.html:

Update tests from WPT.

Source/WebCore:

This is a recent change by the CSSWG:
​https://github.com/w3c/csswg-drafts/issues/3020

The spec text (​https://drafts.csswg.org/css-grid/#static-position):

"The static position of an absolutely-positioned child

of a grid container is determined as if it were the sole grid item
in a grid area whose edges coincide with the content edges
of the grid container."

Test: imported/w3c/web-platform-tests/css/css-grid/abspos/absolute-positioning-grid-container-parent-001.html

• rendering/RenderGrid.cpp:

(WebCore::RenderGrid::prepareChildForPositionedLayout):
Simple change to use border and padding.

Location:

trunk

Files:

• LayoutTests/imported/w3c/ChangeLog (modified) (1 diff)
• LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/absolute-positioning-grid-container-parent-001.html (modified) (6 diffs)
• Source/WebCore/ChangeLog (modified) (1 diff)
• Source/WebCore/rendering/RenderGrid.cpp (modified) (1 diff)

trunk/LayoutTests/imported/w3c/ChangeLog

@@ +1 @@
+2018-09-18  Manuel Rego Casasnovas  <rego@igalia.com>
+
+        [css-grid] Static position should use content-box, not padding-box
+        https://bugs.webkit.org/show_bug.cgi?id=189698
+
+        Reviewed by Javier Fernandez.
+
+        * web-platform-tests/css/css-grid/abspos/absolute-positioning-grid-container-parent-001.html:
+        Update tests from WPT.
+
 2018-09-12  Ryosuke Niwa  <rniwa@webkit.org>
 

trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/abspos/absolute-positioning-grid-container-parent-001.html

@@ -42 +42 @@
 <div class="container relative">
   <div class="grid">
-    <div class="sizedToGridArea absolute autoRowAutoColumn" data-offset-x="35" data-offset-y="5" data-expected-width="500" data-expected-height="400"></div>
+    <div class="sizedToGridArea absolute autoRowAutoColumn" data-offset-x="50" data-offset-y="10" data-expected-width="500" data-expected-height="400"></div>
   </div>
 </div>
@@ -48 +48 @@
 <div class="container relative">
   <div class="grid">
-    <div class="sizedToGridArea absolute firstRowFirstColumn" data-offset-x="35" data-offset-y="5" data-expected-width="500" data-expected-height="400"></div>
+    <div class="sizedToGridArea absolute firstRowFirstColumn" data-offset-x="50" data-offset-y="10" data-expected-width="500" data-expected-height="400"></div>
   </div>
 </div>
@@ -54 +54 @@
 <div class="container relative">
   <div class="grid">
-    <div class="sizedToGridArea absolute secondRowSecondColumn" data-offset-x="35" data-offset-y="5" data-expected-width="500" data-expected-height="400"></div>
+    <div class="sizedToGridArea absolute secondRowSecondColumn" data-offset-x="50" data-offset-y="10" data-expected-width="500" data-expected-height="400"></div>
   </div>
 </div>
@@ -78 +78 @@
 <div class="container relative">
   <div class="grid directionRTL">
-    <div class="sizedToGridArea absolute autoRowAutoColumn" data-offset-x="-135" data-offset-y="5" data-expected-width="500" data-expected-height="400"></div>
+    <div class="sizedToGridArea absolute autoRowAutoColumn" data-offset-x="-150" data-offset-y="10" data-expected-width="500" data-expected-height="400"></div>
   </div>
 </div>
@@ -84 +84 @@
 <div class="container relative">
   <div class="grid directionRTL">
-    <div class="sizedToGridArea absolute firstRowFirstColumn" data-offset-x="-135" data-offset-y="5" data-expected-width="500" data-expected-height="400"></div>
+    <div class="sizedToGridArea absolute firstRowFirstColumn" data-offset-x="-150" data-offset-y="10" data-expected-width="500" data-expected-height="400"></div>
   </div>
 </div>
@@ -90 +90 @@
 <div class="container relative">
   <div class="grid directionRTL">
-    <div class="sizedToGridArea absolute secondRowSecondColumn" data-offset-x="-135" data-offset-y="5" data-expected-width="500" data-expected-height="400"></div>
+    <div class="sizedToGridArea absolute secondRowSecondColumn" data-offset-x="-150" data-offset-y="10" data-expected-width="500" data-expected-height="400"></div>
   </div>
 </div>

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2018-09-18  Manuel Rego Casasnovas  <rego@igalia.com>
+
+        [css-grid] Static position should use content-box, not padding-box
+        https://bugs.webkit.org/show_bug.cgi?id=189698
+
+        Reviewed by Javier Fernandez.
+
+        This is a recent change by the CSSWG:
+        https://github.com/w3c/csswg-drafts/issues/3020
+
+        The spec text (https://drafts.csswg.org/css-grid/#static-position):
+          "The static position of an absolutely-positioned child
+           of a grid container is determined as if it were the sole grid item
+           in a grid area whose edges coincide with the content edges
+           of the grid container."
+
+        Test: imported/w3c/web-platform-tests/css/css-grid/abspos/absolute-positioning-grid-container-parent-001.html
+
+        * rendering/RenderGrid.cpp:
+        (WebCore::RenderGrid::prepareChildForPositionedLayout):
+        Simple change to use border and padding.
+
 2018-09-18  Xabier Rodriguez Calvar  <calvaris@igalia.com>
 

trunk/Source/WebCore/rendering/RenderGrid.cpp

@@ -904 +904 @@
 
     RenderLayer* childLayer = child.layer();
-    childLayer->setStaticInlinePosition(borderStart());
-    childLayer->setStaticBlockPosition(borderBefore());
+    // Static position of a positioned child should use the content-box (https://drafts.csswg.org/css-grid/#static-position).
+    childLayer->setStaticInlinePosition(borderAndPaddingStart());
+    childLayer->setStaticBlockPosition(borderAndPaddingBefore());
 }