[CSS Grid Layout] getComputedStyle() must return the specified value for positioning...
authorsvillar@igalia.com <svillar@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 26 Mar 2014 16:45:21 +0000 (16:45 +0000)
committersvillar@igalia.com <svillar@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 26 Mar 2014 16:45:21 +0000 (16:45 +0000)
https://bugs.webkit.org/show_bug.cgi?id=130010

Reviewed by Darin Adler.

Source/WebCore:

According to the specs
http://dev.w3.org/csswg/css-grid/#property-index and also to
http://lists.w3.org/Archives/Public/www-style/2014Mar/0162.html
the function getComputedStyle() must return the specified values
for positioning properties, i.e, grid-{columns|rows}-{start|end}.

We were in some cases, adjusting the style in the StyleResolver
(for example with two opposing spans) something that is now done
in the RenderGrid because we cannot alter the original style.

The code moved to the renderer became more self explanatory and it
now supports named grid areas with names ending in "-start" and
"-end".

Test: fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set.html

* css/StyleResolver.cpp:
(WebCore::StyleResolver::adjustRenderStyle):
(WebCore::gridLineDefinedBeforeGridArea): Deleted.
(WebCore::StyleResolver::adjustNamedGridItemPosition): Deleted.
(WebCore::StyleResolver::adjustGridItemPosition): Deleted.
* css/StyleResolver.h:
* rendering/RenderGrid.cpp:
(WebCore::isColumnSide):
(WebCore::RenderGrid::explicitGridSizeForSide):
(WebCore::gridLineDefinedBeforeGridArea):
(WebCore::setNamedLinePositionIfDefinedBeforeArea):
(WebCore::RenderGrid::adjustNamedGridItemPosition):
(WebCore::RenderGrid::adjustGridPositionsFromStyle):
(WebCore::RenderGrid::resolveGridPositionsFromStyle):
(WebCore::RenderGrid::resolveNamedGridLinePositionFromStyle):
(WebCore::RenderGrid::resolveNamedGridLinePositionAgainstOppositePosition):
* rendering/RenderGrid.h:
* rendering/style/GridPosition.h:
(WebCore::GridPosition::setAutoPosition): New helper function.

LayoutTests:

Updated the return value of getComputedStyle(), it must be always
the specified value.

Added also a new test that verifies the resolution of names in
grid positioning properties, both grid area names and grid line
names (including any combination of the two).

* fast/css-grid-layout/grid-item-area-get-set-expected.txt:
* fast/css-grid-layout/grid-item-area-get-set.html:
* fast/css-grid-layout/grid-item-column-row-get-set-expected.txt:
* fast/css-grid-layout/grid-item-column-row-get-set.html:
* fast/css-grid-layout/grid-item-end-after-get-set-expected.txt:
* fast/css-grid-layout/grid-item-end-after-get-set.html:
* fast/css-grid-layout/grid-item-spanning-resolution-expected.txt:
* fast/css-grid-layout/grid-item-spanning-resolution.html:
* fast/css-grid-layout/grid-item-start-before-get-set-expected.txt:
* fast/css-grid-layout/grid-item-start-before-get-set.html:
* fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set-expected.txt: Added.
* fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set.html: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@166299 268f45cc-cd09-0410-ab3c-d52691b4dbfc

21 files changed:
LayoutTests/ChangeLog
LayoutTests/fast/css-grid-layout/grid-item-area-get-set-expected.txt
LayoutTests/fast/css-grid-layout/grid-item-area-get-set.html
LayoutTests/fast/css-grid-layout/grid-item-column-row-get-set-expected.txt
LayoutTests/fast/css-grid-layout/grid-item-column-row-get-set.html [changed mode: 0755->0644]
LayoutTests/fast/css-grid-layout/grid-item-end-after-get-set-expected.txt
LayoutTests/fast/css-grid-layout/grid-item-end-after-get-set.html
LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution-expected.txt
LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html
LayoutTests/fast/css-grid-layout/grid-item-start-before-get-set-expected.txt
LayoutTests/fast/css-grid-layout/grid-item-start-before-get-set.html
LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set-expected.txt [new file with mode: 0644]
LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set.html [new file with mode: 0644]
LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution-expected.txt
LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution.html
Source/WebCore/ChangeLog
Source/WebCore/css/StyleResolver.cpp
Source/WebCore/css/StyleResolver.h
Source/WebCore/rendering/RenderGrid.cpp
Source/WebCore/rendering/RenderGrid.h
Source/WebCore/rendering/style/GridPosition.h

index 3c5373a..5c41625 100644 (file)
@@ -1,3 +1,30 @@
+2014-03-26  Sergio Villar Senin  <svillar@igalia.com>
+
+        [CSS Grid Layout] getComputedStyle() must return the specified value for positioning properties
+        https://bugs.webkit.org/show_bug.cgi?id=130010
+
+        Reviewed by Darin Adler.
+
+        Updated the return value of getComputedStyle(), it must be always
+        the specified value.
+
+        Added also a new test that verifies the resolution of names in
+        grid positioning properties, both grid area names and grid line
+        names (including any combination of the two).
+
+        * fast/css-grid-layout/grid-item-area-get-set-expected.txt:
+        * fast/css-grid-layout/grid-item-area-get-set.html:
+        * fast/css-grid-layout/grid-item-column-row-get-set-expected.txt:
+        * fast/css-grid-layout/grid-item-column-row-get-set.html:
+        * fast/css-grid-layout/grid-item-end-after-get-set-expected.txt:
+        * fast/css-grid-layout/grid-item-end-after-get-set.html:
+        * fast/css-grid-layout/grid-item-spanning-resolution-expected.txt:
+        * fast/css-grid-layout/grid-item-spanning-resolution.html:
+        * fast/css-grid-layout/grid-item-start-before-get-set-expected.txt:
+        * fast/css-grid-layout/grid-item-start-before-get-set.html:
+        * fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set-expected.txt: Added.
+        * fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set.html: Added.
+
 2014-03-26  Darin Adler  <darin@apple.com>
 
         Update LayoutTests to depend on load events rather than on starting loads synchronously
index 11cb04a..55e6f34 100644 (file)
@@ -30,7 +30,7 @@ PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "9"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "firstArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "span 1"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "nonexistent"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "1 foobar"
 
 Test getting and setting grid-area set through JS
index 38aa5a8..b256aa4 100644 (file)
@@ -37,7 +37,7 @@ if (window.testRunner)
 }
 
 #fourValueMixedGridArea {
-    -webkit-grid-area: firstArea / span / nonExistent / "foobar";
+    -webkit-grid-area: firstArea / span / nonexistent / "foobar";
 }
 </style>
 <script src="../../resources/js-test-pre.js"></script>
@@ -106,7 +106,7 @@ if (window.testRunner)
     testGridAreaCSSParsing("twoValueIdentGridArea", "firstArea", "secondArea", "firstArea", "secondArea");
     testGridAreaCSSParsing("threeValueGridArea", "span 1", "10", "-1");
     testGridAreaCSSParsing("fourValueGridArea", "-5", "span 5", "span 8", "9");
-    testGridAreaCSSParsing("fourValueMixedGridArea", "firstArea", "span 1", "auto", "1 foobar");
+    testGridAreaCSSParsing("fourValueMixedGridArea", "firstArea", "span 1", "nonexistent", "1 foobar");
 
     debug("");
     debug("Test getting and setting grid-area set through JS");
index 19ad98f..8a1ad69 100644 (file)
@@ -52,12 +52,12 @@ PASS getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValue('-webki
 PASS getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValue('-webkit-grid-row') is "3 / span 5"
 PASS getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValue('-webkit-grid-row-start') is "3"
 PASS getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValue('-webkit-grid-row-end') is "span 5"
-PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
-PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-column-start') is "auto"
-PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
-PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-row-start') is "auto"
-PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-column') is "span 1 / span 1"
+PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-column-start') is "span 1"
+PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-column-end') is "span 1"
+PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-row') is "span 1 / span 1"
+PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-row-start') is "span 1"
+PASS getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValue('-webkit-grid-row-end') is "span 1"
 PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
 PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-column-start') is "auto"
 PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-column-end') is "auto"
@@ -194,24 +194,36 @@ PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end')
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "span 2 last / -1 nav"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "span 2 last"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "-1 nav"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "5 / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "5 / none"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "5"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "8 / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "none"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "8 / foobar"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "8"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "span 3 first / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "foobar"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "nonExistent / none"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "nonExistent"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "none"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "nonExistent / foobar"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "nonExistent"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "foobar"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "span 3 first / none"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "span 3 first"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "span 1 last / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "none"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "span 1 last / foobar"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "span 1 last"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "foobar"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "span 5 / span 2"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "span 5"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "span 2"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "span 1 first / span 1 last"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "span 1 first"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "span 1 last"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "span 5 first / span 2 last"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "span 5 first"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "span 2 last"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "span 3 first / span 7 last"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "span 3 first"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "span 7 last"
 
 Test setting grid-column and grid-row back to 'auto' through JS
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is '18 / 19'
@@ -442,30 +454,6 @@ PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end')
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
 PASS successfullyParsed is true
 
 TEST COMPLETE
old mode 100755 (executable)
new mode 100644 (file)
index a05bf9d..175732f
@@ -112,7 +112,7 @@ if (window.testRunner)
     testColumnRowCSSParsing("gridItemWithNegativePositiveIntegerElement", "10 / -10", "-8 / 5");
     testColumnRowCSSParsing("gridItemWithBeforeSpanElement", "span 2 / 4", "3 / span 5");
     testColumnRowCSSParsing("gridItemWithAfterSpanElement", "span 2 / 4", "3 / span 5");
-    testColumnRowCSSParsing("gridItemWith2OnlySpanElement", "auto / auto", "auto / auto");
+    testColumnRowCSSParsing("gridItemWith2OnlySpanElement", "span 1 / span 1", "span 1 / span 1");
     testColumnRowCSSParsing("gridItemWith2AutoElement", "auto / auto" , "auto / auto");
     testColumnRowCSSParsing("gridItemWithBothShortLongHandElement", "10 / 11", "4 / 5");
     testColumnRowCSSParsing("gridItemWithNoSpaceElement", "auto / 1", "5 / auto");
@@ -148,9 +148,11 @@ if (window.testRunner)
     testColumnRowJSParsing("'first' / 'last'", "'nav' / 'last' span", "1 first / 1 last", "1 nav / span 1 last");
     testColumnRowJSParsing("3 'first' / 2 'last'", "5 'nav' / 'last' 7 span", "3 first / 2 last", "5 nav / span 7 last");
     testColumnRowJSParsing("3 'first' span / -3 'last'", "'last' 2 span / -1 'nav'", "span 3 first / -3 last", "span 2 last / -1 nav");
-    testColumnRowJSParsing("5 / none", "8 / foobar", "5 / auto", "8 / auto");
-    testColumnRowJSParsing("nonExistent / none", "nonExistent / foobar", "auto / auto", "auto / auto");
-    testColumnRowJSParsing("span 'first' 3 / none", "'last' span / foobar", "span 3 first / auto", "span 1 last / auto");
+    testColumnRowJSParsing("5 / none", "8 / foobar");
+    testColumnRowJSParsing("nonExistent / none", "nonExistent / foobar");
+    testColumnRowJSParsing("span 'first' 3 / none", "'last' span / foobar", "span 3 first / none", "span 1 last / foobar");
+    testColumnRowJSParsing("5 span / span 2", "span 'first' / 'last' span", "span 5 / span 2", "span 1 first / span 1 last");
+    testColumnRowJSParsing("span 5 'first' / span 'last' 2", "3 'first' span / 'last' 7 span", "span 5 first / span 2 last", "span 3 first / span 7 last");
 
     debug("");
     debug("Test setting grid-column and grid-row back to 'auto' through JS");
@@ -218,12 +220,6 @@ if (window.testRunner)
     testColumnRowInvalidJSParsing("0 / span 0", "0 / 0 span");
     testColumnRowInvalidJSParsing("span -3 'first' / 3 'last'", "'last' -2 span / 1 'nav'");
 
-    // Spans for both initial / end values are not allowed.
-    testColumnRowInvalidJSParsing("5 span / span 2", "span 4 / 3 span");
-    testColumnRowInvalidJSParsing("'first' span / span 'last'", "span 4 'first' / 3 span 'last'");
-    testColumnRowInvalidJSParsing("'first' 3 span / span 'last'", "span 'first' / 2 span 'last'");
-    testColumnRowInvalidJSParsing("'first' -1 span / span 'last'", "span -2 'first' / span 'last'");
-
     // We don't allow span to be between the <integer> and the <string>.
     testColumnRowInvalidJSParsing("'first' span 1 / 'last'", "2 span 'first' / 'last'");
     testColumnRowInvalidJSParsing("3 'first' / 2 span 'last'", "5 'nav' / 'last' span 7");
index 6e608ab..c5b1e6a 100644 (file)
@@ -90,18 +90,18 @@ PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end')
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / secondArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "secondArea"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / nonExistentArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "nonExistentArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / secondArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "secondArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / secondArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "secondArea"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / nonExistentArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "nonExistentArea"
 
 Test setting grid-start and grid-before to 'inherit' through JS
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / span 2"
index 2c15f54..6238690 100644 (file)
@@ -85,8 +85,8 @@ if (window.testRunner)
     testColumnEndRowEndJSParsing("span 7", "span 2");
     testColumnEndRowEndJSParsing("auto", "auto");
     testColumnEndRowEndJSParsing("thirdArea", "secondArea");
-    testColumnEndRowEndJSParsing("nonExistentArea", "secondArea", "auto", "secondArea");
-    testColumnEndRowEndJSParsing("secondArea", "nonExistentArea", "secondArea", "auto");
+    testColumnEndRowEndJSParsing("nonExistentArea", "secondArea");
+    testColumnEndRowEndJSParsing("secondArea", "nonExistentArea");
 
     debug("");
     debug("Test setting grid-start and grid-before to 'inherit' through JS");
index 23967a4..facdfec 100644 (file)
@@ -20,6 +20,11 @@ if (window.testRunner)
     width: 200px;
 }
 
+#fixedGrid {
+    -webkit-grid-template-columns: 10px 20px 40px 80px;
+    -webkit-grid-template-rows: 15px 30px 60px 120px;
+}
+
 .negativeOverflowRowFirstColumn {
     -webkit-grid-row: 1 / -5;
     -webkit-grid-column: 1;
@@ -74,6 +79,17 @@ if (window.testRunner)
     -webkit-grid-column: span 3 / 3;
     -webkit-grid-row: span 8 / 4;
 }
+
+.doubleSpan {
+    -webkit-grid-column: span 2 / span 2;
+    -webkit-grid-row: span 3 / span 1;
+}
+
+.spanAndAuto {
+    -webkit-grid-column: auto / span 2;
+    -webkit-grid-row: span 3 / auto;
+}
+
 </style>
 <script src="../../resources/check-layout.js"></script>
 <body onload="checkLayout('.grid');">
@@ -179,5 +195,17 @@ if (window.testRunner)
     <div class="sizedToGridArea underflowSpanning" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="75"></div>
 </div>
 
+<!-- Check that the end span is ignored when two opposing spans are specified-->
+<div style="position: relative">
+<div class="grid" id="fixedGrid" style="-webkit-grid-auto-flow: row;">
+    <div class="sizedToGridArea" style="-webkit-grid-column: 1; -webkit-grid-row: 1;" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="15"></div>
+    <div class="sizedToGridArea doubleSpan" data-offset-x="10" data-offset-y="0" data-expected-width="20" data-expected-height="15"></div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="fixedGrid" style="-webkit-grid-auto-flow: column;">
+    <div class="sizedToGridArea" style="-webkit-grid-column: 1; -webkit-grid-row: 1;" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="15"></div>
+    <div class="sizedToGridArea doubleSpan" data-offset-x="0" data-offset-y="15" data-expected-width="10" data-expected-height="30"></div>
+</div>
 </body>
 </html>
index daf40c2..9c2efcf 100644 (file)
@@ -88,8 +88,8 @@ PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end')
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "secondArea / auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "secondArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "nonExistentArea / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "nonExistentArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "secondArea / auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "secondArea"
@@ -97,8 +97,8 @@ PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "secondArea / auto"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "secondArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
-PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "nonExistentArea / auto"
+PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "nonExistentArea"
 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto"
 
 Test setting grid-start and grid-before to 'inherit' through JS
index 4ad167c..3fc6910 100644 (file)
@@ -90,8 +90,8 @@ if (window.testRunner)
     testColumnStartRowStartJSParsing("span 3", "span 20");
     testColumnStartRowStartJSParsing("auto", "auto");
     testColumnStartRowStartJSParsing("thirdArea", "secondArea");
-    testColumnStartRowStartJSParsing("nonExistentArea", "secondArea", "auto", "secondArea");
-    testColumnStartRowStartJSParsing("secondArea", "nonExistentArea", "secondArea", "auto");
+    testColumnStartRowStartJSParsing("nonExistentArea", "secondArea");
+    testColumnStartRowStartJSParsing("secondArea", "nonExistentArea");
 
     debug("");
     debug("Test setting grid-start and grid-before to 'inherit' through JS");
diff --git a/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set-expected.txt b/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set-expected.txt
new file mode 100644 (file)
index 0000000..27fef39
--- /dev/null
@@ -0,0 +1,316 @@
+PASS getComputedStyle(GridUniqueColumnB, '').getPropertyValue('-webkit-grid-column') is "b / b"
+PASS getComputedStyle(GridUniqueColumnB, '').getPropertyValue('-webkit-grid-column-start') is "b"
+PASS getComputedStyle(GridUniqueColumnB, '').getPropertyValue('-webkit-grid-column-end') is "b"
+PASS getComputedStyle(GridUniqueColumnB, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridUniqueColumnB, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridUniqueColumnB, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridUniqueRowE, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridUniqueRowE, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridUniqueRowE, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridUniqueRowE, '').getPropertyValue('-webkit-grid-row') is "e / e"
+PASS getComputedStyle(GridUniqueRowE, '').getPropertyValue('-webkit-grid-row-start') is "e"
+PASS getComputedStyle(GridUniqueRowE, '').getPropertyValue('-webkit-grid-row-end') is "e"
+PASS getComputedStyle(GridUniqueColumnBStart, '').getPropertyValue('-webkit-grid-column') is "b-start / b-start"
+PASS getComputedStyle(GridUniqueColumnBStart, '').getPropertyValue('-webkit-grid-column-start') is "b-start"
+PASS getComputedStyle(GridUniqueColumnBStart, '').getPropertyValue('-webkit-grid-column-end') is "b-start"
+PASS getComputedStyle(GridUniqueColumnBStart, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridUniqueColumnBStart, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridUniqueColumnBStart, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridUniqueRowGStart, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridUniqueRowGStart, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridUniqueRowGStart, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridUniqueRowGStart, '').getPropertyValue('-webkit-grid-row') is "g-start / g-start"
+PASS getComputedStyle(GridUniqueRowGStart, '').getPropertyValue('-webkit-grid-row-start') is "g-start"
+PASS getComputedStyle(GridUniqueRowGStart, '').getPropertyValue('-webkit-grid-row-end') is "g-start"
+PASS getComputedStyle(GridUniqueColumnBD, '').getPropertyValue('-webkit-grid-column') is "b / d"
+PASS getComputedStyle(GridUniqueColumnBD, '').getPropertyValue('-webkit-grid-column-start') is "b"
+PASS getComputedStyle(GridUniqueColumnBD, '').getPropertyValue('-webkit-grid-column-end') is "d"
+PASS getComputedStyle(GridUniqueColumnBD, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridUniqueColumnBD, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridUniqueColumnBD, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridUniqueRowGH, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridUniqueRowGH, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridUniqueRowGH, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridUniqueRowGH, '').getPropertyValue('-webkit-grid-row') is "g / h"
+PASS getComputedStyle(GridUniqueRowGH, '').getPropertyValue('-webkit-grid-row-start') is "g"
+PASS getComputedStyle(GridUniqueRowGH, '').getPropertyValue('-webkit-grid-row-end') is "h"
+PASS getComputedStyle(GridUniqueColumnCRowF, '').getPropertyValue('-webkit-grid-column') is "c / c"
+PASS getComputedStyle(GridUniqueColumnCRowF, '').getPropertyValue('-webkit-grid-column-start') is "c"
+PASS getComputedStyle(GridUniqueColumnCRowF, '').getPropertyValue('-webkit-grid-column-end') is "c"
+PASS getComputedStyle(GridUniqueColumnCRowF, '').getPropertyValue('-webkit-grid-row') is "f / f"
+PASS getComputedStyle(GridUniqueColumnCRowF, '').getPropertyValue('-webkit-grid-row-start') is "f"
+PASS getComputedStyle(GridUniqueColumnCRowF, '').getPropertyValue('-webkit-grid-row-end') is "f"
+PASS getComputedStyle(GridUniqueColumnBInteger, '').getPropertyValue('-webkit-grid-column') is "b / 4"
+PASS getComputedStyle(GridUniqueColumnBInteger, '').getPropertyValue('-webkit-grid-column-start') is "b"
+PASS getComputedStyle(GridUniqueColumnBInteger, '').getPropertyValue('-webkit-grid-column-end') is "4"
+PASS getComputedStyle(GridUniqueColumnBInteger, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridUniqueColumnBInteger, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridUniqueColumnBInteger, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridUniqueRowIntegerH, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridUniqueRowIntegerH, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridUniqueRowIntegerH, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridUniqueRowIntegerH, '').getPropertyValue('-webkit-grid-row') is "3 / h"
+PASS getComputedStyle(GridUniqueRowIntegerH, '').getPropertyValue('-webkit-grid-row-start') is "3"
+PASS getComputedStyle(GridUniqueRowIntegerH, '').getPropertyValue('-webkit-grid-row-end') is "h"
+PASS getComputedStyle(GridUniqueColumnIntegerRowG, '').getPropertyValue('-webkit-grid-column') is "2 / auto"
+PASS getComputedStyle(GridUniqueColumnIntegerRowG, '').getPropertyValue('-webkit-grid-column-start') is "2"
+PASS getComputedStyle(GridUniqueColumnIntegerRowG, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridUniqueColumnIntegerRowG, '').getPropertyValue('-webkit-grid-row') is "g / g"
+PASS getComputedStyle(GridUniqueColumnIntegerRowG, '').getPropertyValue('-webkit-grid-row-start') is "g"
+PASS getComputedStyle(GridUniqueColumnIntegerRowG, '').getPropertyValue('-webkit-grid-row-end') is "g"
+PASS getComputedStyle(GridUniqueColumnARowInteger, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridUniqueColumnARowInteger, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridUniqueColumnARowInteger, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridUniqueColumnARowInteger, '').getPropertyValue('-webkit-grid-row') is "2 / auto"
+PASS getComputedStyle(GridUniqueColumnARowInteger, '').getPropertyValue('-webkit-grid-row-start') is "2"
+PASS getComputedStyle(GridUniqueColumnARowInteger, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridUniqueColumnCStart, '').getPropertyValue('-webkit-grid-column') is "c-start / c-start"
+PASS getComputedStyle(GridUniqueColumnCStart, '').getPropertyValue('-webkit-grid-column-start') is "c-start"
+PASS getComputedStyle(GridUniqueColumnCStart, '').getPropertyValue('-webkit-grid-column-end') is "c-start"
+PASS getComputedStyle(GridUniqueColumnCStart, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridUniqueColumnCStart, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridUniqueColumnCStart, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridUniqueRowFStart, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridUniqueRowFStart, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridUniqueRowFStart, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridUniqueRowFStart, '').getPropertyValue('-webkit-grid-row') is "f-start / f-start"
+PASS getComputedStyle(GridUniqueRowFStart, '').getPropertyValue('-webkit-grid-row-start') is "f-start"
+PASS getComputedStyle(GridUniqueRowFStart, '').getPropertyValue('-webkit-grid-row-end') is "f-start"
+PASS getComputedStyle(GridUniqueColumnCStartRowFEnd, '').getPropertyValue('-webkit-grid-column') is "c-start / c-start"
+PASS getComputedStyle(GridUniqueColumnCStartRowFEnd, '').getPropertyValue('-webkit-grid-column-start') is "c-start"
+PASS getComputedStyle(GridUniqueColumnCStartRowFEnd, '').getPropertyValue('-webkit-grid-column-end') is "c-start"
+PASS getComputedStyle(GridUniqueColumnCStartRowFEnd, '').getPropertyValue('-webkit-grid-row') is "f-end / f-end"
+PASS getComputedStyle(GridUniqueColumnCStartRowFEnd, '').getPropertyValue('-webkit-grid-row-start') is "f-end"
+PASS getComputedStyle(GridUniqueColumnCStartRowFEnd, '').getPropertyValue('-webkit-grid-row-end') is "f-end"
+PASS getComputedStyle(GridUniqueColumnBEndRowHStart, '').getPropertyValue('-webkit-grid-column') is "b-end / b-end"
+PASS getComputedStyle(GridUniqueColumnBEndRowHStart, '').getPropertyValue('-webkit-grid-column-start') is "b-end"
+PASS getComputedStyle(GridUniqueColumnBEndRowHStart, '').getPropertyValue('-webkit-grid-column-end') is "b-end"
+PASS getComputedStyle(GridUniqueColumnBEndRowHStart, '').getPropertyValue('-webkit-grid-row') is "h-start / h-start"
+PASS getComputedStyle(GridUniqueColumnBEndRowHStart, '').getPropertyValue('-webkit-grid-row-start') is "h-start"
+PASS getComputedStyle(GridUniqueColumnBEndRowHStart, '').getPropertyValue('-webkit-grid-row-end') is "h-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowDStart, '').getPropertyValue('-webkit-grid-column') is "a-start / a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowDStart, '').getPropertyValue('-webkit-grid-column-start') is "a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowDStart, '').getPropertyValue('-webkit-grid-column-end') is "a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowDStart, '').getPropertyValue('-webkit-grid-row') is "d-start / d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowDStart, '').getPropertyValue('-webkit-grid-row-start') is "d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowDStart, '').getPropertyValue('-webkit-grid-row-end') is "d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowD, '').getPropertyValue('-webkit-grid-column') is "a-start / a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowD, '').getPropertyValue('-webkit-grid-column-start') is "a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowD, '').getPropertyValue('-webkit-grid-column-end') is "a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnAStartRowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnDStartRowCStart, '').getPropertyValue('-webkit-grid-column') is "d-start / d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDStartRowCStart, '').getPropertyValue('-webkit-grid-column-start') is "d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDStartRowCStart, '').getPropertyValue('-webkit-grid-column-end') is "d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDStartRowCStart, '').getPropertyValue('-webkit-grid-row') is "c-start / c-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDStartRowCStart, '').getPropertyValue('-webkit-grid-row-start') is "c-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDStartRowCStart, '').getPropertyValue('-webkit-grid-row-end') is "c-start"
+PASS getComputedStyle(GridAreasNoNamesColumnD, '').getPropertyValue('-webkit-grid-column') is "d / d"
+PASS getComputedStyle(GridAreasNoNamesColumnD, '').getPropertyValue('-webkit-grid-column-start') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnD, '').getPropertyValue('-webkit-grid-column-end') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnD, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNoNamesColumnD, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNoNamesColumnD, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowD, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNoNamesRowD, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowD, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasNoNamesRowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasNoNamesRowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnC, '').getPropertyValue('-webkit-grid-column') is "c / c"
+PASS getComputedStyle(GridAreasNoNamesColumnC, '').getPropertyValue('-webkit-grid-column-start') is "c"
+PASS getComputedStyle(GridAreasNoNamesColumnC, '').getPropertyValue('-webkit-grid-column-end') is "c"
+PASS getComputedStyle(GridAreasNoNamesColumnC, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNoNamesColumnC, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNoNamesColumnC, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowC, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNoNamesRowC, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowC, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowC, '').getPropertyValue('-webkit-grid-row') is "c / c"
+PASS getComputedStyle(GridAreasNoNamesRowC, '').getPropertyValue('-webkit-grid-row-start') is "c"
+PASS getComputedStyle(GridAreasNoNamesRowC, '').getPropertyValue('-webkit-grid-row-end') is "c"
+PASS getComputedStyle(GridAreasNoNamesColumnA, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasNoNamesColumnA, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnA, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnA, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNoNamesColumnA, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNoNamesColumnA, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowA, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNoNamesRowA, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowA, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNoNamesRowA, '').getPropertyValue('-webkit-grid-row') is "a / a"
+PASS getComputedStyle(GridAreasNoNamesRowA, '').getPropertyValue('-webkit-grid-row-start') is "a"
+PASS getComputedStyle(GridAreasNoNamesRowA, '').getPropertyValue('-webkit-grid-row-end') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnARowA, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasNoNamesColumnARowA, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnARowA, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnARowA, '').getPropertyValue('-webkit-grid-row') is "a / a"
+PASS getComputedStyle(GridAreasNoNamesColumnARowA, '').getPropertyValue('-webkit-grid-row-start') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnARowA, '').getPropertyValue('-webkit-grid-row-end') is "a"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnD, '').getPropertyValue('-webkit-grid-column') is "d / d"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnD, '').getPropertyValue('-webkit-grid-column-start') is "d"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnD, '').getPropertyValue('-webkit-grid-column-end') is "d"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnD, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnD, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnD, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowD, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowD, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowD, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasNamedLineAfterRowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasNamedLineAfterRowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnC, '').getPropertyValue('-webkit-grid-column') is "c / c"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnC, '').getPropertyValue('-webkit-grid-column-start') is "c"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnC, '').getPropertyValue('-webkit-grid-column-end') is "c"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnC, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnC, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnC, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowC, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowC, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowC, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowC, '').getPropertyValue('-webkit-grid-row') is "c / c"
+PASS getComputedStyle(GridAreasNamedLineAfterRowC, '').getPropertyValue('-webkit-grid-row-start') is "c"
+PASS getComputedStyle(GridAreasNamedLineAfterRowC, '').getPropertyValue('-webkit-grid-row-end') is "c"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnStartAStart, '').getPropertyValue('-webkit-grid-column') is "a-start / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnStartAStart, '').getPropertyValue('-webkit-grid-column-start') is "a-start"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnStartAStart, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnStartAStart, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnStartAStart, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnStartAStart, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowStartCStart, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowStartCStart, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowStartCStart, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowStartCStart, '').getPropertyValue('-webkit-grid-row') is "c-start / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterRowStartCStart, '').getPropertyValue('-webkit-grid-row-start') is "c-start"
+PASS getComputedStyle(GridAreasNamedLineAfterRowStartCStart, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnA, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnA, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnA, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnA, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnA, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnA, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnARowD, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnARowD, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnARowD, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnARowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnARowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasNamedLineAfterColumnARowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnD, '').getPropertyValue('-webkit-grid-column') is "d / d"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnD, '').getPropertyValue('-webkit-grid-column-start') is "d"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnD, '').getPropertyValue('-webkit-grid-column-end') is "d"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnD, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnD, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnD, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowD, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowD, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowD, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnC, '').getPropertyValue('-webkit-grid-column') is "c / c"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnC, '').getPropertyValue('-webkit-grid-column-start') is "c"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnC, '').getPropertyValue('-webkit-grid-column-end') is "c"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnC, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnC, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnC, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowC, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowC, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowC, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowC, '').getPropertyValue('-webkit-grid-row') is "c / c"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowC, '').getPropertyValue('-webkit-grid-row-start') is "c"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowC, '').getPropertyValue('-webkit-grid-row-end') is "c"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnStartDStart, '').getPropertyValue('-webkit-grid-column') is "d-start / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnStartDStart, '').getPropertyValue('-webkit-grid-column-start') is "d-start"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnStartDStart, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnStartDStart, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnStartDStart, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnStartDStart, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowStartDStart, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowStartDStart, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowStartDStart, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowStartDStart, '').getPropertyValue('-webkit-grid-row') is "d-start / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowStartDStart, '').getPropertyValue('-webkit-grid-row-start') is "d-start"
+PASS getComputedStyle(GridAreasNamedLineBeforeRowStartDStart, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnA, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnA, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnA, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnA, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnA, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnA, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnARowD, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnARowD, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnARowD, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnARowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnARowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasNamedLineBeforeColumnARowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnAAStartRowDStart, '').getPropertyValue('-webkit-grid-column') is "a / a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAAStartRowDStart, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnAAStartRowDStart, '').getPropertyValue('-webkit-grid-column-end') is "a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAAStartRowDStart, '').getPropertyValue('-webkit-grid-row') is "d-start / d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAAStartRowDStart, '').getPropertyValue('-webkit-grid-row-start') is "d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnAAStartRowDStart, '').getPropertyValue('-webkit-grid-row-end') is "d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDDStartRowCStart, '').getPropertyValue('-webkit-grid-column') is "d / d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDDStartRowCStart, '').getPropertyValue('-webkit-grid-column-start') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnDDStartRowCStart, '').getPropertyValue('-webkit-grid-column-end') is "d-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDDStartRowCStart, '').getPropertyValue('-webkit-grid-row') is "c-start / c-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDDStartRowCStart, '').getPropertyValue('-webkit-grid-row-start') is "c-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDDStartRowCStart, '').getPropertyValue('-webkit-grid-row-end') is "c-start"
+PASS getComputedStyle(GridAreasNoNamesColumnCRowAAStart, '').getPropertyValue('-webkit-grid-column') is "c / c"
+PASS getComputedStyle(GridAreasNoNamesColumnCRowAAStart, '').getPropertyValue('-webkit-grid-column-start') is "c"
+PASS getComputedStyle(GridAreasNoNamesColumnCRowAAStart, '').getPropertyValue('-webkit-grid-column-end') is "c"
+PASS getComputedStyle(GridAreasNoNamesColumnCRowAAStart, '').getPropertyValue('-webkit-grid-row') is "a / a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnCRowAAStart, '').getPropertyValue('-webkit-grid-row-start') is "a"
+PASS getComputedStyle(GridAreasNoNamesColumnCRowAAStart, '').getPropertyValue('-webkit-grid-row-end') is "a-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDRowCCStart, '').getPropertyValue('-webkit-grid-column') is "d / d"
+PASS getComputedStyle(GridAreasNoNamesColumnDRowCCStart, '').getPropertyValue('-webkit-grid-column-start') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnDRowCCStart, '').getPropertyValue('-webkit-grid-column-end') is "d"
+PASS getComputedStyle(GridAreasNoNamesColumnDRowCCStart, '').getPropertyValue('-webkit-grid-row') is "c / c-start"
+PASS getComputedStyle(GridAreasNoNamesColumnDRowCCStart, '').getPropertyValue('-webkit-grid-row-start') is "c"
+PASS getComputedStyle(GridAreasNoNamesColumnDRowCCStart, '').getPropertyValue('-webkit-grid-row-end') is "c-start"
+PASS getComputedStyle(GridAreasEnd, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasEnd, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasEnd, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasEnd, '').getPropertyValue('-webkit-grid-row') is "auto / auto"
+PASS getComputedStyle(GridAreasEnd, '').getPropertyValue('-webkit-grid-row-start') is "auto"
+PASS getComputedStyle(GridAreasEnd, '').getPropertyValue('-webkit-grid-row-end') is "auto"
+PASS getComputedStyle(GridAreasEndColumnARowC, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasEndColumnARowC, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasEndColumnARowC, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasEndColumnARowC, '').getPropertyValue('-webkit-grid-row') is "c / c"
+PASS getComputedStyle(GridAreasEndColumnARowC, '').getPropertyValue('-webkit-grid-row-start') is "c"
+PASS getComputedStyle(GridAreasEndColumnARowC, '').getPropertyValue('-webkit-grid-row-end') is "c"
+PASS getComputedStyle(GridAreasEndRowD, '').getPropertyValue('-webkit-grid-column') is "auto / auto"
+PASS getComputedStyle(GridAreasEndRowD, '').getPropertyValue('-webkit-grid-column-start') is "auto"
+PASS getComputedStyle(GridAreasEndRowD, '').getPropertyValue('-webkit-grid-column-end') is "auto"
+PASS getComputedStyle(GridAreasEndRowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasEndRowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasEndRowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasEndColumnARowD, '').getPropertyValue('-webkit-grid-column') is "a / a"
+PASS getComputedStyle(GridAreasEndColumnARowD, '').getPropertyValue('-webkit-grid-column-start') is "a"
+PASS getComputedStyle(GridAreasEndColumnARowD, '').getPropertyValue('-webkit-grid-column-end') is "a"
+PASS getComputedStyle(GridAreasEndColumnARowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasEndColumnARowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasEndColumnARowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS getComputedStyle(GridAreasRepeatColumnDRowC, '').getPropertyValue('-webkit-grid-column') is "d / d"
+PASS getComputedStyle(GridAreasRepeatColumnDRowC, '').getPropertyValue('-webkit-grid-column-start') is "d"
+PASS getComputedStyle(GridAreasRepeatColumnDRowC, '').getPropertyValue('-webkit-grid-column-end') is "d"
+PASS getComputedStyle(GridAreasRepeatColumnDRowC, '').getPropertyValue('-webkit-grid-row') is "c / c"
+PASS getComputedStyle(GridAreasRepeatColumnDRowC, '').getPropertyValue('-webkit-grid-row-start') is "c"
+PASS getComputedStyle(GridAreasRepeatColumnDRowC, '').getPropertyValue('-webkit-grid-row-end') is "c"
+PASS getComputedStyle(GridAreasRepeatColumnDStartDEndRowCStartCEnd, '').getPropertyValue('-webkit-grid-column') is "d-start / d-end"
+PASS getComputedStyle(GridAreasRepeatColumnDStartDEndRowCStartCEnd, '').getPropertyValue('-webkit-grid-column-start') is "d-start"
+PASS getComputedStyle(GridAreasRepeatColumnDStartDEndRowCStartCEnd, '').getPropertyValue('-webkit-grid-column-end') is "d-end"
+PASS getComputedStyle(GridAreasRepeatColumnDStartDEndRowCStartCEnd, '').getPropertyValue('-webkit-grid-row') is "c-start / c-end"
+PASS getComputedStyle(GridAreasRepeatColumnDStartDEndRowCStartCEnd, '').getPropertyValue('-webkit-grid-row-start') is "c-start"
+PASS getComputedStyle(GridAreasRepeatColumnDStartDEndRowCStartCEnd, '').getPropertyValue('-webkit-grid-row-end') is "c-end"
+PASS getComputedStyle(GridAreasRepeatColumnCRowD, '').getPropertyValue('-webkit-grid-column') is "c / c"
+PASS getComputedStyle(GridAreasRepeatColumnCRowD, '').getPropertyValue('-webkit-grid-column-start') is "c"
+PASS getComputedStyle(GridAreasRepeatColumnCRowD, '').getPropertyValue('-webkit-grid-column-end') is "c"
+PASS getComputedStyle(GridAreasRepeatColumnCRowD, '').getPropertyValue('-webkit-grid-row') is "d / d"
+PASS getComputedStyle(GridAreasRepeatColumnCRowD, '').getPropertyValue('-webkit-grid-row-start') is "d"
+PASS getComputedStyle(GridAreasRepeatColumnCRowD, '').getPropertyValue('-webkit-grid-row-end') is "d"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set.html b/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set.html
new file mode 100644 (file)
index 0000000..af2d345
--- /dev/null
@@ -0,0 +1,263 @@
+<!DOCTYPE html>
+<html>
+<head>
+<link href="resources/grid.css" rel="stylesheet">
+<script>
+if (window.testRunner)
+    testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1);
+</script>
+<style type="text/css">
+
+  .gridAreas {
+      -webkit-grid-template-areas: ". a a"
+                           "c a a"
+                           ". . d";
+  }
+
+  .gridNoLineNames {
+      -webkit-grid-template-columns: 50px 100px 200px;
+      -webkit-grid-template-rows: 50px 100px 200px;
+  }
+
+  .gridUniqueNames {
+      -webkit-grid-template-columns: (a) 50px (b b-start) 100px (c) 200px (d);
+      -webkit-grid-template-rows: (e) 50px (f) 100px (g g-start) 200px (h);
+  }
+
+  .gridWithNamedLineBeforeGridArea {
+      -webkit-grid-template-columns: (a-start c-start) 50px (d-start) 100px 200px;
+      -webkit-grid-template-rows: (c-start) 50px (d-start) 100px 200px;
+  }
+
+  .gridWithNamedLineAfterGridArea {
+      -webkit-grid-template-columns: 50px 100px (a-start) 200px;
+      -webkit-grid-template-rows: 50px 100px (c-start) 200px;
+  }
+
+  .gridWithEndLines {
+      -webkit-grid-template-columns: 50px 100px (a-end) 200px (c-end);
+      -webkit-grid-template-rows: 50px (c-end) 100px (d-end) 200px;
+  }
+
+  .gridRepeatedNames {
+      -webkit-grid-template-columns: (d-start) 50px (d-start) 100px (d-start) 200px;
+      -webkit-grid-template-rows: 50px (c-end) 100px (c-end) 200px (c-end);
+  }
+
+</style>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<div style="position: relative">
+  <div class="grid gridUniqueNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: b;" id="GridUniqueColumnB"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: e;" id="GridUniqueRowE"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: b-start;" id="GridUniqueColumnBStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: g-start;" id="GridUniqueRowGStart"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridUniqueNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: b / d;" id="GridUniqueColumnBD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: g / h;" id="GridUniqueRowGH"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: c; -webkit-grid-row: f;" id="GridUniqueColumnCRowF"></div>
+  </div>
+</div>
+
+<!-- Check positioning using unique grid-line names mixed with integers -->
+<div style="position: relative">
+  <div class="grid gridUniqueNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: b / 4;" id="GridUniqueColumnBInteger"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: 3 / h;" id="GridUniqueRowIntegerH"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: 2; -webkit-grid-row: g;" id="GridUniqueColumnIntegerRowG"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a; -webkit-grid-row: 2;" id="GridUniqueColumnARowInteger"></div>
+  </div>
+</div>
+
+<!-- Check that without named gridAreas there are no implicit grid-line names defined -->
+<div style="position: relative">
+  <div class="grid gridUniqueNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: c-start;" id="GridUniqueColumnCStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: f-start;" id="GridUniqueRowFStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: c-start; -webkit-grid-row: f-end" id="GridUniqueColumnCStartRowFEnd"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: b-end; -webkit-grid-row: h-start" id="GridUniqueColumnBEndRowHStart"></div>
+  </div>
+</div>
+
+<!-- Check that gridArea's implicit names are well defined -->
+<div style="position: relative">
+  <div class="grid gridAreas gridNoLineNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start; -webkit-grid-row: d-start;" id="GridAreasNoNamesColumnAStartRowDStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start; -webkit-grid-row: d;" id="GridAreasNoNamesColumnAStartRowD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: d-start; -webkit-grid-row: c-start;"id="GridAreasNoNamesColumnDStartRowCStart"></div>
+  </div>
+</div>
+
+<!-- Check positioning using grid areas -->
+<div style="position: relative">
+  <div class="grid gridAreas gridNoLineNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: d;" id="GridAreasNoNamesColumnD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: d;" id="GridAreasNoNamesRowD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: c;" id="GridAreasNoNamesColumnC"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: c;" id="GridAreasNoNamesRowC"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreas gridNoLineNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a;" id="GridAreasNoNamesColumnA"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: a;" id="GridAreasNoNamesRowA"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a; -webkit-grid-row: a;" id="GridAreasNoNamesColumnARowA"></div>
+  </div>
+</div>
+
+<!-- Use grid area's implicit line names if defined before explicitly named grid lines -->
+<div style="position: relative">
+  <div class="grid gridAreas gridWithNamedLineAfterGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column: d;" id="GridAreasNamedLineAfterColumnD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: d;" id="GridAreasNamedLineAfterRowD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: c;" id="GridAreasNamedLineAfterColumnC"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: c;" id="GridAreasNamedLineAfterRowC"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreas gridWithNamedLineAfterGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column-start: a-start;" id="GridAreasNamedLineAfterColumnStartAStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row-start: c-start;" id="GridAreasNamedLineAfterRowStartCStart"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreas gridWithNamedLineAfterGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a;" id="GridAreasNamedLineAfterColumnA"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a; -webkit-grid-row: d;" id="GridAreasNamedLineAfterColumnARowD"></div>
+  </div>
+</div>
+
+<!-- Use explicitly named grid lines if they're defined before the grid area -->
+<div style="position: relative">
+  <div class="grid gridAreas gridWithNamedLineBeforeGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column: d;" id="GridAreasNamedLineBeforeColumnD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: d;" id="GridAreasNamedLineBeforeRowD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: c;" id="GridAreasNamedLineBeforeColumnC"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: c;" id="GridAreasNamedLineBeforeRowC"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreas gridWithNamedLineBeforeGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column-start: d-start;" id="GridAreasNamedLineBeforeColumnStartDStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row-start: d-start;" id="GridAreasNamedLineBeforeRowStartDStart"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreas gridWithNamedLineBeforeGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a;" id="GridAreasNamedLineBeforeColumnA"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a; -webkit-grid-row: d;" id="GridAreasNamedLineBeforeColumnARowD"></div>
+  </div>
+</div>
+
+<!-- Check that a "-start" ident in a end column or a "-end" ident in a start column is not treated as a implicit grid line of a grid area -->
+<div style="position: relative">
+  <div class="grid gridAreas gridNoLineNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a / a-start; -webkit-grid-row: d-start;" id="GridAreasNoNamesColumnAAStartRowDStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: d / d-start; -webkit-grid-row: c-start;" id="GridAreasNoNamesColumnDDStartRowCStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: c; -webkit-grid-row: a / a-start;" id="GridAreasNoNamesColumnCRowAAStart"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: d; -webkit-grid-row: c / c-start;" id="GridAreasNoNamesColumnDRowCCStart"></div>
+  </div>
+</div>
+
+<!-- Check that we propertly resolve explicit "-end" lines inside grid areas -->
+<div style="position: relative">
+  <div class="grid gridAreas gridWithEndLines">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a" id="GridAreasEnd"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a; -webkit-grid-row: c" id="GridAreasEndColumnARowC"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: d;" id="GridAreasEndRowD"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a; -webkit-grid-row: d;" id="GridAreasEndColumnARowD"></div>
+  </div>
+</div>
+
+<!-- Check that we always pick the first definition when multiple grid lines have the same name -->
+<div style="position: relative">
+  <div class="grid gridAreas gridRepeatedNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: d; -webkit-grid-row: c" id="GridAreasRepeatColumnDRowC"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: d-start / d-end; -webkit-grid-row: c-start / c-end" id="GridAreasRepeatColumnDStartDEndRowCStartCEnd"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: c; -webkit-grid-row: d" id="GridAreasRepeatColumnCRowD"></div>
+  </div>
+</div>
+
+<script src="resources/grid-item-column-row-parsing-utils.js"></script>
+<script>
+  testColumnRowCSSParsing("GridUniqueColumnB", "b / b", "auto / auto");
+  testColumnRowCSSParsing("GridUniqueRowE", "auto / auto", "e / e");
+  testColumnRowCSSParsing("GridUniqueColumnBStart", "b-start / b-start", "auto / auto");
+  testColumnRowCSSParsing("GridUniqueRowGStart", "auto / auto", "g-start / g-start");
+
+  testColumnRowCSSParsing("GridUniqueColumnBD", "b / d", "auto / auto");
+  testColumnRowCSSParsing("GridUniqueRowGH", "auto / auto", "g / h");
+  testColumnRowCSSParsing("GridUniqueColumnCRowF", "c / c", "f / f");
+
+  testColumnRowCSSParsing("GridUniqueColumnBInteger", "b / 4", "auto / auto");
+  testColumnRowCSSParsing("GridUniqueRowIntegerH", "auto / auto", "3 / h");
+  testColumnRowCSSParsing("GridUniqueColumnIntegerRowG", "2 / auto", "g / g");
+  testColumnRowCSSParsing("GridUniqueColumnARowInteger", "a / a", "2 / auto");
+
+  testColumnRowCSSParsing("GridUniqueColumnCStart", "c-start / c-start", "auto / auto");
+  testColumnRowCSSParsing("GridUniqueRowFStart", "auto / auto", "f-start / f-start");
+  testColumnRowCSSParsing("GridUniqueColumnCStartRowFEnd", "c-start / c-start", "f-end / f-end");
+  testColumnRowCSSParsing("GridUniqueColumnBEndRowHStart", "b-end / b-end", "h-start / h-start");
+
+  testColumnRowCSSParsing("GridAreasNoNamesColumnAStartRowDStart", "a-start / a-start", "d-start / d-start");
+  testColumnRowCSSParsing("GridAreasNoNamesColumnAStartRowD", "a-start / a-start", "d / d");
+  testColumnRowCSSParsing("GridAreasNoNamesColumnDStartRowCStart", "d-start / d-start", "c-start / c-start");
+
+  testColumnRowCSSParsing("GridAreasNoNamesColumnD", "d / d", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNoNamesRowD", "auto / auto", "d / d");
+  testColumnRowCSSParsing("GridAreasNoNamesColumnC", "c / c", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNoNamesRowC", "auto / auto", "c / c");
+
+  testColumnRowCSSParsing("GridAreasNoNamesColumnA", "a / a", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNoNamesRowA", "auto / auto", "a / a");
+  testColumnRowCSSParsing("GridAreasNoNamesColumnARowA", "a / a", "a / a");
+
+  testColumnRowCSSParsing("GridAreasNamedLineAfterColumnD", "d / d", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineAfterRowD", "auto / auto", "d / d");
+  testColumnRowCSSParsing("GridAreasNamedLineAfterColumnC", "c / c", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineAfterRowC", "auto / auto", "c / c");
+
+  testColumnRowCSSParsing("GridAreasNamedLineAfterColumnStartAStart", "a-start / auto", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineAfterRowStartCStart", "auto / auto", "c-start / auto");
+
+  testColumnRowCSSParsing("GridAreasNamedLineAfterColumnA", "a / a", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineAfterColumnARowD", "a / a", "d / d");
+
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeColumnD", "d / d", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeRowD", "auto / auto", "d / d");
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeColumnC", "c / c", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeRowC", "auto / auto", "c / c");
+
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeColumnStartDStart", "d-start / auto", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeRowStartDStart", "auto / auto", "d-start / auto");
+
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeColumnA", "a / a", "auto / auto");
+  testColumnRowCSSParsing("GridAreasNamedLineBeforeColumnARowD", "a / a", "d / d");
+
+  testColumnRowCSSParsing("GridAreasNoNamesColumnAAStartRowDStart", "a / a-start", "d-start / d-start");
+  testColumnRowCSSParsing("GridAreasNoNamesColumnDDStartRowCStart", "d / d-start", "c-start / c-start");
+  testColumnRowCSSParsing("GridAreasNoNamesColumnCRowAAStart", "c / c", "a / a-start");
+  testColumnRowCSSParsing("GridAreasNoNamesColumnDRowCCStart", "d / d", "c / c-start");
+
+  testColumnRowCSSParsing("GridAreasEnd", "a / a", "auto / auto");
+  testColumnRowCSSParsing("GridAreasEndColumnARowC", "a / a", "c / c");
+  testColumnRowCSSParsing("GridAreasEndRowD", "auto / auto", "d / d");
+  testColumnRowCSSParsing("GridAreasEndColumnARowD", "a / a", "d / d");
+
+  testColumnRowCSSParsing("GridAreasRepeatColumnDRowC", "d / d", "c / c");
+  testColumnRowCSSParsing("GridAreasRepeatColumnDStartDEndRowCStartCEnd", "d-start / d-end", "c-start / c-end");
+  testColumnRowCSSParsing("GridAreasRepeatColumnCRowD", "c / c", "d / d");
+</script>
+</body>
+</html>
index 1781744..0b98232 100644 (file)
@@ -14,14 +14,20 @@ if (window.testRunner)
                                    ". . d";
   }
 
+  .gridAreasSpecial {
+      -webkit-grid-template-areas: ". a-start a-start"
+                                   "c a-end a-end"
+                                   ". . d";
+  }
+
   .gridNoLineNames {
       -webkit-grid-template-columns: 50px 100px 200px;
       -webkit-grid-template-rows: 50px 100px 200px;
   }
 
   .gridUniqueNames {
-      -webkit-grid-template-columns: (a) 50px (b b-start) 100px (c) 200px (d);
-      -webkit-grid-template-rows: (e) 50px (f) 100px (g g-start) 200px (h);
+      -webkit-grid-template-columns: (a) 50px (b b-start) 100px (c -start) 200px (d);
+      -webkit-grid-template-rows: (e) 50px (f -end) 100px (g g-start) 200px (h);
   }
 
   .gridWithNamedLineBeforeGridArea {
@@ -195,5 +201,48 @@ if (window.testRunner)
   </div>
 </div>
 
+<!-- Check behavior with areas named *-start or *-end -->
+<div style="position: relative">
+  <div class="grid gridAreasSpecial gridNoLineNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a;" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: a;" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a; -webkit-grid-row: a;" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreasSpecial gridNoLineNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start;" data-offset-x="50" data-offset-y="0" data-expected-width="300" data-expected-height="50"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: a-end;" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start; -webkit-grid-row: a-end;" data-offset-x="50" data-offset-y="50" data-expected-width="300" data-expected-height="100"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreasSpecial gridWithNamedLineBeforeGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start;" data-offset-x="50" data-offset-y="0" data-expected-width="300" data-expected-height="50"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: a-end;" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start; -webkit-grid-row: a-end;" data-offset-x="50" data-offset-y="50" data-expected-width="300" data-expected-height="100"></div>
+  </div>
+</div>
+
+<div style="position: relative">
+  <div class="grid gridAreasSpecial gridWithNamedLineAfterGridArea">
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start;" data-offset-x="50" data-offset-y="0" data-expected-width="300" data-expected-height="50"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: d;" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="200"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column: a-start; -webkit-grid-row: d;" data-offset-x="50" data-offset-y="150" data-expected-width="300" data-expected-height="200"></div>
+  </div>
+</div>
+
+<!-- Check behavior with lines named *-start or *-end -->
+<div style="position: relative">
+  <div class="grid gridAreasSpecial gridUniqueNames">
+    <div class="sizedToGridArea" style="-webkit-grid-column: -start;" data-offset-x="150" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-row: -end;" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
+    <div class="sizedToGridArea" style="-webkit-grid-column-end: -start; -webkit-grid-row-start: -end;" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
+
+  </div>
+</div>
+
 </body>
 </html>
index 4b162bc..841590c 100644 (file)
@@ -1,3 +1,46 @@
+2014-03-26  Sergio Villar Senin  <svillar@igalia.com>
+
+        [CSS Grid Layout] getComputedStyle() must return the specified value for positioning properties
+        https://bugs.webkit.org/show_bug.cgi?id=130010
+
+        Reviewed by Darin Adler.
+
+        According to the specs
+        http://dev.w3.org/csswg/css-grid/#property-index and also to
+        http://lists.w3.org/Archives/Public/www-style/2014Mar/0162.html
+        the function getComputedStyle() must return the specified values
+        for positioning properties, i.e, grid-{columns|rows}-{start|end}.
+
+        We were in some cases, adjusting the style in the StyleResolver
+        (for example with two opposing spans) something that is now done
+        in the RenderGrid because we cannot alter the original style.
+
+        The code moved to the renderer became more self explanatory and it
+        now supports named grid areas with names ending in "-start" and
+        "-end".
+
+        Test: fast/css-grid-layout/named-grid-lines-with-named-grid-areas-get-set.html
+
+        * css/StyleResolver.cpp:
+        (WebCore::StyleResolver::adjustRenderStyle):
+        (WebCore::gridLineDefinedBeforeGridArea): Deleted.
+        (WebCore::StyleResolver::adjustNamedGridItemPosition): Deleted.
+        (WebCore::StyleResolver::adjustGridItemPosition): Deleted.
+        * css/StyleResolver.h:
+        * rendering/RenderGrid.cpp:
+        (WebCore::isColumnSide):
+        (WebCore::RenderGrid::explicitGridSizeForSide):
+        (WebCore::gridLineDefinedBeforeGridArea):
+        (WebCore::setNamedLinePositionIfDefinedBeforeArea):
+        (WebCore::RenderGrid::adjustNamedGridItemPosition):
+        (WebCore::RenderGrid::adjustGridPositionsFromStyle):
+        (WebCore::RenderGrid::resolveGridPositionsFromStyle):
+        (WebCore::RenderGrid::resolveNamedGridLinePositionFromStyle):
+        (WebCore::RenderGrid::resolveNamedGridLinePositionAgainstOppositePosition):
+        * rendering/RenderGrid.h:
+        * rendering/style/GridPosition.h:
+        (WebCore::GridPosition::setAutoPosition): New helper function.
+
 2014-03-26  Simon Fraser  <simon.fraser@apple.com>
 
         Fix the iOS build.
index d8c75b1..be7e3a6 100644 (file)
@@ -1336,10 +1336,6 @@ void StyleResolver::adjustRenderStyle(RenderStyle& style, const RenderStyle& par
         || style.hasBlendMode()))
         style.setTransformStyle3D(TransformStyle3DFlat);
 
-#if ENABLE(CSS_GRID_LAYOUT)
-    adjustGridItemPosition(style, parentStyle);
-#endif
-
     if (e && e->isSVGElement()) {
         // Spec: http://www.w3.org/TR/SVG/masking.html#OverflowProperty
         if (style.overflowY() == OSCROLL)
@@ -1367,125 +1363,6 @@ void StyleResolver::adjustRenderStyle(RenderStyle& style, const RenderStyle& par
     }
 }
 
-#if ENABLE(CSS_GRID_LAYOUT)
-static inline bool gridLineDefinedBeforeGridArea(const String& gridLineName, const String& gridAreaName, const NamedGridAreaMap& gridAreaMap, const NamedGridLinesMap& namedLinesMap, GridPositionSide side)
-{
-    ASSERT(namedLinesMap.contains(gridLineName));
-    // Grid line indexes are inserted in order.
-    size_t namedGridLineFirstDefinition = GridPosition::adjustGridPositionForSide(namedLinesMap.get(gridLineName)[0], side);
-
-    ASSERT(gridAreaMap.contains(gridAreaName));
-    const GridCoordinate& gridAreaCoordinates = gridAreaMap.get(gridAreaName);
-
-    // GridCoordinate refers to tracks while the indexes in namedLinesMap refer to lines, that's why we need to add 1 to
-    // the grid coordinate to get the end line index.
-    switch (side) {
-    case ColumnStartSide:
-        return namedGridLineFirstDefinition < gridAreaCoordinates.columns.initialPositionIndex;
-    case ColumnEndSide:
-        return namedGridLineFirstDefinition < gridAreaCoordinates.columns.finalPositionIndex;
-    case RowStartSide:
-        return namedGridLineFirstDefinition < gridAreaCoordinates.rows.initialPositionIndex;
-    case RowEndSide:
-        return namedGridLineFirstDefinition < gridAreaCoordinates.rows.finalPositionIndex;
-    }
-    ASSERT_NOT_REACHED();
-    return false;
-}
-
-std::unique_ptr<GridPosition> StyleResolver::adjustNamedGridItemPosition(const NamedGridAreaMap& gridAreaMap, const NamedGridLinesMap& namedLinesMap, const GridPosition& position, GridPositionSide side) const
-{
-    ASSERT(position.isNamedGridArea());
-    // The StyleBuilder always treats <custom-ident> as a named grid area. We must decide here if they are going to be
-    // resolved to either a grid area or a grid line.
-
-    String namedGridAreaOrGridLine = position.namedGridLine();
-    bool hasStartSuffix = namedGridAreaOrGridLine.endsWith("-start");
-    bool hasEndSuffix = namedGridAreaOrGridLine.endsWith("-end");
-    bool isStartSide = side == ColumnStartSide || side == RowStartSide;
-    bool hasStartSuffixForStartSide = hasStartSuffix && isStartSide;
-    bool hasEndSuffixForEndSide = hasEndSuffix && !isStartSide;
-    size_t suffixLength = hasStartSuffix ? strlen("-start") : strlen("-end");
-    String gridAreaName = hasStartSuffixForStartSide || hasEndSuffixForEndSide ? namedGridAreaOrGridLine.substring(0, namedGridAreaOrGridLine.length() - suffixLength) : namedGridAreaOrGridLine;
-
-    if (gridAreaMap.contains(gridAreaName)) {
-        String gridLineName;
-        if (isStartSide && !hasStartSuffix)
-            gridLineName = namedGridAreaOrGridLine + "-start";
-        else if (!isStartSide && !hasEndSuffix)
-            gridLineName = namedGridAreaOrGridLine + "-end";
-        else
-            gridLineName = namedGridAreaOrGridLine;
-
-        if (namedLinesMap.contains(gridLineName) && gridLineDefinedBeforeGridArea(gridLineName, gridAreaName, gridAreaMap, namedLinesMap, side)) {
-            // Use the explicitly defined grid line defined before the grid area instead of the grid area.
-            auto adjustedPosition = std::make_unique<GridPosition>();
-            adjustedPosition->setExplicitPosition(1, gridLineName);
-            return adjustedPosition;
-        }
-
-        if (hasStartSuffixForStartSide || hasEndSuffixForEndSide) {
-            // Renderer expects the grid area name instead of the implicit grid line name.
-            auto adjustedPosition = std::make_unique<GridPosition>();
-            adjustedPosition->setNamedGridArea(gridAreaName);
-            return adjustedPosition;
-        }
-
-        return nullptr;
-    }
-
-    if (namedLinesMap.contains(namedGridAreaOrGridLine)) {
-        auto adjustedPosition = std::make_unique<GridPosition>();
-        adjustedPosition->setExplicitPosition(1, namedGridAreaOrGridLine);
-        return adjustedPosition;
-    }
-
-    // We must clear unknown named grid areas
-    return std::make_unique<GridPosition>();
-}
-
-void StyleResolver::adjustGridItemPosition(RenderStyle& style, const RenderStyle& parentStyle) const
-{
-    const GridPosition& columnStartPosition = style.gridItemColumnStart();
-    const GridPosition& columnEndPosition = style.gridItemColumnEnd();
-    const GridPosition& rowStartPosition = style.gridItemRowStart();
-    const GridPosition& rowEndPosition = style.gridItemRowEnd();
-
-    // If opposing grid-placement properties both specify a grid span, they both compute to ‘auto’.
-    if (columnStartPosition.isSpan() && columnEndPosition.isSpan()) {
-        style.setGridItemColumnStart(GridPosition());
-        style.setGridItemColumnEnd(GridPosition());
-    }
-
-    if (rowStartPosition.isSpan() && rowEndPosition.isSpan()) {
-        style.setGridItemRowStart(GridPosition());
-        style.setGridItemRowEnd(GridPosition());
-    }
-
-    // If the grid position is a single <custom-ident> then the spec mandates us to resolve it following this steps:
-    //     * If there is a named grid area called <custom-ident> resolve the position to the area's corresponding edge.
-    //         * If a grid area was found with that name, check that there is no <custom-ident>-start or <custom-ident>-end (depending
-    // on the css property being defined) specified before the grid area. If that's the case resolve to that grid line.
-    //     * Otherwise check if there is a grid line named <custom-ident>.
-    //     * Otherwise treat it as auto.
-    const NamedGridLinesMap& namedGridColumnLines = parentStyle.namedGridColumnLines();
-    const NamedGridLinesMap& namedGridRowLines = parentStyle.namedGridRowLines();
-    const NamedGridAreaMap& gridAreaMap = parentStyle.namedGridArea();
-
-#define ADJUST_GRID_POSITION_MAYBE(position, Prop, namedGridLines, side) \
-    if (position.isNamedGridArea()) {                                   \
-        std::unique_ptr<GridPosition> adjustedPosition = adjustNamedGridItemPosition(gridAreaMap, namedGridLines, position, side); \
-        if (adjustedPosition)                                           \
-            style.setGridItem##Prop(*adjustedPosition);                 \
-    }
-
-    ADJUST_GRID_POSITION_MAYBE(columnStartPosition, ColumnStart, namedGridColumnLines, ColumnStartSide);
-    ADJUST_GRID_POSITION_MAYBE(columnEndPosition, ColumnEnd, namedGridColumnLines, ColumnEndSide);
-    ADJUST_GRID_POSITION_MAYBE(rowStartPosition, RowStart, namedGridRowLines, RowStartSide);
-    ADJUST_GRID_POSITION_MAYBE(rowEndPosition, RowEnd, namedGridRowLines, RowEndSide);
-}
-#endif /* ENABLE(CSS_GRID_LAYOUT) */
-
 bool StyleResolver::checkRegionStyle(Element* regionElement)
 {
     unsigned rulesSize = m_ruleSets.authorStyle()->regionSelectorsAndRuleSets().size();
index 44b5526..cb45f34 100644 (file)
@@ -294,7 +294,6 @@ private:
 
     void adjustRenderStyle(RenderStyle& styleToAdjust, const RenderStyle& parentStyle, Element*);
 #if ENABLE(CSS_GRID_LAYOUT)
-    void adjustGridItemPosition(RenderStyle& styleToAdjust, const RenderStyle& parentStyle) const;
     std::unique_ptr<GridPosition> adjustNamedGridItemPosition(const NamedGridAreaMap&, const NamedGridLinesMap&, const GridPosition&, GridPositionSide) const;
 #endif
 
index 204d295..3172da4 100644 (file)
@@ -474,9 +474,14 @@ size_t RenderGrid::explicitGridRowCount() const
     return style().gridRows().size();
 }
 
+static inline bool isColumnSide(GridPositionSide side)
+{
+    return side == ColumnStartSide || side == ColumnEndSide;
+}
+
 size_t RenderGrid::explicitGridSizeForSide(GridPositionSide side) const
 {
-    return (side == ColumnStartSide || side == ColumnEndSide) ? explicitGridColumnCount() : explicitGridRowCount();
+    return isColumnSide(side) ? explicitGridColumnCount() : explicitGridRowCount();
 }
 
 LayoutUnit RenderGrid::logicalContentHeightForChild(RenderBox* child, Vector<GridTrack>& columnTracks)
@@ -864,15 +869,95 @@ GridSpan RenderGrid::resolveGridPositionsFromAutoPlacementPosition(const RenderB
     return GridSpan(initialPosition, initialPosition);
 }
 
+static inline bool gridLineDefinedBeforeGridArea(size_t namedGridLineFirstDefinition, const GridCoordinate& gridAreaCoordinates, GridPositionSide side)
+{
+    switch (side) {
+    case ColumnStartSide:
+        return namedGridLineFirstDefinition < gridAreaCoordinates.columns.initialPositionIndex;
+    case ColumnEndSide:
+        return namedGridLineFirstDefinition < gridAreaCoordinates.columns.finalPositionIndex;
+    case RowStartSide:
+        return namedGridLineFirstDefinition < gridAreaCoordinates.rows.initialPositionIndex;
+    case RowEndSide:
+        return namedGridLineFirstDefinition < gridAreaCoordinates.rows.finalPositionIndex;
+    }
+    ASSERT_NOT_REACHED();
+    return false;
+}
+
+static void setNamedLinePositionIfDefinedBeforeArea(GridPosition& position, const NamedGridLinesMap& namedLinesMap, const String& lineName, const GridCoordinate& gridAreaCoordinate, GridPositionSide side)
+{
+    auto linesIterator = namedLinesMap.find(lineName);
+    if (linesIterator == namedLinesMap.end())
+        return;
+
+    size_t namedGridLineFirstDefinition = GridPosition::adjustGridPositionForSide(linesIterator->value[0], side);
+    if (gridLineDefinedBeforeGridArea(namedGridLineFirstDefinition, gridAreaCoordinate, side))
+        position.setExplicitPosition(1, lineName);
+}
+
+void RenderGrid::adjustNamedGridItemPosition(GridPosition& position, GridPositionSide side) const
+{
+    // The StyleBuilder always treats <custom-ident> as a named grid area. We must decide here if they are going to be
+    // resolved to either a grid area or a grid line.
+    ASSERT(position.isNamedGridArea());
+    const NamedGridAreaMap& gridAreaMap = style().namedGridArea();
+    const NamedGridLinesMap& namedLinesMap = isColumnSide(side) ? style().namedGridColumnLines() : style().namedGridRowLines();
+
+    String namedGridAreaOrGridLine = position.namedGridLine();
+    bool isStartSide = side == ColumnStartSide || side == RowStartSide;
+
+    auto areaIterator = gridAreaMap.find(namedGridAreaOrGridLine);
+    if (areaIterator != gridAreaMap.end()) {
+        String gridLineName = namedGridAreaOrGridLine + (isStartSide ? "-start" : "-end");
+        setNamedLinePositionIfDefinedBeforeArea(position, namedLinesMap, gridLineName, areaIterator->value, side);
+        return;
+    }
+
+    bool hasStartSuffix = namedGridAreaOrGridLine.endsWith("-start");
+    bool hasEndSuffix = namedGridAreaOrGridLine.endsWith("-end");
+    if ((hasStartSuffix && isStartSide) || (hasEndSuffix && !isStartSide)) {
+        size_t suffixLength = hasStartSuffix ? strlen("-start") : strlen("-end");
+        String gridAreaName = namedGridAreaOrGridLine.substring(0, namedGridAreaOrGridLine.length() - suffixLength);
+
+        auto areaIterator = gridAreaMap.find(gridAreaName);
+        if (areaIterator != gridAreaMap.end()) {
+            position.setNamedGridArea(gridAreaName);
+            setNamedLinePositionIfDefinedBeforeArea(position, namedLinesMap, namedGridAreaOrGridLine, areaIterator->value, side);
+            return;
+        }
+    }
+
+    if (namedLinesMap.contains(namedGridAreaOrGridLine))
+        position.setExplicitPosition(1, namedGridAreaOrGridLine);
+    else
+        position.setAutoPosition();
+}
+
+void RenderGrid::adjustGridPositionsFromStyle(GridPosition& initialPosition, GridPosition& finalPosition, GridPositionSide initialPositionSide, GridPositionSide finalPositionSide) const
+{
+    ASSERT(isColumnSide(initialPositionSide) == isColumnSide(finalPositionSide));
+
+    // We must handle the placement error handling code here instead of in the StyleAdjuster because we don't want to
+    // overwrite the specified values.
+    if (initialPosition.isSpan() && finalPosition.isSpan())
+        finalPosition.setAutoPosition();
+
+    if (initialPosition.isNamedGridArea())
+        adjustNamedGridItemPosition(initialPosition, initialPositionSide);
+
+    if (finalPosition.isNamedGridArea())
+        adjustNamedGridItemPosition(finalPosition, finalPositionSide);
+}
+
 PassOwnPtr<GridSpan> RenderGrid::resolveGridPositionsFromStyle(const RenderBox* gridItem, GridTrackSizingDirection direction) const
 {
-    const GridPosition& initialPosition = (direction == ForColumns) ? gridItem->style().gridItemColumnStart() : gridItem->style().gridItemRowStart();
+    GridPosition initialPosition = (direction == ForColumns) ? gridItem->style().gridItemColumnStart() : gridItem->style().gridItemRowStart();
     const GridPositionSide initialPositionSide = (direction == ForColumns) ? ColumnStartSide : RowStartSide;
-    const GridPosition& finalPosition = (direction == ForColumns) ? gridItem->style().gridItemColumnEnd() : gridItem->style().gridItemRowEnd();
+    GridPosition finalPosition = (direction == ForColumns) ? gridItem->style().gridItemColumnEnd() : gridItem->style().gridItemRowEnd();
     const GridPositionSide finalPositionSide = (direction == ForColumns) ? ColumnEndSide : RowEndSide;
 
-    // We should NEVER see both spans as they should have been handled during style resolve.
-    ASSERT(!initialPosition.isSpan() || !finalPosition.isSpan());
+    adjustGridPositionsFromStyle(initialPosition, finalPosition, initialPositionSide, finalPositionSide);
 
     if (initialPosition.shouldBeResolvedAgainstOppositePosition() && finalPosition.shouldBeResolvedAgainstOppositePosition()) {
         if (style().gridAutoFlow() == AutoFlowNone)
@@ -908,7 +993,7 @@ size_t RenderGrid::resolveNamedGridLinePositionFromStyle(const GridPosition& pos
 {
     ASSERT(!position.namedGridLine().isNull());
 
-    const NamedGridLinesMap& gridLinesNames = (side == ColumnStartSide || side == ColumnEndSide) ? style().namedGridColumnLines() : style().namedGridRowLines();
+    const NamedGridLinesMap& gridLinesNames = isColumnSide(side) ? style().namedGridColumnLines() : style().namedGridRowLines();
     NamedGridLinesMap::const_iterator it = gridLinesNames.find(position.namedGridLine());
     if (it == gridLinesNames.end()) {
         if (position.isPositive())
@@ -1007,7 +1092,7 @@ PassOwnPtr<GridSpan> RenderGrid::resolveNamedGridLinePositionAgainstOppositePosi
     // Negative positions are not allowed per the specification and should have been handled during parsing.
     ASSERT(position.spanPosition() > 0);
 
-    const NamedGridLinesMap& gridLinesNames = (side == ColumnStartSide || side == ColumnEndSide) ? style().namedGridColumnLines() : style().namedGridRowLines();
+    const NamedGridLinesMap& gridLinesNames = isColumnSide(side) ? style().namedGridColumnLines() : style().namedGridRowLines();
     NamedGridLinesMap::const_iterator it = gridLinesNames.find(position.namedGridLine());
 
     // If there is no named grid line of that name, we resolve the position to 'auto' (which is equivalent to 'span 1' in this case).
index 0d11d3c..0966105 100644 (file)
@@ -111,6 +111,8 @@ private:
     GridCoordinate cachedGridCoordinate(const RenderBox*) const;
 
     GridSpan resolveGridPositionsFromAutoPlacementPosition(const RenderBox*, GridTrackSizingDirection, size_t) const;
+    void adjustNamedGridItemPosition(GridPosition&, GridPositionSide) const;
+    void adjustGridPositionsFromStyle(GridPosition& initialPosition, GridPosition& finalPosition, GridPositionSide initialPositionSide, GridPositionSide finalPositionSide) const;
     PassOwnPtr<GridSpan> resolveGridPositionsFromStyle(const RenderBox*, GridTrackSizingDirection) const;
     size_t resolveNamedGridLinePositionFromStyle(const GridPosition&, GridPositionSide) const;
     size_t resolveGridPositionFromStyle(const GridPosition&, GridPositionSide) const;
index 1624c0c..68f2f39 100644 (file)
@@ -88,6 +88,12 @@ public:
         m_namedGridLine = namedGridLine;
     }
 
+    void setAutoPosition()
+    {
+        m_type = AutoPosition;
+        m_integerPosition = 0;
+    }
+
     // 'span' values cannot be negative, yet we reuse the <integer> position which can
     // be. This means that we have to convert the span position to an integer, losing
     // some precision here. It shouldn't be an issue in practice though.