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

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-column-row-get-set.html

Issue 1970573004: [css-grid] Consider invalid using just "span" as grid-line value (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 7 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
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 <style> 5 <style>
6 .grid { 6 .grid {
7 grid-template-areas: "firstArea secondArea" 7 grid-template-areas: "firstArea secondArea"
8 "thirdArea thirdArea"; 8 "thirdArea thirdArea";
9 9
10 grid-template-columns: [first nav] 10px 10px; 10 grid-template-columns: [first nav] 10px 10px;
(...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after
69 } 69 }
70 .gridItemWithSpanNumberCustomIdent { 70 .gridItemWithSpanNumberCustomIdent {
71 grid-column: 1 /span 3 first; 71 grid-column: 1 /span 3 first;
72 grid-row: -1 / last 2 span ; 72 grid-row: -1 / last 2 span ;
73 } 73 }
74 .gridItemWithSingleNamedGridArea { 74 .gridItemWithSingleNamedGridArea {
75 grid-column: thirdArea; 75 grid-column: thirdArea;
76 grid-row: firstArea; 76 grid-row: firstArea;
77 } 77 }
78 .gridItemWithNamedGridAreaAndSpan { 78 .gridItemWithNamedGridAreaAndSpan {
79 grid-column: thirdArea / span; 79 grid-column: thirdArea / span 1;
80 grid-row: firstArea / span 2; 80 grid-row: firstArea / span 2;
81 } 81 }
82 </style> 82 </style>
83 <script src="resources/grid-item-column-row-parsing-utils.js"></script> 83 <script src="resources/grid-item-column-row-parsing-utils.js"></script>
84 <script src="../../resources/js-test.js"></script> 84 <script src="../../resources/js-test.js"></script>
85 </head> 85 </head>
86 <body> 86 <body>
87 <div class="grid"> 87 <div class="grid">
88 <!-- The first has no properties set on it. --> 88 <!-- The first has no properties set on it. -->
89 <div id="gridItemWithNoCSSRule"></div> 89 <div id="gridItemWithNoCSSRule"></div>
(...skipping 19 matching lines...) Expand all
109 description('Test that setting and getting grid-column and grid-row works as expected'); 109 description('Test that setting and getting grid-column and grid-row works as expected');
110 110
111 debug("Test getting grid-column and grid-row set through CSS"); 111 debug("Test getting grid-column and grid-row set through CSS");
112 testColumnRowCSSParsing("gridItemWithNoCSSRule", "auto / auto", "auto / auto "); 112 testColumnRowCSSParsing("gridItemWithNoCSSRule", "auto / auto", "auto / auto ");
113 testColumnRowCSSParsing("gridItemWithPositiveInteger", "10 / auto", "15 / au to"); 113 testColumnRowCSSParsing("gridItemWithPositiveInteger", "10 / auto", "15 / au to");
114 testColumnRowCSSParsing("gridItemWithNegativeInteger", "-10 / auto", "-15 / auto"); 114 testColumnRowCSSParsing("gridItemWithNegativeInteger", "-10 / auto", "-15 / auto");
115 testColumnRowCSSParsing("gridItemWithAutoElement", "auto / auto", "auto / au to"); 115 testColumnRowCSSParsing("gridItemWithAutoElement", "auto / auto", "auto / au to");
116 testColumnRowCSSParsing("gridItemWith2IntegerElement", "10 / 15", "5 / 5"); 116 testColumnRowCSSParsing("gridItemWith2IntegerElement", "10 / 15", "5 / 5");
117 testColumnRowCSSParsing("gridItemWithNegativePositiveIntegerElement", "10 / -10", "-8 / 5"); 117 testColumnRowCSSParsing("gridItemWithNegativePositiveIntegerElement", "10 / -10", "-8 / 5");
118 testColumnRowCSSParsing("gridItemWithBeforeSpanElement", "span 2 / 4", "3 / span 5"); 118 testColumnRowCSSParsing("gridItemWithBeforeSpanElement", "span 2 / 4", "3 / span 5");
119 testColumnRowCSSParsing("gridItemWith2OnlySpanElement", "span 1 / span 1", " span 1 / span 1"); 119 testColumnRowCSSParsing("gridItemWith2OnlySpanElement", "auto / auto", "auto / auto");
120 testColumnRowCSSParsing("gridItemWith2AutoElement", "auto / auto" , "auto / auto"); 120 testColumnRowCSSParsing("gridItemWith2AutoElement", "auto / auto" , "auto / auto");
121 testColumnRowCSSParsing("gridItemWithBothShortLongHandElement", "10 / 11", " 4 / 5"); 121 testColumnRowCSSParsing("gridItemWithBothShortLongHandElement", "10 / 11", " 4 / 5");
122 testColumnRowCSSParsing("gridItemWithNoSpaceElement", "auto / 1", "5 / auto" ); 122 testColumnRowCSSParsing("gridItemWithNoSpaceElement", "auto / 1", "5 / auto" );
123 testColumnRowCSSParsing("gridItemWithCustomIdent", "first / first", "last / last"); 123 testColumnRowCSSParsing("gridItemWithCustomIdent", "first / first", "last / last");
124 testColumnRowCSSParsing("gridItemWithNonExistingCustomIdent", "nav / nav", " foo / foo"); 124 testColumnRowCSSParsing("gridItemWithNonExistingCustomIdent", "nav / nav", " foo / foo");
125 testColumnRowCSSParsing("gridItemWithSpanCustomIdent", "1 / span 1 first", " -1 / span 1 last"); 125 testColumnRowCSSParsing("gridItemWithSpanCustomIdent", "1 / span 1 first", " -1 / span 1 last");
126 testColumnRowCSSParsing("gridItemWithSpanNumberCustomIdent", "1 / span 3 fir st", "-1 / span 2 last"); 126 testColumnRowCSSParsing("gridItemWithSpanNumberCustomIdent", "1 / span 3 fir st", "-1 / span 2 last");
127 testColumnRowCSSParsing("gridItemWithSingleNamedGridArea", "thirdArea / thir dArea", "firstArea / firstArea"); 127 testColumnRowCSSParsing("gridItemWithSingleNamedGridArea", "thirdArea / thir dArea", "firstArea / firstArea");
128 testColumnRowCSSParsing("gridItemWithNamedGridAreaAndSpan", "thirdArea / spa n 1", "firstArea / span 2"); 128 testColumnRowCSSParsing("gridItemWithNamedGridAreaAndSpan", "thirdArea / spa n 1", "firstArea / span 2");
129 129
(...skipping 11 matching lines...) Expand all
141 debug(""); 141 debug("");
142 debug("Test getting and setting grid-column and grid-row through JS"); 142 debug("Test getting and setting grid-column and grid-row through JS");
143 testColumnRowJSParsing("18", "66", "18 / auto", "66 / auto"); 143 testColumnRowJSParsing("18", "66", "18 / auto", "66 / auto");
144 testColumnRowJSParsing("-55", "-40", "-55 / auto", "-40 / auto"); 144 testColumnRowJSParsing("-55", "-40", "-55 / auto", "-40 / auto");
145 testColumnRowJSParsing("auto", "auto", "auto / auto", "auto / auto"); 145 testColumnRowJSParsing("auto", "auto", "auto / auto", "auto / auto");
146 testColumnRowJSParsing("10 / 55", "1 / 10"); 146 testColumnRowJSParsing("10 / 55", "1 / 10");
147 testColumnRowJSParsing("span 5 / 5", "4 / span 4"); 147 testColumnRowJSParsing("span 5 / 5", "4 / span 4");
148 testColumnRowJSParsing("-5 / 5", "4 / -4"); 148 testColumnRowJSParsing("-5 / 5", "4 / -4");
149 testColumnRowJSParsing("4 / auto", "5 / auto"); 149 testColumnRowJSParsing("4 / auto", "5 / auto");
150 testColumnRowJSParsing("auto / 5", "auto / 8"); 150 testColumnRowJSParsing("auto / 5", "auto / 8");
151 testColumnRowJSParsing("span / 3", "5 / span", "span 1 / 3", "5 / span 1"); 151 testColumnRowJSParsing("span / 3", "5 / span", "auto / auto", "auto / auto") ;
152 testColumnRowJSParsing("span 1 / 3", "5 / span 1", "span 1 / 3", "5 / span 1 ");
152 testColumnRowJSParsing("first span / 3", "5 / last span", "span 1 first / 3" , "5 / span 1 last"); 153 testColumnRowJSParsing("first span / 3", "5 / last span", "span 1 first / 3" , "5 / span 1 last");
153 testColumnRowJSParsing("first / last", "nav / last span", "first / last", "n av / span 1 last"); 154 testColumnRowJSParsing("first / last", "nav / last span", "first / last", "n av / span 1 last");
154 testColumnRowJSParsing("3 first / 2 last", "5 nav / last 7 span", "3 first / 2 last", "5 nav / span 7 last"); 155 testColumnRowJSParsing("3 first / 2 last", "5 nav / last 7 span", "3 first / 2 last", "5 nav / span 7 last");
155 testColumnRowJSParsing("3 first span / -3 last", "last 2 span / -1 nav", "sp an 3 first / -3 last", "span 2 last / -1 nav"); 156 testColumnRowJSParsing("3 first span / -3 last", "last 2 span / -1 nav", "sp an 3 first / -3 last", "span 2 last / -1 nav");
156 testColumnRowJSParsing("5 / none", "8 / foobar"); 157 testColumnRowJSParsing("5 / none", "8 / foobar");
157 testColumnRowJSParsing("nonExistent / none", "nonExistent / foobar"); 158 testColumnRowJSParsing("nonExistent / none", "nonExistent / foobar");
158 testColumnRowJSParsing("span first 3 / none", "last span / foobar", "span 3 first / none", "span 1 last / foobar"); 159 testColumnRowJSParsing("span first 3 / none", "last span / foobar", "span 3 first / none", "span 1 last / foobar");
159 testColumnRowJSParsing("5 span / span 2", "span first / last span", "span 5 / span 2", "span 1 first / span 1 last"); 160 testColumnRowJSParsing("5 span / span 2", "span first / last span", "span 5 / span 2", "span 1 first / span 1 last");
160 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"); 161 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");
161 162
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after
194 testColumnRowInvalidJSParsing("4 5", "5 8"); 195 testColumnRowInvalidJSParsing("4 5", "5 8");
195 testColumnRowInvalidJSParsing("4 /", "5 /"); 196 testColumnRowInvalidJSParsing("4 /", "5 /");
196 testColumnRowInvalidJSParsing("5 5", "8 auto"); 197 testColumnRowInvalidJSParsing("5 5", "8 auto");
197 testColumnRowInvalidJSParsing("5 / /", "8 / /"); 198 testColumnRowInvalidJSParsing("5 / /", "8 / /");
198 199
199 // 0 is invalid. 200 // 0 is invalid.
200 testColumnRowInvalidJSParsing("0 / 5", "0 / 6"); 201 testColumnRowInvalidJSParsing("0 / 5", "0 / 6");
201 testColumnRowInvalidJSParsing("6 / 0", "8 / 0"); 202 testColumnRowInvalidJSParsing("6 / 0", "8 / 0");
202 testColumnRowInvalidJSParsing("0", "0"); 203 testColumnRowInvalidJSParsing("0", "0");
203 204
205 // 'span' alone is invalid
206 testColumnRowInvalidJSParsing("span", "span");
207 testColumnRowInvalidJSParsing("span / span", "span / span");
208
204 // 'span' and 'auto' are not valid <custom-ident> 209 // 'span' and 'auto' are not valid <custom-ident>
205 testColumnRowInvalidJSParsing("span span / span span", "span span / span spa n"); 210 testColumnRowInvalidJSParsing("span span / span span", "span span / span spa n");
206 testColumnRowInvalidJSParsing("span auto / span auto", "span auto / span aut o"); 211 testColumnRowInvalidJSParsing("span auto / span auto", "span auto / span aut o");
207 212
208 // CSS wide keywords are not valid <custom-ident> 213 // CSS wide keywords are not valid <custom-ident>
209 testColumnRowInvalidJSParsing("span default / span default", "span default / span default"); 214 testColumnRowInvalidJSParsing("span default / span default", "span default / span default");
210 testColumnRowInvalidJSParsing("span inherit / span inherit", "span inherit / span inherit"); 215 testColumnRowInvalidJSParsing("span inherit / span inherit", "span inherit / span inherit");
211 testColumnRowInvalidJSParsing("span initial / span initial", "span initial / span initial"); 216 testColumnRowInvalidJSParsing("span initial / span initial", "span initial / span initial");
212 217
213 // More than 1 <integer> and / or <string>. 218 // More than 1 <integer> and / or <string>.
(...skipping 18 matching lines...) Expand all
232 testColumnRowInvalidJSParsing("0 / span 0", "0 / 0 span"); 237 testColumnRowInvalidJSParsing("0 / span 0", "0 / 0 span");
233 testColumnRowInvalidJSParsing("span -3 'first' / 3 last", "last -2 span / 1 nav"); 238 testColumnRowInvalidJSParsing("span -3 'first' / 3 last", "last -2 span / 1 nav");
234 239
235 // We don't allow span to be between the <integer> and the <string>. 240 // We don't allow span to be between the <integer> and the <string>.
236 testColumnRowInvalidJSParsing("first span 1 / last", "2 span first / last"); 241 testColumnRowInvalidJSParsing("first span 1 / last", "2 span first / last");
237 testColumnRowInvalidJSParsing("3 first / 2 span last", "5 nav / last span 7" ); 242 testColumnRowInvalidJSParsing("3 first / 2 span last", "5 nav / last span 7" );
238 testColumnRowInvalidJSParsing("3 / 1 span 2", "5 / 3 span 3"); 243 testColumnRowInvalidJSParsing("3 / 1 span 2", "5 / 3 span 3");
239 </script> 244 </script>
240 </body> 245 </body>
241 </html> 246 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698