[CSS Grid Layout] Update grid-auto-flow to the new syntax

LayoutTests/fast/css-grid-layout/grid-shorthand-get-set.html

Index: LayoutTests/fast/css-grid-layout/grid-shorthand-get-set.html
diff --git a/LayoutTests/fast/css-grid-layout/grid-shorthand-get-set.html b/LayoutTests/fast/css-grid-layout/grid-shorthand-get-set.html
index fb3426fe88a999849fb4284ae8759d5531848136..19432d734352939086601c8814df091444dbac44 100644
--- a/LayoutTests/fast/css-grid-layout/grid-shorthand-get-set.html
+++ b/LayoutTests/fast/css-grid-layout/grid-shorthand-get-set.html
@@ -10,11 +10,23 @@
     grid: 15px / 10px;
 }
 #gridWithAutoFlowAndColumns {
-    grid: row 10px;
+    grid: column 10px;
 }
 #gridWithAutoFlowNone {
     grid: none 10px;
 }
+#gridWithAutoFlowColumnDense {
+    grid: column dense 10px;
+}
+#gridWithAutoFlowDenseRow {
+    grid: dense row 10px;
+}
+#gridWithAutoFlowStackColumn {
+    grid: stack column 10px;
+}
+#gridWithAutoFlowRowStack {
+    grid: row stack 10px;
+}
 #gridWithAutoFlowAndColumnsAndRows {
     grid: column 10px / 20px;
 }
@@ -30,6 +42,12 @@
 #gridWithMisplacedNone2 {
     grid: 10px / 20px none;
 }
+#gridWithMisplacedDense {
+    grid: dense column dense;
+}
+#gridWithMisplacedStack {
+    grid: stack row stack;
+}
 </style>
 <script src="../../resources/js-test.js"></script>
 </head>
@@ -38,50 +56,62 @@
 <div class="grid" id="gridWithTemplate"></div>
 <div class="grid" id="gridWithAutoFlowAndColumns"></div>
 <div class="grid" id="gridWithAutoFlowNone"></div>
+<div class="grid" id="gridWithAutoFlowColumnDense"></div>
+<div class="grid" id="gridWithAutoFlowDenseRow"></div>
+<div class="grid" id="gridWithAutoFlowStackColumn"></div>
+<div class="grid" id="gridWithAutoFlowRowStack"></div>
 <div class="grid" id="gridWithAutoFlowAndColumnsAndRows"></div>
 <div class="grid" id="gridWithExplicitAndImplicit"></div>
 <div class="grid" id="gridWithMisplacedNone1"></div>
 <div class="grid" id="gridWithMisplacedNone2"></div>
+<div class="grid" id="gridWithMisplacedDense"></div>
+<div class="grid" id="gridWithMisplacedStack"></div>
 <script src="resources/grid-shorthand-parsing-utils.js"></script>
 <script>
     description("This test checks that the 'grid' shorthand is properly parsed and the longhand properties correctly assigned.");
 
     debug("Test getting the longhand values when shorthand is set through CSS.");
-    testGridDefinitionsValues(document.getElementById("gridWithNone"), "none", "none", "none", "none", "auto", "auto");
-    testGridDefinitionsValues(document.getElementById("gridWithTemplate"), "15px", "10px", "none", "none", "auto", "auto");
-    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowAndColumns"), "none", "none", "none", "row", "10px", "10px");
-    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowNone"), "none", "none", "none", "none", "10px", "10px");
+    testGridDefinitionsValues(document.getElementById("gridWithNone"), "none", "none", "none", "row", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithTemplate"), "15px", "10px", "none", "row", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowAndColumns"), "none", "none", "none", "column", "10px", "10px");
+    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowNone"), "none", "none", "none", "row", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowColumnDense"), "none", "none", "none", "column dense", "10px", "10px");
+    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowDenseRow"), "none", "none", "none", "row dense", "10px", "10px");
+    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowStackColumn"), "none", "none", "none", "stack column", "10px", "10px");
+    testGridDefinitionsValues(document.getElementById("gridWithAutoFlowRowStack"), "none", "none", "none", "stack row", "10px", "10px");
     testGridDefinitionsValues(document.getElementById("gridWithAutoFlowAndColumnsAndRows"), "none", "none", "none", "column", "10px", "20px");
 
     debug("");
     debug("Test getting wrong values for 'grid' shorthand through CSS (they should resolve to the default: 'none')");
-    testGridDefinitionsValues(document.getElementById("gridWithExplicitAndImplicit"), "none", "none", "none", "none", "auto", "auto");
-    testGridDefinitionsValues(document.getElementById("gridWithMisplacedNone1"), "none", "none", "none", "none", "auto", "auto");
-    testGridDefinitionsValues(document.getElementById("gridWithMisplacedNone2"), "none", "none", "none", "none", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithExplicitAndImplicit"), "none", "none", "none", "row", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithMisplacedNone1"), "none", "none", "none", "row", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithMisplacedNone2"), "none", "none", "none", "row", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithMisplacedDense"), "none", "none", "none", "row", "auto", "auto");
+    testGridDefinitionsValues(document.getElementById("gridWithMisplacedStack"), "none", "none", "none", "row", "auto", "auto");
 
     debug("");
     debug("Test getting and setting 'grid' shorthand through JS");
-    testGridDefinitionsSetJSValues("10px / 20px", "10px", "20px", "none", "none", "auto", "auto", "10px", "20px", "none", "initial", "initial", "initial");
-    testGridDefinitionsSetJSValues("10px / (line) 'a' 20px", "10px", "(line) 20px", "\"a\"", "none", "auto", "auto", "10px", "(line) 20px", "\"a\"", "initial", "initial", "initial");
-    testGridDefinitionsSetJSValues("row 20px", "none", "none", "none", "row", "20px", "20px", "initial", "initial", "initial", "row", "20px", "20px");
+    testGridDefinitionsSetJSValues("10px / 20px", "10px", "20px", "none", "row", "auto", "auto", "10px", "20px", "none", "initial", "initial", "initial");
+    testGridDefinitionsSetJSValues("10px / (line) 'a' 20px", "10px", "(line) 20px", "\"a\"", "row", "auto", "auto", "10px", "(line) 20px", "\"a\"", "initial", "initial", "initial");
+    testGridDefinitionsSetJSValues("row dense 20px", "none", "none", "none", "row dense", "20px", "20px", "initial", "initial", "initial", "row dense", "20px", "20px");
     testGridDefinitionsSetJSValues("column 20px / 10px", "none", "none", "none", "column", "20px", "10px", "initial", "initial", "initial", "column", "20px", "10px");
 
     debug("");
     debug("Test the initial value");
     var element = document.createElement("div");
     document.body.appendChild(element);
-    testGridDefinitionsValues(element, "none", "none", "none", "none", "auto", "auto");
+    testGridDefinitionsValues(element, "none", "none", "none", "row", "auto", "auto");
     shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-columns')", "'none'");
     shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-rows')", "'none'");
     shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-areas')", "'none'");
-    shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-flow')", "'none'");
+    shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-flow')", "'row'");
     shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'auto'");
     shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'auto'");
 
     debug("");
     debug("Test setting grid-template-columns and grid-template-rows back to 'none' through JS");
     testGridDefinitionsSetJSValues("column 10px / 20px", "none", "none", "none", "column", "10px", "20px", "initial", "initial", "initial", "column", "10px", "20px");
-    testGridDefinitionsSetJSValues("none", "none", "none", "none", "none", "auto", "auto", "none", "none", "none", "initial", "initial", "initial");
+    testGridDefinitionsSetJSValues("none", "none", "none", "none", "row", "auto", "auto", "none", "none", "none", "initial", "initial", "initial");
 
 </script>
 </body>