Changeset 154753 in webkit for trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html

Timestamp:

Aug 28, 2013, 9:48:53 AM (12 years ago)

Author:

sergio@webkit.org

Message:

[CSS Grid Layout] Handle 'span' positions during layout
​https://bugs.webkit.org/show_bug.cgi?id=119756

Reviewed by Andreas Kling.

From Blink r149133 by <​jchaffraix@chromium.org>

Source/WebCore:

Properly handle the 'span' keyword during layout. We only had
parsing support so far but with this change we are able to
recognize these positions and act accordingly.

• rendering/RenderGrid.cpp:

(WebCore::RenderGrid::resolveGridPositionsFromStyle):
(WebCore::RenderGrid::resolveGridPositionAgainstOppositePosition):

• rendering/RenderGrid.h:
• rendering/style/GridPosition.h:

(WebCore::GridPosition::shouldBeResolvedAgainstOppositePosition):

LayoutTests:

Added some new test cases to verify that we properly resolve
'span' positions.

• fast/css-grid-layout/grid-item-negative-position-resolution-expected.txt:
• fast/css-grid-layout/grid-item-negative-position-resolution.html:
• fast/css-grid-layout/grid-item-spanning-resolution-expected.txt:
• fast/css-grid-layout/grid-item-spanning-resolution.html:

File:

• trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html (modified) (2 diffs)

trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html

@@ -49 +49 @@
     -webkit-grid-column: 3 / 4;
     -webkit-grid-row: 3 / 4;
+}
+
+.firstRowSpanning3SecondColumn {
+    -webkit-grid-column: 2;
+    -webkit-grid-row: 1 / span 3;
+}
+
+.thirdRowSecondColumnSpanning2 {
+    -webkit-grid-column: 2 / span 2;
+    -webkit-grid-row: 3;
+}
+
+.spanning3Row5SecondColumn {
+    -webkit-grid-column: 2;
+    -webkit-grid-row: span 3 / 5;
+}
+
+.thirdRowSpanning2Column3 {
+    -webkit-grid-column: span 2 / 3;
+    -webkit-grid-row: 3;
+}
+
+.underflowSpanning {
+    -webkit-grid-column: span 3 / 3;
+    -webkit-grid-row: span 8 / 4;
 }
 </style>
@@ -127 +152 @@
     <div class="sizedToGridArea thirdRowThirdColumnNoSpan" data-offset-x="100" data-offset-y="50" data-expected-width="50" data-expected-height="25"></div>
 </div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+    <div class="sizedToGridArea firstRowSpanning3SecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="50" data-expected-height="75"></div>
+</div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+    <div class="sizedToGridArea thirdRowSecondColumnSpanning2" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="25"></div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+    <div class="sizedToGridArea spanning3Row5SecondColumn" data-offset-x="50" data-offset-y="25" data-expected-width="50" data-expected-height="75"></div>
+</div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+    <div class="sizedToGridArea thirdRowSpanning2Column3" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="25"></div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+    <div class="sizedToGridArea underflowSpanning" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="75"></div>
+</div>
+
 </body>
 </html>