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

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

Issue 13992003: Add support for parsing <grid-line> that includes a 'span' (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Fixed the change to match the specification Created 7 years, 8 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 | Annotate | Revision Log
« no previous file with comments | « no previous file | LayoutTests/fast/css-grid-layout/grid-item-column-row-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> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <script> 4 <script>
5 if (window.testRunner) 5 if (window.testRunner)
6 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1); 6 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1);
7 </script> 7 </script>
8 <style> 8 <style>
9 .gridItemWithPositiveInteger { 9 .gridItemWithPositiveInteger {
10 -webkit-grid-column: 10; 10 -webkit-grid-column: 10;
11 -webkit-grid-row: 15; 11 -webkit-grid-row: 15;
12 } 12 }
13 .gridItemWithNegativeInteger { 13 .gridItemWithNegativeInteger {
14 -webkit-grid-column: -10; 14 -webkit-grid-column: -10;
15 -webkit-grid-row: -15; 15 -webkit-grid-row: -15;
16 } 16 }
17 .gridItemWithAuto { 17 .gridItemWithAuto {
18 -webkit-grid-column: auto; 18 -webkit-grid-column: auto;
19 -webkit-grid-row: auto; 19 -webkit-grid-row: auto;
20 } 20 }
21 .gridItemWith2Integer { 21 .gridItemWith2Integer {
22 -webkit-grid-column: 10 / 15; 22 -webkit-grid-column: 10 / 15;
23 -webkit-grid-row: 5 / 5; 23 -webkit-grid-row: 5 / 5;
24 } 24 }
25 .gridItemWithNegativePositiveInteger { 25 .gridItemWithNegativePositiveInteger {
26 -webkit-grid-column: 10 / -10; 26 -webkit-grid-column: 10 / -10;
27 -webkit-grid-row: -8 / 5; 27 -webkit-grid-row: -8 / 5;
28 } 28 }
29 .gridItemWithBeforeSpan {
30 -webkit-grid-column: span 2 / 4;
31 -webkit-grid-row: 3 / span 5;
32 }
33 .gridItemWithAfterSpan {
34 -webkit-grid-column: 2 span / 4;
35 -webkit-grid-row: 3 / 5 span;
36 }
37 .gridItemWith2OnlySpan {
38 -webkit-grid-column: span / span;
39 -webkit-grid-row: span / span;
40 }
29 .gridItemWith2Auto { 41 .gridItemWith2Auto {
30 -webkit-grid-column: auto / auto; 42 -webkit-grid-column: auto / auto;
31 -webkit-grid-row: auto / auto; 43 -webkit-grid-row: auto / auto;
32 } 44 }
33 .gridItemWithBothLongHand { 45 .gridItemWithBothLongHand {
34 -webkit-grid-end: 11; 46 -webkit-grid-end: 11;
35 -webkit-grid-before: 4; 47 -webkit-grid-before: 4;
36 } 48 }
37 .gridItemWithNoSpace { 49 .gridItemWithNoSpace {
38 -webkit-grid-column: auto/1; 50 -webkit-grid-column: auto/1;
39 -webkit-grid-row: 5/auto; 51 -webkit-grid-row: 5/auto;
40 } 52 }
41 </style> 53 </style>
42 <script src="../js/resources/js-test-pre.js"></script> 54 <script src="../js/resources/js-test-pre.js"></script>
43 </head> 55 </head>
44 <body> 56 <body>
45 <!-- The first has no properties set on it. --> 57 <!-- The first has no properties set on it. -->
46 <div id="gridElement"></div> 58 <div id="gridElement"></div>
47 <div class="gridItemWithPositiveInteger" id="gridItemWithPositiveInteger"></div> 59 <div class="gridItemWithPositiveInteger" id="gridItemWithPositiveInteger"></div>
48 <div class="gridItemWithNegativeInteger" id="gridItemWithNegativeInteger"></div> 60 <div class="gridItemWithNegativeInteger" id="gridItemWithNegativeInteger"></div>
49 <div class="gridItemWithAuto" id="gridItemWithAutoElement"></div> 61 <div class="gridItemWithAuto" id="gridItemWithAutoElement"></div>
50 <div class="gridItemWith2Integer" id="gridItemWith2IntegerElement"></div> 62 <div class="gridItemWith2Integer" id="gridItemWith2IntegerElement"></div>
51 <div class="gridItemWithNegativePositiveInteger" id="gridItemWithNegativePositiv eIntegerElement"></div> 63 <div class="gridItemWithNegativePositiveInteger" id="gridItemWithNegativePositiv eIntegerElement"></div>
52 <div class="gridItemWith2Auto" id="gridItemWith2AutoElement"></div> 64 <div class="gridItemWith2Auto" id="gridItemWith2AutoElement"></div>
65 <div class="gridItemWithBeforeSpan" id="gridItemWithBeforeSpanElement"></div>
66 <div class="gridItemWithAfterSpan" id="gridItemWithAfterSpanElement"></div>
67 <div class="gridItemWith2OnlySpan" id="gridItemWith2OnlySpanElement"></div>
53 <div class="gridItemWithNegativePositiveInteger gridItemWithBothLongHand" id="gr idItemWithBothShortLongHandElement"></div> 68 <div class="gridItemWithNegativePositiveInteger gridItemWithBothLongHand" id="gr idItemWithBothShortLongHandElement"></div>
54 <div class="gridItemWithNoSpace" id="gridItemWithNoSpaceElement"></div> 69 <div class="gridItemWithNoSpace" id="gridItemWithNoSpaceElement"></div>
55 <script> 70 <script>
56 description('Test that setting and getting grid-column and grid-row works as expected'); 71 description('Test that setting and getting grid-column and grid-row works as expected');
57 72
58 debug("Test getting -webkit-grid-column and -webkit-grid-row set through CSS "); 73 debug("Test getting -webkit-grid-column and -webkit-grid-row set through CSS ");
59 var gridElement = document.getElementById("gridElement"); 74 var gridElement = document.getElementById("gridElement");
60 shouldBe("getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-c olumn')", "'auto / auto'"); 75 shouldBe("getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-c olumn')", "'auto / auto'");
61 shouldBe("getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-s tart')", "'auto'"); 76 shouldBe("getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-s tart')", "'auto'");
62 shouldBe("getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-e nd')", "'auto'"); 77 shouldBe("getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-e nd')", "'auto'");
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after
97 shouldBe("getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue ('-webkit-grid-after')", "'5'"); 112 shouldBe("getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue ('-webkit-grid-after')", "'5'");
98 113
99 var gridItemWithNegativePositiveIntegerElement = document.getElementById("gr idItemWithNegativePositiveIntegerElement"); 114 var gridItemWithNegativePositiveIntegerElement = document.getElementById("gr idItemWithNegativePositiveIntegerElement");
100 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-column')", "'10 / -10'"); 115 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-column')", "'10 / -10'");
101 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-start')", "'10'"); 116 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-start')", "'10'");
102 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-end')", "'-10'"); 117 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-end')", "'-10'");
103 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-row')", "'-8 / 5'"); 118 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-row')", "'-8 / 5'");
104 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-before')", "'-8'"); 119 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-before')", "'-8'");
105 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-after')", "'5'"); 120 shouldBe("getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').g etPropertyValue('-webkit-grid-after')", "'5'");
106 121
122 var gridItemWithBeforeSpanElement = document.getElementById("gridItemWithBef oreSpanElement");
123 shouldBe("getComputedStyle(gridItemWithBeforeSpanElement, '').getPropertyVal ue('-webkit-grid-column')", "'span 2 / 4'");
124 shouldBe("getComputedStyle(gridItemWithBeforeSpanElement, '').getPropertyVal ue('-webkit-grid-start')", "'span 2'");
125 shouldBe("getComputedStyle(gridItemWithBeforeSpanElement, '').getPropertyVal ue('-webkit-grid-end')", "'4'");
126 shouldBe("getComputedStyle(gridItemWithBeforeSpanElement, '').getPropertyVal ue('-webkit-grid-row')", "'3 / span 5'");
127 shouldBe("getComputedStyle(gridItemWithBeforeSpanElement, '').getPropertyVal ue('-webkit-grid-before')", "'3'");
128 shouldBe("getComputedStyle(gridItemWithBeforeSpanElement, '').getPropertyVal ue('-webkit-grid-after')", "'span 5'");
129
130 var gridItemWithAfterSpanElement = document.getElementById("gridItemWithAfte rSpanElement");
131 shouldBe("getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValu e('-webkit-grid-column')", "'span 2 / 4'");
132 shouldBe("getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValu e('-webkit-grid-start')", "'span 2'");
133 shouldBe("getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValu e('-webkit-grid-end')", "'4'");
134 shouldBe("getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValu e('-webkit-grid-row')", "'3 / span 5'");
135 shouldBe("getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValu e('-webkit-grid-before')", "'3'");
136 shouldBe("getComputedStyle(gridItemWithAfterSpanElement, '').getPropertyValu e('-webkit-grid-after')", "'span 5'");
137
138 var gridItemWith2OnlySpanElement = document.getElementById("gridItemWith2Onl ySpanElement");
139 shouldBe("getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValu e('-webkit-grid-column')", "'auto / auto'");
140 shouldBe("getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValu e('-webkit-grid-start')", "'auto'");
141 shouldBe("getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValu e('-webkit-grid-end')", "'auto'");
142 shouldBe("getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValu e('-webkit-grid-row')", "'auto / auto'");
143 shouldBe("getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValu e('-webkit-grid-before')", "'auto'");
144 shouldBe("getComputedStyle(gridItemWith2OnlySpanElement, '').getPropertyValu e('-webkit-grid-after')", "'auto'");
145
107 var gridItemWith2AutoElement = document.getElementById("gridItemWith2AutoEle ment"); 146 var gridItemWith2AutoElement = document.getElementById("gridItemWith2AutoEle ment");
108 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-column')", "'auto / auto'"); 147 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-column')", "'auto / auto'");
109 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-start')", "'auto'"); 148 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-start')", "'auto'");
110 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-end')", "'auto'"); 149 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-end')", "'auto'");
111 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-row')", "'auto / auto'"); 150 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-row')", "'auto / auto'");
112 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-before')", "'auto'"); 151 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-before')", "'auto'");
113 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-after')", "'auto'"); 152 shouldBe("getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('- webkit-grid-after')", "'auto'");
114 153
115 var gridItemWithBothShortLongHandElement = document.getElementById("gridItem WithBothShortLongHandElement"); 154 var gridItemWithBothShortLongHandElement = document.getElementById("gridItem WithBothShortLongHandElement");
116 shouldBe("getComputedStyle(gridItemWithBothShortLongHandElement, '').getProp ertyValue('-webkit-grid-column')", "'10 / 11'"); 155 shouldBe("getComputedStyle(gridItemWithBothShortLongHandElement, '').getProp ertyValue('-webkit-grid-column')", "'10 / 11'");
(...skipping 61 matching lines...) Expand 10 before | Expand all | Expand 10 after
178 element.style.webkitGridRow = "1 / 10"; 217 element.style.webkitGridRow = "1 / 10";
179 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'10 / 55'"); 218 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'10 / 55'");
180 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'10'"); 219 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'10'");
181 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'55'"); 220 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'55'");
182 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'1 / 10'"); 221 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'1 / 10'");
183 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'1'"); 222 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'1'");
184 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'10'"); 223 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'10'");
185 224
186 element = document.createElement("div"); 225 element = document.createElement("div");
187 document.body.appendChild(element); 226 document.body.appendChild(element);
227 element.style.webkitGridColumn = "span 5 / 5";
228 element.style.webkitGridRow = "4 / span 4";
229 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'span 5 / 5'");
230 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'span 5'");
231 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'5'");
232 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'4 / span 4'");
233 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'4'");
234 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'span 4'");
235
236 element = document.createElement("div");
237 document.body.appendChild(element);
188 element.style.webkitGridColumn = "-5 / 5"; 238 element.style.webkitGridColumn = "-5 / 5";
189 element.style.webkitGridRow = "4 / -4"; 239 element.style.webkitGridRow = "4 / -4";
190 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'-5 / 5'"); 240 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'-5 / 5'");
191 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'-5'"); 241 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'-5'");
192 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'5'"); 242 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'5'");
193 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'4 / -4'"); 243 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'4 / -4'");
194 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'4'"); 244 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'4'");
195 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'-4'"); 245 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'-4'");
196 246
197 element = document.createElement("div"); 247 element = document.createElement("div");
(...skipping 11 matching lines...) Expand all
209 document.body.appendChild(element); 259 document.body.appendChild(element);
210 element.style.webkitGridColumn = "auto / 5"; 260 element.style.webkitGridColumn = "auto / 5";
211 element.style.webkitGridRow = "auto / 8"; 261 element.style.webkitGridRow = "auto / 8";
212 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / 5'"); 262 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / 5'");
213 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'"); 263 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'");
214 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'5'"); 264 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'5'");
215 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / 8'"); 265 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / 8'");
216 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'"); 266 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'");
217 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'8'"); 267 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'8'");
218 268
269 element = document.createElement("div");
270 document.body.appendChild(element);
271 element.style.webkitGridColumn = "span / 3";
272 element.style.webkitGridRow = "5 / span";
273 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'span 1 / 3'");
274 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'span 1'");
275 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'3'");
276 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'5 / span 1'");
277 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'5'");
278 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'span 1'");
279
219 debug(""); 280 debug("");
220 debug("Test setting grid-column and grid-row back to 'auto' through JS"); 281 debug("Test setting grid-column and grid-row back to 'auto' through JS");
221 element.style.webkitGridColumn = "18 / 19"; 282 element.style.webkitGridColumn = "18 / 19";
222 element.style.webkitGridRow = "66 / 68"; 283 element.style.webkitGridRow = "66 / 68";
223 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'18 / 19'"); 284 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'18 / 19'");
224 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'18'"); 285 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'18'");
225 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'19'"); 286 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'19'");
226 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'66 / 68'"); 287 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'66 / 68'");
227 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'66'"); 288 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'66'");
228 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'68'"); 289 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'68'");
(...skipping 90 matching lines...) Expand 10 before | Expand all | Expand 10 after
319 element = document.createElement("div"); 380 element = document.createElement("div");
320 document.body.appendChild(element); 381 document.body.appendChild(element);
321 element.style.webkitGridColumn = "0"; 382 element.style.webkitGridColumn = "0";
322 element.style.webkitGridRow = "0"; 383 element.style.webkitGridRow = "0";
323 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / auto'"); 384 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / auto'");
324 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'"); 385 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'");
325 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'auto'"); 386 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'auto'");
326 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / auto'"); 387 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / auto'");
327 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'"); 388 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'");
328 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'auto'"); 389 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'auto'");
390
391 element = document.createElement("div");
392 document.body.appendChild(element);
393 element.style.webkitGridColumn = "span span / span span";
394 element.style.webkitGridRow = "span span / span span";
395 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / auto'");
396 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'");
397 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'auto'");
398 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / auto'");
399 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'");
400 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'auto'");
401
402 // Negative integer or 0 are invalid.
403 element = document.createElement("div");
404 document.body.appendChild(element);
405 element.style.webkitGridColumn = "span -1 / -2 span";
406 element.style.webkitGridRow = "-3 span / span -4";
407 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / auto'");
408 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'");
409 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'auto'");
410 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / auto'");
411 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'");
412 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'auto'");
413
414 element = document.createElement("div");
415 document.body.appendChild(element);
416 element.style.webkitGridColumn = "0 span / span 0";
417 element.style.webkitGridRow = "span 0 / 0 span";
418 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / auto'");
419 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'");
420 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'auto'");
421 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / auto'");
422 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'");
423 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'auto'");
424
425 element = document.createElement("div");
426 document.body.appendChild(element);
427 element.style.webkitGridColumn = "5 span / span 2";
428 element.style.webkitGridRow = "span 4 / 3 span";
429 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-colum n')", "'auto / auto'");
430 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-start ')", "'auto'");
431 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') ", "'auto'");
432 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') ", "'auto / auto'");
433 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-befor e')", "'auto'");
434 shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-after ')", "'auto'");
329 </script> 435 </script>
330 <script src="../js/resources/js-test-post.js"></script> 436 <script src="../js/resources/js-test-post.js"></script>
331 </body> 437 </body>
332 </html> 438 </html>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/css-grid-layout/grid-item-column-row-get-set-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698