Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1781)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-template-shorthand-get-set.html

Issue 2002063004: [css-grid] Disallow repeat() in grid-template shorthand (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Rebased patch for landing Created 4 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-template-shorthand-get-set-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
2 <html> 2 <html>
3 <head> 3 <head>
4 <link href="resources/grid.css" rel="stylesheet"> 4 <link href="resources/grid.css" rel="stylesheet">
5 <link href="resources/grid-alignment.css" rel="stylesheet"> 5 <link href="resources/grid-alignment.css" rel="stylesheet">
6 <style> 6 <style>
7 #gridTemplateWithNone { 7 #gridTemplateWithNone {
8 grid-template: none; 8 grid-template: none;
9 } 9 }
10 #gridTemplateSimpleForm { 10 #gridTemplateSimpleForm {
(...skipping 27 matching lines...) Expand all
38 grid-template: [head1] "a" 15px [tail1] 38 grid-template: [head1] "a" 15px [tail1]
39 [head2] "b" 20px [tail2] / 10px; 39 [head2] "b" 20px [tail2] / 10px;
40 } 40 }
41 #gridTemplateComplexFormWithLineNamesMultipleRowsWithoutRowsSizes { 41 #gridTemplateComplexFormWithLineNamesMultipleRowsWithoutRowsSizes {
42 grid-template: [head1] "a" [tail1] 42 grid-template: [head1] "a" [tail1]
43 [head2] "b" [tail2] / 10px; 43 [head2] "b" [tail2] / 10px;
44 } 44 }
45 #gridTemplateComplexFormWithLineNamesMultipleRowsAndColumns { 45 #gridTemplateComplexFormWithLineNamesMultipleRowsAndColumns {
46 grid-template: "a b c" 100px [nav] 46 grid-template: "a b c" 100px [nav]
47 [nav2] "d e f" 25px [nav] 47 [nav2] "d e f" 25px [nav]
48 [nav2] "g h i" 25px [last] / [first] 10px repeat(2, [nav nav 2] 15px); 48 [nav2] "g h i" 25px [last] / [first] 10px [nav nav2] 15px [n av] 15px [last];
49 } 49 }
50 #gridTemplateComplexFormWithLineNamesMultipleRowsAndColumnsWithoutRowsSizes { 50 #gridTemplateComplexFormWithLineNamesMultipleRowsAndColumnsWithoutRowsSizes {
51 grid-template: "a b c" [nav] 51 grid-template: "a b c" [nav]
52 [nav2] "d e f" [nav] 52 [nav2] "d e f" [nav]
53 [nav2] "g h i" [last] / [first] 10px repeat(2, [nav nav2] 15p x); 53 [nav2] "g h i" [last] / [first] 10px [nav nav2] 15px [nav] 15 px [last];
54 } 54 }
55 #gridTemplateComplexFormWithAuto { 55 #gridTemplateComplexFormWithAuto {
56 grid-template: "a" / 10px; 56 grid-template: "a" / 10px;
57 } 57 }
58 #gridTemplateComplexFormOnlyAreas { 58 #gridTemplateComplexFormOnlyAreas {
59 grid-template: "a"; 59 grid-template: "a";
60 } 60 }
61 #gridTemplateNoColumnsRowWithEmptyTrailingLineNames { 61 #gridTemplateNoColumnsRowWithEmptyTrailingLineNames {
62 grid-template: [first] "a" auto []; 62 grid-template: [first] "a" auto [];
63 } 63 }
(...skipping 70 matching lines...) Expand 10 before | Expand all | Expand 10 after
134 } 134 }
135 #gridTemplateComplexFormWithNoneColumns { 135 #gridTemplateComplexFormWithNoneColumns {
136 grid-template: "a" [name] 10px / none; 136 grid-template: "a" [name] 10px / none;
137 } 137 }
138 #gridTemplateNoColumnsRowWithTwoEmptyTrailingLineNames { 138 #gridTemplateNoColumnsRowWithTwoEmptyTrailingLineNames {
139 grid-template: [first] "a" auto [] []; 139 grid-template: [first] "a" auto [] [];
140 } 140 }
141 #gridTemplateNoColumnsRowWithEmptyTrailingLineNamesAndNonEmptyLeadingLineNames { 141 #gridTemplateNoColumnsRowWithEmptyTrailingLineNamesAndNonEmptyLeadingLineNames {
142 grid-template: [first] "a" auto [] [tail]; 142 grid-template: [first] "a" auto [] [tail];
143 } 143 }
144 #gridTemplateRepeat {
145 grid-template: "a" / repeat(1, 100px);
146 }
147 #gridTemplateRepeatAutoFill {
148 grid-template: "a" / repeat(auto-fill, 100px);
149 }
150 #gridTemplateRepeatAutoFit {
151 grid-template: "a" / repeat(auto-fit, 100px);
152 }
144 153
145 154
146 </style> 155 </style>
147 <script src="../../resources/js-test.js"></script> 156 <script src="../../resources/js-test.js"></script>
148 </head> 157 </head>
149 <body> 158 <body>
150 <div class="grid" id="gridTemplateWithNone"></div> 159 <div class="grid" id="gridTemplateWithNone"></div>
151 <div class="grid" id="gridTemplateSimpleForm"></div> 160 <div class="grid" id="gridTemplateSimpleForm"></div>
152 <div class="grid" id="gridTemplateSimpleFormWithNoneColumns"></div> 161 <div class="grid" id="gridTemplateSimpleFormWithNoneColumns"></div>
153 <div class="grid" id="gridTemplateSimpleFormWithNoneRows"></div> 162 <div class="grid" id="gridTemplateSimpleFormWithNoneRows"></div>
(...skipping 29 matching lines...) Expand all
183 <div class="grid" id="gridTemplateComplexFormNoColumnSize"></div> 192 <div class="grid" id="gridTemplateComplexFormNoColumnSize"></div>
184 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize1"></div> 193 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize1"></div>
185 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize2"></div> 194 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize2"></div>
186 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize3"></div> 195 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize3"></div>
187 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize4"></div> 196 <div class="grid" id="gridTemplateComplexFormMisplacedRowsSize4"></div>
188 <div class="grid" id="gridTemplateComplexFormColumnsNotParsing1"></div> 197 <div class="grid" id="gridTemplateComplexFormColumnsNotParsing1"></div>
189 <div class="grid" id="gridTemplateComplexFormColumnsNotParsing2"></div> 198 <div class="grid" id="gridTemplateComplexFormColumnsNotParsing2"></div>
190 <div class="grid" id="gridTemplateComplexFormWithNoneColumns"></div> 199 <div class="grid" id="gridTemplateComplexFormWithNoneColumns"></div>
191 <div class="grid" id="gridTemplateNoColumnsRowWithTwoEmptyTrailingLineNames"></d iv> 200 <div class="grid" id="gridTemplateNoColumnsRowWithTwoEmptyTrailingLineNames"></d iv>
192 <div class="grid" id="gridTemplateConsecutiveAreas"></div> 201 <div class="grid" id="gridTemplateConsecutiveAreas"></div>
202 <div class="grid" id="gridTemplateRepeat"></div>
203 <div class="grid" id="gridTemplateRepeatAutoFill"></div>
204 <div class="grid" id="gridTemplateRepeatAutoFit"></div>
193 <script src="resources/grid-template-shorthand-parsing-utils.js"></script> 205 <script src="resources/grid-template-shorthand-parsing-utils.js"></script>
194 <script> 206 <script>
195 description("This test checks that the 'grid-template' shorthand is properly parsed and the longhand properties correctly assigned."); 207 description("This test checks that the 'grid-template' shorthand is properly parsed and the longhand properties correctly assigned.");
196 208
197 debug("Test getting grid-template-areas set through CSS."); 209 debug("Test getting grid-template-areas set through CSS.");
198 testGridDefinitionsValues(document.getElementById("gridTemplateWithNone"), " none", "none", "none"); 210 testGridDefinitionsValues(document.getElementById("gridTemplateWithNone"), " none", "none", "none");
199 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleForm"), "10px", "15px", "none"); 211 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleForm"), "10px", "15px", "none");
200 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormWit hNoneColumns"), "none", "15px", "none"); 212 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormWit hNoneColumns"), "none", "15px", "none");
201 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormWit hNoneRows"), "10px", "none", "none"); 213 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormWit hNoneRows"), "10px", "none", "none");
202 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormWit hNone"), "none", "none", "none"); 214 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormWit hNone"), "none", "none", "none");
203 testGridDefinitionsValues(document.getElementById("gridTemplateComplexForm") , "10px", "15px", '"a"'); 215 testGridDefinitionsValues(document.getElementById("gridTemplateComplexForm") , "10px", "15px", '"a"');
204 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNames"), "10px", "[head] 15px [tail]", '"a"'); 216 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNames"), "10px", "[head] 15px [tail]", '"a"');
205 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesWithoutRowSize"), "10px", "[head] 0px [tail]", '"a"'); 217 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesWithoutRowSize"), "10px", "[head] 0px [tail]", '"a"');
206 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleColumns"), "10px 20px", "[head] 15px [tail]", '"a b"'); 218 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleColumns"), "10px 20px", "[head] 15px [tail]", '"a b"');
207 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleColumnsWithoutRowSize"), "10px 20px", "[head] 0px [tail]", '" a b"'); 219 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleColumnsWithoutRowSize"), "10px 20px", "[head] 0px [tail]", '" a b"');
208 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRows"), "10px", "[head1] 15px [tail1 head2] 20px [tail2]", '" a" "b"'); 220 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRows"), "10px", "[head1] 15px [tail1 head2] 20px [tail2]", '" a" "b"');
209 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRowsWithoutRowsSizes"), "10px", "[head1] 0px [tail1 head2] 0p x [tail2]", '"a" "b"'); 221 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRowsWithoutRowsSizes"), "10px", "[head1] 0px [tail1 head2] 0p x [tail2]", '"a" "b"');
210 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRowsAndColumns"), "[first] 10px [nav nav2] 15px [nav nav2] 15 px", "100px [nav nav2] 25px [nav nav2] 25px [last]", '"a b c" "d e f" "g h i"'); 222 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRowsAndColumns"), "[first] 10px [nav nav2] 15px [nav] 15px [l ast]", "100px [nav nav2] 25px [nav nav2] 25px [last]", '"a b c" "d e f" "g h i"' );
211 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRowsAndColumnsWithoutRowsSizes"), "[first] 10px [nav nav2] 15 px [nav nav2] 15px", "0px [nav nav2] 0px [nav nav2] 0px [last]", '"a b c" "d e f " "g h i"'); 223 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thLineNamesMultipleRowsAndColumnsWithoutRowsSizes"), "[first] 10px [nav nav2] 15 px [nav] 15px [last]", "0px [nav nav2] 0px [nav nav2] 0px [last]", '"a b c" "d e f" "g h i"');
212 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thAuto"), "10px", "0px", '"a"'); 224 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thAuto"), "10px", "0px", '"a"');
213 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormOn lyAreas"), "0px", "0px", '"a"'); 225 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormOn lyAreas"), "0px", "0px", '"a"');
214 testGridDefinitionsValues(document.getElementById("gridTemplateNoColumnsRowW ithEmptyTrailingLineNames"), "0px", "[first] 0px", '"a"'); 226 testGridDefinitionsValues(document.getElementById("gridTemplateNoColumnsRowW ithEmptyTrailingLineNames"), "0px", "[first] 0px", '"a"');
215 testGridDefinitionsValues(document.getElementById("gridTemplateConsecutiveAr eas"), "10px", "0px 0px", '"a" "a"'); 227 testGridDefinitionsValues(document.getElementById("gridTemplateConsecutiveAr eas"), "10px", "0px 0px", '"a" "a"');
216 228
217 debug(""); 229 debug("");
218 debug("Test getting wrong values for grid-template shorthand through CSS (th ey should resolve to the default: 'none')"); 230 debug("Test getting wrong values for grid-template shorthand through CSS (th ey should resolve to the default: 'none')");
219 testGridDefinitionsValues(document.getElementById("gridTemplateMultipleSlash "), "none", "none", "none"); 231 testGridDefinitionsValues(document.getElementById("gridTemplateMultipleSlash "), "none", "none", "none");
220 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormJus tColumns"), "none", "none", "none"); 232 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormJus tColumns"), "none", "none", "none");
221 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormNoR ows"), "none", "none", "none"); 233 testGridDefinitionsValues(document.getElementById("gridTemplateSimpleFormNoR ows"), "none", "none", "none");
(...skipping 11 matching lines...) Expand all
233 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormNo ColumnSize"), "none", "none", "none"); 245 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormNo ColumnSize"), "none", "none", "none");
234 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize1"), "none", "none", "none"); 246 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize1"), "none", "none", "none");
235 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize2"), "none", "none", "none"); 247 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize2"), "none", "none", "none");
236 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize3"), "none", "none", "none"); 248 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize3"), "none", "none", "none");
237 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize4"), "none", "none", "none"); 249 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormMi splacedRowsSize4"), "none", "none", "none");
238 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormCo lumnsNotParsing1"), "none", "none", "none"); 250 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormCo lumnsNotParsing1"), "none", "none", "none");
239 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormCo lumnsNotParsing2"), "none", "none", "none"); 251 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormCo lumnsNotParsing2"), "none", "none", "none");
240 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thNoneColumns"), "none", "none", "none"); 252 testGridDefinitionsValues(document.getElementById("gridTemplateComplexFormWi thNoneColumns"), "none", "none", "none");
241 testGridDefinitionsValues(document.getElementById("gridTemplateNoColumnsRowW ithTwoEmptyTrailingLineNames"), "none", "none", "none"); 253 testGridDefinitionsValues(document.getElementById("gridTemplateNoColumnsRowW ithTwoEmptyTrailingLineNames"), "none", "none", "none");
242 testGridDefinitionsValues(document.getElementById("gridTemplateNoColumnsRowW ithEmptyTrailingLineNamesAndNonEmptyLeadingLineNames"), "none", "none", "none"); 254 testGridDefinitionsValues(document.getElementById("gridTemplateNoColumnsRowW ithEmptyTrailingLineNamesAndNonEmptyLeadingLineNames"), "none", "none", "none");
255 testGridDefinitionsValues(document.getElementById("gridTemplateRepeat"), "no ne", "none", "none");
256 testGridDefinitionsValues(document.getElementById("gridTemplateRepeatAutoFil l"), "none", "none", "none");
257 testGridDefinitionsValues(document.getElementById("gridTemplateRepeatAutoFit "), "none", "none", "none");
243 258
244 debug(""); 259 debug("");
245 debug("Test the initial value"); 260 debug("Test the initial value");
246 var element = document.createElement("div"); 261 var element = document.createElement("div");
247 document.body.appendChild(element); 262 document.body.appendChild(element);
248 testGridDefinitionsValues(element, "none", "none", "none"); 263 testGridDefinitionsValues(element, "none", "none", "none");
249 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-colu mns')", "'none'"); 264 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-colu mns')", "'none'");
250 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-rows ')", "'none'"); 265 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-rows ')", "'none'");
251 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-area s')", "'none'"); 266 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-area s')", "'none'");
252 267
(...skipping 10 matching lines...) Expand all
263 testGridDefinitionsSetJSValues("'a'", "0px", "0px", "\"a\"", "none", "auto") ; 278 testGridDefinitionsSetJSValues("'a'", "0px", "0px", "\"a\"", "none", "auto") ;
264 279
265 debug(""); 280 debug("");
266 debug("Test setting grid-template shorthand to bad values through JS"); 281 debug("Test setting grid-template shorthand to bad values through JS");
267 testGridDefinitionsSetBadJSValues("'a' / none"); 282 testGridDefinitionsSetBadJSValues("'a' / none");
268 testGridDefinitionsSetBadJSValues("'a' [name] 10px / 25px"); 283 testGridDefinitionsSetBadJSValues("'a' [name] 10px / 25px");
269 testGridDefinitionsSetBadJSValues("'a' / 'b'"); 284 testGridDefinitionsSetBadJSValues("'a' / 'b'");
270 testGridDefinitionsSetBadJSValues("15px"); 285 testGridDefinitionsSetBadJSValues("15px");
271 testGridDefinitionsSetBadJSValues("20px none / 15px"); 286 testGridDefinitionsSetBadJSValues("20px none / 15px");
272 testGridDefinitionsSetBadJSValues("10px 'a' / 25px"); 287 testGridDefinitionsSetBadJSValues("10px 'a' / 25px");
288 testGridDefinitionsSetBadJSValues("'a b' / 100px repeat(1, 200px)");
289 testGridDefinitionsSetBadJSValues("'a b c' / repeat(2, 200px) 100px");
290 testGridDefinitionsSetBadJSValues("'a b c d' / 100px repeat(auto-fill, 200px ) 100px");
273 291
274 </script> 292 </script>
275 </body> 293 </body>
276 </html> 294 </html>
OLDNEW
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-template-shorthand-get-set-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698