Title: [141317] trunk
Revision
141317
Author
jchaffr...@webkit.org
Date
2013-01-30 14:41:59 -0800 (Wed, 30 Jan 2013)

Log Message

[CSS Grid Layout] Support 'auto' sized grid items
https://bugs.webkit.org/show_bug.cgi?id=103332

Reviewed by Tony Chang.

Source/WebCore:

Tests: fast/css-grid-layout/auto-content-resolution-columns.html
       fast/css-grid-layout/auto-content-resolution-rows.html

The specification interprets 'auto' as minmax(min-content, max-content).
Because we stored the grid definitions as an 'auto' length, we wouldn't
handle it properly during layout.

This change makes us do the translation when we query the information for
layout.

* rendering/style/GridTrackSize.h:
(WebCore::GridTrackSize::minTrackBreadth):
(WebCore::GridTrackSize::maxTrackBreadth):
Translate 'auto' to minmax(min-content, max-content). This works as getComputedStyle
still sees the GridTrackSize as a single length and thus query length() instead of the
individual component of minmax().

LayoutTests:

* fast/css-grid-layout/auto-content-resolution-columns-expected.txt: Added.
* fast/css-grid-layout/auto-content-resolution-columns.html: Added.
* fast/css-grid-layout/auto-content-resolution-rows-expected.txt: Added.
* fast/css-grid-layout/auto-content-resolution-rows.html: Added.

Modified Paths

Added Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (141316 => 141317)


--- trunk/LayoutTests/ChangeLog	2013-01-30 22:39:41 UTC (rev 141316)
+++ trunk/LayoutTests/ChangeLog	2013-01-30 22:41:59 UTC (rev 141317)
@@ -1,3 +1,15 @@
+2013-01-30  Julien Chaffraix  <jchaffr...@webkit.org>
+
+        [CSS Grid Layout] Support 'auto' sized grid items
+        https://bugs.webkit.org/show_bug.cgi?id=103332
+
+        Reviewed by Tony Chang.
+
+        * fast/css-grid-layout/auto-content-resolution-columns-expected.txt: Added.
+        * fast/css-grid-layout/auto-content-resolution-columns.html: Added.
+        * fast/css-grid-layout/auto-content-resolution-rows-expected.txt: Added.
+        * fast/css-grid-layout/auto-content-resolution-rows.html: Added.
+
 2013-01-30  Alec Flett  <alecfl...@chromium.org>
 
         IndexedDB: Avoid crashing when deleting indexes

Added: trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-columns-expected.txt (0 => 141317)


--- trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-columns-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-columns-expected.txt	2013-01-30 22:41:59 UTC (rev 141317)
@@ -0,0 +1,8 @@
+Test that resolving auto tracks on grid items works properly.
+
+XXX XXX XXX
+PASS
+XX XX XX XX XX XX
+PASS
+XXXXX
+PASS

Added: trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-columns.html (0 => 141317)


--- trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-columns.html	                        (rev 0)
+++ trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-columns.html	2013-01-30 22:41:59 UTC (rev 141317)
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html>
+<script>
+if (window.testRunner)
+    testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1);
+</script>
+<link href="" rel="stylesheet">
+<style>
+.gridAutoContent {
+    -webkit-grid-columns: auto;
+    -webkit-grid-rows: 50px;
+}
+
+/* This rule makes sure the container is smaller than any grid items to avoid distributing any extra logical space to them. */
+.constrainedContainer {
+    width: 10px;
+    height: 10px;
+}
+
+.firstRowFirstColumn {
+    font: 10px/1 Ahem;
+    /* Make us fit our grid area. */
+    width: 100%;
+    height: 100%;
+}
+</style>
+<script src=""
+<body _onload_="checkLayout('.gridAutoContent');">
+
+<p>Test that resolving auto tracks on grid items works properly.</p>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoContent">
+        <div class="firstRowFirstColumn" data-expected-width="30" data-expected-height="50">XXX XXX XXX</div>
+    </div>
+</div>
+
+<!-- Allow the extra logical space distribution to occur. -->
+<div style="width: 40px; height: 10px">
+    <div class="grid gridAutoContent">
+        <div class="firstRowFirstColumn" data-expected-width="40" data-expected-height="50">XX XX XX XX XX XX</div>
+    </div>
+</div>
+
+<div style="width: 100px; height: 10px;">
+    <div class="grid gridAutoContent">
+        <div class="firstRowFirstColumn" data-expected-width="50" data-expected-height="50">XXXXX</div>
+    </div>
+</div>
+
+</body>
+</html>

Added: trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-rows-expected.txt (0 => 141317)


--- trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-rows-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-rows-expected.txt	2013-01-30 22:41:59 UTC (rev 141317)
@@ -0,0 +1,8 @@
+Test that resolving auto tracks on grid items works properly.
+
+XXXXX XXXXX XXXXX
+PASS
+XXXXX XXXXX XXXXX
+PASS
+XXXXX XXXXX XXXXX XXXXX XXXXX XXXXX
+PASS

Added: trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-rows.html (0 => 141317)


--- trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-rows.html	                        (rev 0)
+++ trunk/LayoutTests/fast/css-grid-layout/auto-content-resolution-rows.html	2013-01-30 22:41:59 UTC (rev 141317)
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html>
+<script>
+if (window.testRunner)
+    testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1);
+</script>
+<link href="" rel="stylesheet">
+<style>
+.gridAutoContent {
+    -webkit-grid-columns: 50px;
+    -webkit-grid-rows: auto;
+}
+
+/* This rule makes sure the container is smaller than any grid items to avoid distributing any extra logical space to them. */
+.constrainedContainer {
+    width: 10px;
+    height: 10px;
+}
+
+.firstRowFirstColumn {
+    font: 10px/1 Ahem;
+    /* Make us fit our grid area. */
+    width: 100%;
+    height: 100%;
+}
+</style>
+<script src=""
+<body _onload_="checkLayout('.gridAutoContent');">
+
+<p>Test that resolving auto tracks on grid items works properly.</p>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoContent">
+        <div class="firstRowFirstColumn" data-expected-width="50" data-expected-height="30">XXXXX XXXXX XXXXX</div>
+    </div>
+</div>
+
+<!-- Allow the extra logical space distribution to occur. -->
+<div style="width: 40px; height: 10px">
+    <div class="grid gridAutoContent">
+        <div class="firstRowFirstColumn" data-expected-width="50" data-expected-height="30">XXXXX XXXXX XXXXX</div>
+    </div>
+</div>
+
+<div style="width: 40px; height: 10px;">
+    <div class="grid gridAutoContent">
+        <div class="firstRowFirstColumn" data-expected-width="50" data-expected-height="60">XXXXX XXXXX XXXXX XXXXX XXXXX XXXXX</div>
+    </div>
+</div>
+
+</body>
+</html>

Modified: trunk/Source/WebCore/ChangeLog (141316 => 141317)


--- trunk/Source/WebCore/ChangeLog	2013-01-30 22:39:41 UTC (rev 141316)
+++ trunk/Source/WebCore/ChangeLog	2013-01-30 22:41:59 UTC (rev 141317)
@@ -1,3 +1,27 @@
+2013-01-30  Julien Chaffraix  <jchaffr...@webkit.org>
+
+        [CSS Grid Layout] Support 'auto' sized grid items
+        https://bugs.webkit.org/show_bug.cgi?id=103332
+
+        Reviewed by Tony Chang.
+
+        Tests: fast/css-grid-layout/auto-content-resolution-columns.html
+               fast/css-grid-layout/auto-content-resolution-rows.html
+
+        The specification interprets 'auto' as minmax(min-content, max-content).
+        Because we stored the grid definitions as an 'auto' length, we wouldn't
+        handle it properly during layout.
+
+        This change makes us do the translation when we query the information for
+        layout.
+
+        * rendering/style/GridTrackSize.h:
+        (WebCore::GridTrackSize::minTrackBreadth):
+        (WebCore::GridTrackSize::maxTrackBreadth):
+        Translate 'auto' to minmax(min-content, max-content). This works as getComputedStyle
+        still sees the GridTrackSize as a single length and thus query length() instead of the
+        individual component of minmax().
+
 2013-01-30  Alec Flett  <alecfl...@chromium.org>
 
         IndexedDB: Avoid crashing when deleting indexes

Modified: trunk/Source/WebCore/rendering/style/GridTrackSize.h (141316 => 141317)


--- trunk/Source/WebCore/rendering/style/GridTrackSize.h	2013-01-30 22:39:41 UTC (rev 141316)
+++ trunk/Source/WebCore/rendering/style/GridTrackSize.h	2013-01-30 22:41:59 UTC (rev 141317)
@@ -67,12 +67,20 @@
     const Length& minTrackBreadth() const
     {
         ASSERT(!m_minTrackBreadth.isUndefined());
+        if (m_minTrackBreadth.isAuto()) {
+            DEFINE_STATIC_LOCAL(Length, minContent, (MinContent));
+            return minContent;
+        }
         return m_minTrackBreadth;
     }
 
     const Length& maxTrackBreadth() const
     {
         ASSERT(!m_maxTrackBreadth.isUndefined());
+        if (m_maxTrackBreadth.isAuto()) {
+            DEFINE_STATIC_LOCAL(Length, maxContent, (MaxContent));
+            return maxContent;
+        }
         return m_maxTrackBreadth;
     }
 
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to