Changeset 166712 in webkit
- Timestamp:
- Apr 3, 2014 3:15:55 AM (10 years ago)
- Location:
- trunk
- Files:
-
- 2 added
- 19 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/LayoutTests/ChangeLog
r166706 r166712 1 2014-03-27 Sergio Villar Senin <svillar@igalia.com> 2 3 [CSS Grid Layout] <string> not allowed in grid-{area | row | column} syntax 4 https://bugs.webkit.org/show_bug.cgi?id=129713 5 6 Reviewed by Darin Adler. 7 8 Replaced <string> by <custom-ident> in the tests. Also added a new 9 one to check that children are properly layed out after changes in 10 the grid line names. 11 12 * fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child-expected.txt: Added. 13 * fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html: Added. 14 * fast/css-grid-layout/grid-item-area-get-set.html: 15 * fast/css-grid-layout/grid-item-bad-named-area-auto-placement.html: 16 * fast/css-grid-layout/grid-item-bad-resolution-double-span.html: 17 * fast/css-grid-layout/grid-item-column-row-get-set-expected.txt: 18 * fast/css-grid-layout/grid-item-column-row-get-set.html: 19 * fast/css-grid-layout/grid-item-end-after-get-set-expected.txt: 20 * fast/css-grid-layout/grid-item-end-after-get-set.html: 21 * fast/css-grid-layout/grid-item-named-grid-area-resolution.html: 22 * fast/css-grid-layout/grid-item-named-grid-line-resolution-expected.txt: 23 * fast/css-grid-layout/grid-item-named-grid-line-resolution.html: 24 * fast/css-grid-layout/grid-item-negative-position-resolution.html: 25 * fast/css-grid-layout/grid-item-position-changed-dynamic.html: 26 * fast/css-grid-layout/grid-item-start-before-get-set-expected.txt: 27 * fast/css-grid-layout/grid-item-start-before-get-set.html: 28 1 29 2014-04-03 Antti Koivisto <antti@apple.com> 2 30 -
trunk/LayoutTests/fast/css-grid-layout/grid-item-area-get-set.html
r166299 r166712 38 38 39 39 #fourValueMixedGridArea { 40 -webkit-grid-area: firstArea / span / nonexistent / "foobar";40 -webkit-grid-area: firstArea / span / nonexistent / 1 foobar; 41 41 } 42 42 </style> -
trunk/LayoutTests/fast/css-grid-layout/grid-item-bad-named-area-auto-placement.html
r163625 r166712 24 24 25 25 .namedGridLineSpanRow { 26 -webkit-grid-row: nonExistentArea / span 5 "firstRow";26 -webkit-grid-row: nonExistentArea / span 5 firstRow; 27 27 -webkit-grid-column: 1; 28 28 } -
trunk/LayoutTests/fast/css-grid-layout/grid-item-bad-resolution-double-span.html
r166157 r166712 16 16 .bothSpanRow { 17 17 -webkit-grid-column: 1; 18 -webkit-grid-row: span 5 "firstRow"/ span 1;18 -webkit-grid-row: span 5 firstRow / span 1; 19 19 } 20 20 … … 26 26 .spanAutoRow { 27 27 -webkit-grid-column: 1; 28 -webkit-grid-row: span 5 "firstRow"/ auto;28 -webkit-grid-row: span 5 firstRow / auto; 29 29 } 30 30 -
trunk/LayoutTests/fast/css-grid-layout/grid-item-column-row-get-set-expected.txt
r166299 r166712 77 77 PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-row-start') is "5" 78 78 PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-row-end') is "auto" 79 PASS getComputedStyle(gridItemWithString, '').getPropertyValue('-webkit-grid-column') is "1 first / auto" 80 PASS getComputedStyle(gridItemWithString, '').getPropertyValue('-webkit-grid-column-start') is "1 first" 81 PASS getComputedStyle(gridItemWithString, '').getPropertyValue('-webkit-grid-column-end') is "auto" 82 PASS getComputedStyle(gridItemWithString, '').getPropertyValue('-webkit-grid-row') is "1 last / auto" 83 PASS getComputedStyle(gridItemWithString, '').getPropertyValue('-webkit-grid-row-start') is "1 last" 84 PASS getComputedStyle(gridItemWithString, '').getPropertyValue('-webkit-grid-row-end') is "auto" 85 PASS getComputedStyle(gridItemWithSpanString, '').getPropertyValue('-webkit-grid-column') is "1 / span 1 first" 86 PASS getComputedStyle(gridItemWithSpanString, '').getPropertyValue('-webkit-grid-column-start') is "1" 87 PASS getComputedStyle(gridItemWithSpanString, '').getPropertyValue('-webkit-grid-column-end') is "span 1 first" 88 PASS getComputedStyle(gridItemWithSpanString, '').getPropertyValue('-webkit-grid-row') is "-1 / span 1 last" 89 PASS getComputedStyle(gridItemWithSpanString, '').getPropertyValue('-webkit-grid-row-start') is "-1" 90 PASS getComputedStyle(gridItemWithSpanString, '').getPropertyValue('-webkit-grid-row-end') is "span 1 last" 91 PASS getComputedStyle(gridItemWithSpanNumberString, '').getPropertyValue('-webkit-grid-column') is "1 / span 3 first" 92 PASS getComputedStyle(gridItemWithSpanNumberString, '').getPropertyValue('-webkit-grid-column-start') is "1" 93 PASS getComputedStyle(gridItemWithSpanNumberString, '').getPropertyValue('-webkit-grid-column-end') is "span 3 first" 94 PASS getComputedStyle(gridItemWithSpanNumberString, '').getPropertyValue('-webkit-grid-row') is "-1 / span 2 last" 95 PASS getComputedStyle(gridItemWithSpanNumberString, '').getPropertyValue('-webkit-grid-row-start') is "-1" 96 PASS getComputedStyle(gridItemWithSpanNumberString, '').getPropertyValue('-webkit-grid-row-end') is "span 2 last" 79 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column') is "first / first" 80 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "first" 81 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "first" 82 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row') is "last / last" 83 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "last" 84 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "last" 85 PASS getComputedStyle(gridItemWithNonExistingCustomIdent, '').getPropertyValue('-webkit-grid-column') is "nav / nav" 86 PASS getComputedStyle(gridItemWithNonExistingCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "nav" 87 PASS getComputedStyle(gridItemWithNonExistingCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "nav" 88 PASS getComputedStyle(gridItemWithNonExistingCustomIdent, '').getPropertyValue('-webkit-grid-row') is "foo / foo" 89 PASS getComputedStyle(gridItemWithNonExistingCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "foo" 90 PASS getComputedStyle(gridItemWithNonExistingCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "foo" 91 PASS getComputedStyle(gridItemWithSpanCustomIdent, '').getPropertyValue('-webkit-grid-column') is "1 / span 1 first" 92 PASS getComputedStyle(gridItemWithSpanCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "1" 93 PASS getComputedStyle(gridItemWithSpanCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "span 1 first" 94 PASS getComputedStyle(gridItemWithSpanCustomIdent, '').getPropertyValue('-webkit-grid-row') is "-1 / span 1 last" 95 PASS getComputedStyle(gridItemWithSpanCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "-1" 96 PASS getComputedStyle(gridItemWithSpanCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "span 1 last" 97 PASS getComputedStyle(gridItemWithSpanNumberCustomIdent, '').getPropertyValue('-webkit-grid-column') is "1 / span 3 first" 98 PASS getComputedStyle(gridItemWithSpanNumberCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "1" 99 PASS getComputedStyle(gridItemWithSpanNumberCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "span 3 first" 100 PASS getComputedStyle(gridItemWithSpanNumberCustomIdent, '').getPropertyValue('-webkit-grid-row') is "-1 / span 2 last" 101 PASS getComputedStyle(gridItemWithSpanNumberCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "-1" 102 PASS getComputedStyle(gridItemWithSpanNumberCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "span 2 last" 97 103 PASS getComputedStyle(gridItemWithSingleNamedGridArea, '').getPropertyValue('-webkit-grid-column') is "thirdArea / thirdArea" 98 104 PASS getComputedStyle(gridItemWithSingleNamedGridArea, '').getPropertyValue('-webkit-grid-column-start') is "thirdArea" … … 177 183 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "5" 178 184 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "span 1 last" 179 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is " 1 first / 1last"180 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is " 1first"181 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is " 1last"182 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is " 1nav / span 1 last"183 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is " 1nav"185 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "first / last" 186 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "first" 187 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "last" 188 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "nav / span 1 last" 189 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "nav" 184 190 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "span 1 last" 185 191 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "3 first / 2 last" -
trunk/LayoutTests/fast/css-grid-layout/grid-item-column-row-get-set.html
r166299 r166712 11 11 -webkit-grid-template-areas: "firstArea secondArea" 12 12 "thirdArea thirdArea"; 13 14 -webkit-grid-template-columns: (first nav) 10px 10px; 15 -webkit-grid-template-rows: (last) 10px 10px; 13 16 } 14 17 … … 57 60 -webkit-grid-row: 5/auto; 58 61 } 59 .gridItemWithString { 60 -webkit-grid-column: "first"; 61 -webkit-grid-row: "last"; 62 } 63 .gridItemWithSpanString { 64 -webkit-grid-column: 1 /span "first"; 65 -webkit-grid-row: -1 / span "last"; 66 } 67 .gridItemWithSpanNumberString { 68 -webkit-grid-column: 1 /span 3 "first"; 69 -webkit-grid-row: -1 / "last" 2 span ; 62 .gridItemWithCustomIdent { 63 -webkit-grid-column: first; 64 -webkit-grid-row: last; 65 } 66 .gridItemWithNonExistingCustomIdent { 67 -webkit-grid-column: nav; 68 -webkit-grid-row: foo; 69 } 70 .gridItemWithSpanCustomIdent { 71 -webkit-grid-column: 1 /span first; 72 -webkit-grid-row: -1 / span last; 73 } 74 .gridItemWithSpanNumberCustomIdent { 75 -webkit-grid-column: 1 /span 3 first; 76 -webkit-grid-row: -1 / last 2 span ; 70 77 } 71 78 .gridItemWithSingleNamedGridArea { … … 95 102 <div class="gridItemWithNegativePositiveInteger gridItemWithBothLongHand" id="gridItemWithBothShortLongHandElement"></div> 96 103 <div class="gridItemWithNoSpace" id="gridItemWithNoSpaceElement"></div> 97 <div class="gridItemWithString" id="gridItemWithString"></div> 98 <div class="gridItemWithSpanString" id="gridItemWithSpanString"></div> 99 <div class="gridItemWithSpanNumberString" id="gridItemWithSpanNumberString"></div> 104 <div class="gridItemWithCustomIdent" id="gridItemWithCustomIdent"></div> 105 <div class="gridItemWithNonExistingCustomIdent" id="gridItemWithNonExistingCustomIdent"></div> 106 <div class="gridItemWithSpanCustomIdent" id="gridItemWithSpanCustomIdent"></div> 107 <div class="gridItemWithSpanNumberCustomIdent" id="gridItemWithSpanNumberCustomIdent"></div> 100 108 <div class="gridItemWithSingleNamedGridArea" id="gridItemWithSingleNamedGridArea"></div> 101 109 <div class="gridItemWithNamedGridAreaAndSpan" id="gridItemWithNamedGridAreaAndSpan"></div> … … 117 125 testColumnRowCSSParsing("gridItemWithBothShortLongHandElement", "10 / 11", "4 / 5"); 118 126 testColumnRowCSSParsing("gridItemWithNoSpaceElement", "auto / 1", "5 / auto"); 119 testColumnRowCSSParsing("gridItemWithString", "1 first / auto", "1 last / auto"); 120 testColumnRowCSSParsing("gridItemWithSpanString", "1 / span 1 first", "-1 / span 1 last"); 121 testColumnRowCSSParsing("gridItemWithSpanNumberString", "1 / span 3 first", "-1 / span 2 last"); 127 testColumnRowCSSParsing("gridItemWithCustomIdent", "first / first", "last / last"); 128 testColumnRowCSSParsing("gridItemWithNonExistingCustomIdent", "nav / nav", "foo / foo"); 129 testColumnRowCSSParsing("gridItemWithSpanCustomIdent", "1 / span 1 first", "-1 / span 1 last"); 130 testColumnRowCSSParsing("gridItemWithSpanNumberCustomIdent", "1 / span 3 first", "-1 / span 2 last"); 122 131 testColumnRowCSSParsing("gridItemWithSingleNamedGridArea", "thirdArea / thirdArea", "firstArea / firstArea"); 123 132 testColumnRowCSSParsing("gridItemWithNamedGridAreaAndSpan", "thirdArea / span 1", "firstArea / span 2"); … … 145 154 testColumnRowJSParsing("auto / 5", "auto / 8"); 146 155 testColumnRowJSParsing("span / 3", "5 / span", "span 1 / 3", "5 / span 1"); 147 testColumnRowJSParsing(" 'first' span / 3", "5 / 'last'span", "span 1 first / 3", "5 / span 1 last");148 testColumnRowJSParsing(" 'first' / 'last'", "'nav' / 'last' span", "1 first / 1 last", "1nav / span 1 last");149 testColumnRowJSParsing("3 'first' / 2 'last'", "5 'nav' / 'last'7 span", "3 first / 2 last", "5 nav / span 7 last");150 testColumnRowJSParsing("3 'first' span / -3 'last'", "'last' 2 span / -1 'nav'", "span 3 first / -3 last", "span 2 last / -1 nav");156 testColumnRowJSParsing("first span / 3", "5 / last span", "span 1 first / 3", "5 / span 1 last"); 157 testColumnRowJSParsing("first / last", "nav / last span", "first / last", "nav / span 1 last"); 158 testColumnRowJSParsing("3 first / 2 last", "5 nav / last 7 span", "3 first / 2 last", "5 nav / span 7 last"); 159 testColumnRowJSParsing("3 first span / -3 last", "last 2 span / -1 nav", "span 3 first / -3 last", "span 2 last / -1 nav"); 151 160 testColumnRowJSParsing("5 / none", "8 / foobar"); 152 161 testColumnRowJSParsing("nonExistent / none", "nonExistent / foobar"); 153 testColumnRowJSParsing("span 'first' 3 / none", "'last'span / foobar", "span 3 first / none", "span 1 last / foobar");154 testColumnRowJSParsing("5 span / span 2", "span 'first' / 'last'span", "span 5 / span 2", "span 1 first / span 1 last");155 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");162 testColumnRowJSParsing("span first 3 / none", "last span / foobar", "span 3 first / none", "span 1 last / foobar"); 163 testColumnRowJSParsing("5 span / span 2", "span first / last span", "span 5 / span 2", "span 1 first / span 1 last"); 164 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"); 156 165 157 166 debug(""); … … 201 210 // More than 1 <integer> and / or <string>. 202 211 testColumnRowInvalidJSParsing("5 5 / span 2", "4 4 / 3 span"); 203 testColumnRowInvalidJSParsing("5 'first' 'last' / span 2", "'first' 4 'last'/ 3 span");204 testColumnRowInvalidJSParsing("5 / 'first' 'last' 2", "4 / 'first' 3 'last'");205 testColumnRowInvalidJSParsing(" 'first' 'last' / span 2", "'first' 'last'/ 3 span");206 testColumnRowInvalidJSParsing("5 / 'first' 'last'", "4 / 'first' 'last'");212 testColumnRowInvalidJSParsing("5 first last / span 2", "first 4 last / 3 span"); 213 testColumnRowInvalidJSParsing("5 / first last 2", "4 / first 3 last"); 214 testColumnRowInvalidJSParsing("first last / span 2", "first last / 3 span"); 215 testColumnRowInvalidJSParsing("5 / first last", "4 / first last"); 207 216 testColumnRowInvalidJSParsing("5 5 span / 2", "span 4 4 / 3"); 208 217 testColumnRowInvalidJSParsing("span 3 5 / 1", "5 span 4 / 3"); 209 testColumnRowInvalidJSParsing("span 'last' 'first' / 1", "span 'first' 'last'/ 3");210 testColumnRowInvalidJSParsing("2 / span 'last' 'first'", "3 / span 'first' 'last'");211 testColumnRowInvalidJSParsing("span 1 'last' 'first' / 1", "span 'first' 'last'7 / 3");212 testColumnRowInvalidJSParsing("2 / span 'last' 3 'first'", "3 / span 'first' 5 'last'");213 testColumnRowInvalidJSParsing("1 span 2 'first' / 1", "1 span 'last'7 / 3");214 testColumnRowInvalidJSParsing("2 / 3 span 3 'first'", "3 / 5 span 'first'5");218 testColumnRowInvalidJSParsing("span last first / 1", "span first last / 3"); 219 testColumnRowInvalidJSParsing("2 / span last first", "3 / span first last"); 220 testColumnRowInvalidJSParsing("span 1 last first / 1", "span first last 7 / 3"); 221 testColumnRowInvalidJSParsing("2 / span last 3 first", "3 / span first 5 last"); 222 testColumnRowInvalidJSParsing("1 span 2 first / 1", "1 span last 7 / 3"); 223 testColumnRowInvalidJSParsing("2 / 3 span 3 first", "3 / 5 span first 5"); 215 224 216 225 // Negative integer or 0 are invalid for spans. … … 219 228 testColumnRowInvalidJSParsing("0 span / 0", "span 0 / 0"); 220 229 testColumnRowInvalidJSParsing("0 / span 0", "0 / 0 span"); 221 testColumnRowInvalidJSParsing("span -3 'first' / 3 'last'", "'last' -2 span / 1 'nav'");230 testColumnRowInvalidJSParsing("span -3 'first' / 3 last", "last -2 span / 1 nav"); 222 231 223 232 // We don't allow span to be between the <integer> and the <string>. 224 testColumnRowInvalidJSParsing(" 'first' span 1 / 'last'", "2 span 'first' / 'last'");225 testColumnRowInvalidJSParsing("3 'first' / 2 span 'last'", "5 'nav' / 'last'span 7");233 testColumnRowInvalidJSParsing("first span 1 / last", "2 span first / last"); 234 testColumnRowInvalidJSParsing("3 first / 2 span last", "5 nav / last span 7"); 226 235 testColumnRowInvalidJSParsing("3 / 1 span 2", "5 / 3 span 3"); 227 236 </script> -
trunk/LayoutTests/fast/css-grid-layout/grid-item-end-after-get-set-expected.txt
r166299 r166712 47 47 PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-row-start') is "auto" 48 48 PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-row-end') is "auto" 49 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column') is "auto / first" 50 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "auto" 51 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "first" 52 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row') is "auto / last" 53 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "auto" 54 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "last" 55 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-column') is "auto / 2 first" 56 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "auto" 57 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "2 first" 58 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-row') is "auto / 3 last" 59 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "auto" 60 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "3 last" 61 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-column') is "auto / span 1 first" 62 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-column-start') is "auto" 63 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-column-end') is "span 1 first" 64 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-row') is "auto / span 1 last" 65 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-row-start') is "auto" 66 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-row-end') is "span 1 last" 67 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-column') is "auto / span 2 first" 68 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-column-start') is "auto" 69 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-column-end') is "span 2 first" 70 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-row') is "auto / span 3 last" 71 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-row-start') is "auto" 72 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-row-end') is "span 3 last" 49 73 PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('-webkit-grid-column') is "auto / firstArea" 50 74 PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('-webkit-grid-column-start') is "auto" … … 73 97 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto" 74 98 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "-40" 99 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / first" 100 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto" 101 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "first" 102 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / last" 103 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto" 104 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "last" 75 105 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / span 7" 76 106 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto" … … 79 109 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto" 80 110 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "span 2" 111 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / span 1 first" 112 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto" 113 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "span 1 first" 114 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "auto / span 1 last" 115 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "auto" 116 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "span 1 last" 81 117 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto" 82 118 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "auto" -
trunk/LayoutTests/fast/css-grid-layout/grid-item-end-after-get-set.html
r166299 r166712 37 37 -webkit-grid-row-end: auto; 38 38 } 39 .gridItemWithCustomIdent { 40 -webkit-grid-column-end: first; 41 -webkit-grid-row-end: last; 42 } 43 .gridItemWithNumberCustomIdent { 44 -webkit-grid-column-end: first 2; 45 -webkit-grid-row-end: 3 last; 46 } 47 .gridItemWithSpanCustomIdent { 48 -webkit-grid-column-end: first span; 49 -webkit-grid-row-end: span last; 50 } 51 .gridItemWithSpanNumberCustomIdent { 52 -webkit-grid-column-end: 2 first span; 53 -webkit-grid-row-end: last 3 span; 54 } 39 55 .gridItemWithArea { 40 56 -webkit-grid-column-end: firstArea; … … 55 71 <div class="gridItemWithOnlySpan" id="gridItemWithOnlySpan"></div> 56 72 <div class="gridItemWithAuto" id="gridItemWithAutoElement"></div> 73 <div class="gridItemWithCustomIdent" id="gridItemWithCustomIdent"></div> 74 <div class="gridItemWithNumberCustomIdent" id="gridItemWithNumberCustomIdent"></div> 75 <div class="gridItemWithSpanCustomIdent" id="gridItemWithSpanCustomIdentElement"></div> 76 <div class="gridItemWithSpanNumberCustomIdent" id="gridItemWithSpanNumberCustomIdentElement"></div> 57 77 <div class="gridItemWithArea" id="gridItemWithArea"></div> 58 78 </div> … … 68 88 testColumnRowCSSParsing("gridItemWithOnlySpan", "auto / span 1", "auto / span 1"); 69 89 testColumnRowCSSParsing("gridItemWithAutoElement", "auto / auto", "auto / auto"); 90 testColumnRowCSSParsing("gridItemWithCustomIdent", "auto / first", "auto / last"); 91 testColumnRowCSSParsing("gridItemWithNumberCustomIdent", "auto / 2 first", "auto / 3 last"); 92 testColumnRowCSSParsing("gridItemWithSpanCustomIdentElement", "auto / span 1 first", "auto / span 1 last"); 93 testColumnRowCSSParsing("gridItemWithSpanNumberCustomIdentElement", "auto / span 2 first", "auto / span 3 last"); 70 94 testColumnRowCSSParsing("gridItemWithArea", "auto / firstArea", "auto / thirdArea"); 71 95 … … 83 107 testColumnEndRowEndJSParsing("18", "66"); 84 108 testColumnEndRowEndJSParsing("-55", "-40"); 109 testColumnEndRowEndJSParsing("first", "last", "first", "last"); 85 110 testColumnEndRowEndJSParsing("span 7", "span 2"); 111 testColumnEndRowEndJSParsing("span first", "span last", "span 1 first", "span 1 last"); 86 112 testColumnEndRowEndJSParsing("auto", "auto"); 87 113 testColumnEndRowEndJSParsing("thirdArea", "secondArea"); -
trunk/LayoutTests/fast/css-grid-layout/grid-item-named-grid-area-resolution.html
r166157 r166712 53 53 54 54 .gridItemNamedGridLineWithArea { 55 -webkit-grid-row: third / "after";55 -webkit-grid-row: third / after; 56 56 -webkit-grid-column: 1; 57 57 } -
trunk/LayoutTests/fast/css-grid-layout/grid-item-named-grid-line-resolution-expected.txt
r165612 r166712 24 24 PASS 25 25 PASS 26 PASS -
trunk/LayoutTests/fast/css-grid-layout/grid-item-named-grid-line-resolution.html
r166157 r166712 24 24 25 25 .gridItemBToD { 26 -webkit-grid-column: 'b' / 'd';26 -webkit-grid-column: b / d; 27 27 -webkit-grid-row: 1; 28 28 } … … 30 30 .gridItemGToH { 31 31 -webkit-grid-column: 1; 32 -webkit-grid-row: 'g' / 'h';32 -webkit-grid-row: g / h; 33 33 } 34 34 35 35 .gridItemInvalidPositiveGridLine { 36 -webkit-grid-column: "nonexistent"/ span 2;37 -webkit-grid-row: span 2 / "nonexistent";36 -webkit-grid-column: nonexistent / span 2; 37 -webkit-grid-row: span 2 / nonexistent; 38 38 } 39 39 40 40 .gridItemInvalidNegativeGridLine { 41 -webkit-grid-column: 1 / -1 "nonexistent";42 -webkit-grid-row: span 2 / -10 "nonexistent";41 -webkit-grid-column: 1 / -1 nonexistent; 42 -webkit-grid-row: span 2 / -10 nonexistent; 43 43 } 44 44 45 45 .gridItemAToSpanC { 46 -webkit-grid-column: 'a' / span 'c';46 -webkit-grid-column: a / span c; 47 47 -webkit-grid-row: 1; 48 48 } … … 50 50 .gridItemFToSpanH { 51 51 -webkit-grid-column: 1; 52 -webkit-grid-row: 'f' span / 'h';52 -webkit-grid-row: f span / h; 53 53 } 54 54 55 55 .gridItem2BSpan2B { 56 -webkit-grid-column: 2 'b' / span 2 'b';56 -webkit-grid-column: 2 b / span 2 b; 57 57 -webkit-grid-row: 1; 58 58 } … … 60 60 .gridItemSpan2GNegativeG { 61 61 -webkit-grid-column: 1; 62 -webkit-grid-row: span 2 'g' / -1 'g';62 -webkit-grid-row: span 2 g / -1 g; 63 63 } 64 64 </style> … … 94 94 </div> 95 95 96 96 <!-- FIXME: this needs span working for autoplacement as the syntax is no longer invalid --> 97 <!-- 97 98 <div style="position: relative"> 98 99 <div class="grid gridWithoutRepeat"> … … 101 102 </div> 102 103 </div> 104 --> 103 105 104 106 <div style="position: relative"> … … 177 179 <div style="position: relative"> 178 180 <div class="grid gridFromSpecs"> 179 <div class="sizedToGridArea" style="-webkit-grid-column: 'C' / 'C'-1;" data-offset-x="30px" data-expected-width="330px"></div>180 </div> 181 </div> 182 183 <div style="position: relative"> 184 <div class="grid gridFromSpecs"> 185 <div class="sizedToGridArea" style="-webkit-grid-column: 'C' / span 'C';" data-offset-x="30px" data-expected-width="120px"></div>186 </div> 187 </div> 188 189 <div style="position: relative"> 190 <div class="grid gridFromSpecs"> 191 <div class="sizedToGridArea" style="-webkit-grid-column: span 'C' / 'C'-1;" data-offset-x="150px" data-expected-width="210px"></div>192 </div> 193 </div> 194 195 <div style="position: relative"> 196 <div class="grid gridFromSpecs"> 197 <div class="sizedToGridArea" style="-webkit-grid-column: span 'C' / span 'C';" data-offset-x="0px" data-expected-width="10px"></div>198 </div> 199 </div> 200 201 <div style="position: relative"> 202 <div class="grid gridFromSpecs"> 203 <div class="sizedToGridArea" style="-webkit-grid-column: 5 / 'C'-1;" data-offset-x="100px" data-expected-width="260px"></div>204 </div> 205 </div> 206 207 <div style="position: relative"> 208 <div class="grid gridFromSpecs"> 209 <div class="sizedToGridArea" style="-webkit-grid-column: 5 / span 'C';" data-offset-x="100px" data-expected-width="50px"></div>181 <div class="sizedToGridArea" style="-webkit-grid-column: C / C -1;" data-offset-x="30px" data-expected-width="330px"></div> 182 </div> 183 </div> 184 185 <div style="position: relative"> 186 <div class="grid gridFromSpecs"> 187 <div class="sizedToGridArea" style="-webkit-grid-column: C / span C;" data-offset-x="30px" data-expected-width="120px"></div> 188 </div> 189 </div> 190 191 <div style="position: relative"> 192 <div class="grid gridFromSpecs"> 193 <div class="sizedToGridArea" style="-webkit-grid-column: span C / C -1;" data-offset-x="150px" data-expected-width="210px"></div> 194 </div> 195 </div> 196 197 <div style="position: relative"> 198 <div class="grid gridFromSpecs"> 199 <div class="sizedToGridArea" style="-webkit-grid-column: span C / span C;" data-offset-x="0px" data-expected-width="10px"></div> 200 </div> 201 </div> 202 203 <div style="position: relative"> 204 <div class="grid gridFromSpecs"> 205 <div class="sizedToGridArea" style="-webkit-grid-column: 5 / C -1;" data-offset-x="100px" data-expected-width="260px"></div> 206 </div> 207 </div> 208 209 <div style="position: relative"> 210 <div class="grid gridFromSpecs"> 211 <div class="sizedToGridArea" style="-webkit-grid-column: 5 / span C;" data-offset-x="100px" data-expected-width="50px"></div> 210 212 </div> 211 213 </div> … … 219 221 <div style="position: relative"> 220 222 <div class="grid gridFromSpecs"> 221 <div class="sizedToGridArea" style="-webkit-grid-column: 'B'2 / span 1;" data-offset-x="100px" data-expected-width="50px"></div>223 <div class="sizedToGridArea" style="-webkit-grid-column: B 2 / span 1;" data-offset-x="100px" data-expected-width="50px"></div> 222 224 </div> 223 225 </div> -
trunk/LayoutTests/fast/css-grid-layout/grid-item-negative-position-resolution.html
r166157 r166712 34 34 35 35 .lastNamedGridLineStartPositionGrowGridInColumnDirection { 36 -webkit-grid-column: "last"/ auto;36 -webkit-grid-column: last / auto; 37 37 -webkit-grid-row: 1; 38 38 } … … 40 40 .negativeStartPositionGrowGridInRowDirection { 41 41 -webkit-grid-column: 1; 42 -webkit-grid-row: "last"/ auto;42 -webkit-grid-row: last / auto; 43 43 } 44 44 … … 54 54 55 55 .namedEndSpanGrowGridInColumnDirection { 56 -webkit-grid-column: -1 "middle"/ span 3;56 -webkit-grid-column: -1 middle / span 3; 57 57 -webkit-grid-row: 1; 58 58 } … … 60 60 .namedEndSpanGrowGridInRowDirection { 61 61 -webkit-grid-column: 1; 62 -webkit-grid-row: 2 "middle"/ span 3;62 -webkit-grid-row: 2 middle / span 3; 63 63 } 64 64 … … 74 74 75 75 .negativeNamedGridLineEndPositionStartSpanInColumnDirection { 76 -webkit-grid-column: span / "last";76 -webkit-grid-column: span / last; 77 77 -webkit-grid-row: 1; 78 78 } … … 80 80 .negativeNamedGridLineEndPositionStartSpanInRowDirection { 81 81 -webkit-grid-column: 1; 82 -webkit-grid-row: span 5 / "last";82 -webkit-grid-row: span 5 / last; 83 83 } 84 84 … … 94 94 95 95 .namedGridLineEndPositionStartNegativeInColumnDirection { 96 -webkit-grid-column: -3 / 10 "last";96 -webkit-grid-column: -3 / 10 last; 97 97 -webkit-grid-row: 1; 98 98 } 99 99 100 100 .namedGridLineEndPositionStartNegativeInRowDirection { 101 -webkit-grid-column: -5 / -2 "middle";101 -webkit-grid-column: -5 / -2 middle; 102 102 -webkit-grid-row: 1; 103 103 } -
trunk/LayoutTests/fast/css-grid-layout/grid-item-position-changed-dynamic.html
r166157 r166712 58 58 59 59 // 3. Named grid lines, changing the explicit position. 60 testPosition({ 'column': '1 / 2 "col"', 'row': '1 / 2 "row"' }, { 'width': '50', 'height': '70' });61 testPosition({ 'column': '1 / 3 "col"', 'row': '1 / 2 "row"' }, { 'width': '150', 'height': '70' });60 testPosition({ 'column': '1 / 2 col', 'row': '1 / 2 row' }, { 'width': '50', 'height': '70' }); 61 testPosition({ 'column': '1 / 3 col', 'row': '1 / 2 row' }, { 'width': '150', 'height': '70' }); 62 62 63 testPosition({ 'column': '1 / 2 "col"', 'row': '1 / 3 "row"' }, { 'width': '50', 'height': '210' });64 testPosition({ 'column': '1 / 2 "col"', 'row': '1 / 2 "row"' }, { 'width': '50', 'height': '70' });63 testPosition({ 'column': '1 / 2 col', 'row': '1 / 3 row' }, { 'width': '50', 'height': '210' }); 64 testPosition({ 'column': '1 / 2 col', 'row': '1 / 2 row' }, { 'width': '50', 'height': '70' }); 65 65 66 testPosition({ 'column': '1 "col" / 4', 'row': '1 "row"/ 4' }, { 'width': '350', 'height': '490' });67 testPosition({ 'column': '2 "col" / 4', 'row': '1 "row"/ 4' }, { 'width': '300', 'height': '490' });66 testPosition({ 'column': '1 col / 4', 'row': '1 row / 4' }, { 'width': '350', 'height': '490' }); 67 testPosition({ 'column': '2 col / 4', 'row': '1 row / 4' }, { 'width': '300', 'height': '490' }); 68 68 69 testPosition({ 'column': '2 "col" / 4', 'row': '2 "row"/ 4' }, { 'width': '300', 'height': '420' });70 testPosition({ 'column': '2 "col" / 4', 'row': '1 "row"/ 4' }, { 'width': '300', 'height': '490' });69 testPosition({ 'column': '2 col / 4', 'row': '2 row / 4' }, { 'width': '300', 'height': '420' }); 70 testPosition({ 'column': '2 col / 4', 'row': '1 row / 4' }, { 'width': '300', 'height': '490' }); 71 71 72 72 // 4. Named grid lines, changing the name of the grid lines. 73 testPosition({ 'column': '1 / 3 "col"', 'row': '1 / 2 "row"' }, { 'width': '150', 'height': '70' });74 testPosition({ 'column': '1 / 3 "invalid"', 'row': '1 / 2 "row"' }, { 'width': '50', 'height': '70' });73 testPosition({ 'column': '1 / 3 col', 'row': '1 / 2 row' }, { 'width': '150', 'height': '70' }); 74 testPosition({ 'column': '1 / 3 invalid', 'row': '1 / 2 row' }, { 'width': '50', 'height': '70' }); 75 75 76 testPosition({ 'column': '1 / 4 "col"', 'row': '1 / 4 "invalid"' }, { 'width': '350', 'height': '70' });77 testPosition({ 'column': '1 / 4 "col"', 'row': '1 / 4 "row"' }, { 'width': '350', 'height': '490' });76 testPosition({ 'column': '1 / 4 col', 'row': '1 / 4 invalid' }, { 'width': '350', 'height': '70' }); 77 testPosition({ 'column': '1 / 4 col', 'row': '1 / 4 row' }, { 'width': '350', 'height': '490' }); 78 78 79 testPosition({ 'column': '2 "invalid" / 4', 'row': '1 "row"/ 4' }, { 'width': '350', 'height': '490' });80 testPosition({ 'column': '2 "col" / 4', 'row': '1 "row"/ 4' }, { 'width': '300', 'height': '490' });79 testPosition({ 'column': '2 invalid / 4', 'row': '1 row / 4' }, { 'width': '350', 'height': '490' }); 80 testPosition({ 'column': '2 col / 4', 'row': '1 row / 4' }, { 'width': '300', 'height': '490' }); 81 81 82 testPosition({ 'column': '2 "col" / 4', 'row': '2 "row"/ 4' }, { 'width': '300', 'height': '420' });83 testPosition({ 'column': '2 "col" / 4', 'row': '2 "invalid"/ 4' }, { 'width': '300', 'height': '490' });82 testPosition({ 'column': '2 col / 4', 'row': '2 row / 4' }, { 'width': '300', 'height': '420' }); 83 testPosition({ 'column': '2 col / 4', 'row': '2 invalid / 4' }, { 'width': '300', 'height': '490' }); 84 84 85 85 // 5. Span named grid lines, changing the grid line number. 86 testPosition({ 'column': '1 / span 3 "col"', 'row': '1 / span 2 "row"' }, { 'width': '350', 'height': '210' });87 testPosition({ 'column': '1 / span 2 "col"', 'row': '1 / span 2 "row"' }, { 'width': '150', 'height': '210' });86 testPosition({ 'column': '1 / span 3 col', 'row': '1 / span 2 row' }, { 'width': '350', 'height': '210' }); 87 testPosition({ 'column': '1 / span 2 col', 'row': '1 / span 2 row' }, { 'width': '150', 'height': '210' }); 88 88 89 testPosition({ 'column': '2 / span 3 "col"', 'row': '1 / span 2 "row"' }, { 'width': '300', 'height': '210' });90 testPosition({ 'column': '2 / span 3 "col"', 'row': '1 / span 1 "row"' }, { 'width': '300', 'height': '70' });89 testPosition({ 'column': '2 / span 3 col', 'row': '1 / span 2 row' }, { 'width': '300', 'height': '210' }); 90 testPosition({ 'column': '2 / span 3 col', 'row': '1 / span 1 row' }, { 'width': '300', 'height': '70' }); 91 91 92 testPosition({ 'column': 'span 2 "col" / 3', 'row': 'span 2 "row"/ 4' }, { 'width': '150', 'height': '420' });93 testPosition({ 'column': 'span 1 "col" / 3', 'row': 'span 2 "row"/ 4' }, { 'width': '100', 'height': '420' });92 testPosition({ 'column': 'span 2 col / 3', 'row': 'span 2 row / 4' }, { 'width': '150', 'height': '420' }); 93 testPosition({ 'column': 'span 1 col / 3', 'row': 'span 2 row / 4' }, { 'width': '100', 'height': '420' }); 94 94 95 testPosition({ 'column': 'span 2 "col" / 3', 'row': 'span 2 "row"/ 4' }, { 'width': '150', 'height': '420' });96 testPosition({ 'column': 'span 2 "col" / 3', 'row': 'span 3 "row"/ 4' }, { 'width': '150', 'height': '490' });95 testPosition({ 'column': 'span 2 col / 3', 'row': 'span 2 row / 4' }, { 'width': '150', 'height': '420' }); 96 testPosition({ 'column': 'span 2 col / 3', 'row': 'span 3 row / 4' }, { 'width': '150', 'height': '490' }); 97 97 98 98 // Test transition across grid lines types. … … 111 111 112 112 // 2. Span <-> named grid lines. 113 testPosition({ 'column': '1 / "col"3', 'row': '1 / span 4' }, { 'width': '150', 'height': '490' });113 testPosition({ 'column': '1 / col 3', 'row': '1 / span 4' }, { 'width': '150', 'height': '490' }); 114 114 testPosition({ 'column': '1 / span 3', 'row': '1 / span 4' }, { 'width': '350', 'height': '490' }); 115 115 116 testPosition({ 'column': '1 / "col"3', 'row': '1 / span 3' }, { 'width': '150', 'height': '490' });117 testPosition({ 'column': '1 / "col" 3', 'row': '1 / "row"3' }, { 'width': '150', 'height': '210' });116 testPosition({ 'column': '1 / col 3', 'row': '1 / span 3' }, { 'width': '150', 'height': '490' }); 117 testPosition({ 'column': '1 / col 3', 'row': '1 / row 3' }, { 'width': '150', 'height': '210' }); 118 118 119 119 testPosition({ 'column': 'span 1 / 3', 'row': 'span 2 / 4' }, { 'width': '100', 'height': '420' }); 120 testPosition({ 'column': '1 "col"/ 3', 'row': 'span 2 / 4' }, { 'width': '150', 'height': '420' });120 testPosition({ 'column': '1 col / 3', 'row': 'span 2 / 4' }, { 'width': '150', 'height': '420' }); 121 121 122 testPosition({ 'column': 'span 1 / 3', 'row': ' "col"1 / 4' }, { 'width': '100', 'height': '490' });122 testPosition({ 'column': 'span 1 / 3', 'row': 'col 1 / 4' }, { 'width': '100', 'height': '490' }); 123 123 testPosition({ 'column': 'span 1 / 3', 'row': 'span 1 / 4' }, { 'width': '100', 'height': '280' }); 124 124 125 125 // 3. Named grid lines to span named grid line. 126 testPosition({ 'column': '1 / "col"3', 'row': '1 / span 4' }, { 'width': '150', 'height': '490' });127 testPosition({ 'column': '1 / span "col"3', 'row': '1 / span 4' }, { 'width': '350', 'height': '490' });126 testPosition({ 'column': '1 / col 3', 'row': '1 / span 4' }, { 'width': '150', 'height': '490' }); 127 testPosition({ 'column': '1 / span col 3', 'row': '1 / span 4' }, { 'width': '350', 'height': '490' }); 128 128 129 testPosition({ 'column': '1 / "col" 3', 'row': '1 / span "row"3' }, { 'width': '150', 'height': '490' });130 testPosition({ 'column': '1 / "col" 3', 'row': '1 / "row"3' }, { 'width': '150', 'height': '210' });129 testPosition({ 'column': '1 / col 3', 'row': '1 / span row 3' }, { 'width': '150', 'height': '490' }); 130 testPosition({ 'column': '1 / col 3', 'row': '1 / row 3' }, { 'width': '150', 'height': '210' }); 131 131 132 testPosition({ 'column': 'span "col"1 / 3', 'row': 'span 2 / 4' }, { 'width': '100', 'height': '420' });133 testPosition({ 'column': '1 "col"/ 3', 'row': 'span 2 / 4' }, { 'width': '150', 'height': '420' });132 testPosition({ 'column': 'span col 1 / 3', 'row': 'span 2 / 4' }, { 'width': '100', 'height': '420' }); 133 testPosition({ 'column': '1 col / 3', 'row': 'span 2 / 4' }, { 'width': '150', 'height': '420' }); 134 134 135 testPosition({ 'column': 'span "col" 1 / 3', 'row': '"col"1 / 4' }, { 'width': '100', 'height': '490' });136 testPosition({ 'column': 'span "col" 1 / 3', 'row': 'span "col"1 / 4' }, { 'width': '100', 'height': '280' });135 testPosition({ 'column': 'span col 1 / 3', 'row': 'col 1 / 4' }, { 'width': '100', 'height': '490' }); 136 testPosition({ 'column': 'span col 1 / 3', 'row': 'span col 1 / 4' }, { 'width': '100', 'height': '280' }); 137 137 138 138 // 4. Explicit <-> named grid lines. … … 141 141 gridElement.classList.add("differentNamedGridLines"); 142 142 143 testPosition({ 'column': '1 / "col4"3', 'row': '1 / 4' }, { 'width': '350', 'height': '490' });143 testPosition({ 'column': '1 / col4 3', 'row': '1 / 4' }, { 'width': '350', 'height': '490' }); 144 144 testPosition({ 'column': '1 / 3', 'row': '1 / 4' }, { 'width': '150', 'height': '490' }); 145 145 146 testPosition({ 'column': '1 / "col4"3', 'row': '1 / 4' }, { 'width': '350', 'height': '490' });147 testPosition({ 'column': '1 / "col4" 3', 'row': '1 / "row3"4' }, { 'width': '350', 'height': '210' });146 testPosition({ 'column': '1 / col4 3', 'row': '1 / 4' }, { 'width': '350', 'height': '490' }); 147 testPosition({ 'column': '1 / col4 3', 'row': '1 / row3 4' }, { 'width': '350', 'height': '210' }); 148 148 149 testPosition({ 'column': ' "col2" 1 / 4', 'row': '1 "row2"/ 4' }, { 'width': '300', 'height': '420' });150 testPosition({ 'column': '1 / 4', 'row': '1 "row2"/ 4' }, { 'width': '350', 'height': '420' });149 testPosition({ 'column': 'col2 1 / 4', 'row': '1 row2 / 4' }, { 'width': '300', 'height': '420' }); 150 testPosition({ 'column': '1 / 4', 'row': '1 row2 / 4' }, { 'width': '350', 'height': '420' }); 151 151 152 testPosition({ 'column': ' "col2"1 / 4', 'row': '1 / 4' }, { 'width': '300', 'height': '490' });153 testPosition({ 'column': ' "col2" 1 / 4', 'row': '1 "row2"/ 4' }, { 'width': '300', 'height': '420' });152 testPosition({ 'column': 'col2 1 / 4', 'row': '1 / 4' }, { 'width': '300', 'height': '490' }); 153 testPosition({ 'column': 'col2 1 / 4', 'row': '1 row2 / 4' }, { 'width': '300', 'height': '420' }); 154 154 155 155 // 5. Span <-> span named grid lines. 156 testPosition({ 'column': '1 / span "col4"2', 'row': '3 / span 1' }, { 'width': '350', 'height': '280' });156 testPosition({ 'column': '1 / span col4 2', 'row': '3 / span 1' }, { 'width': '350', 'height': '280' }); 157 157 testPosition({ 'column': '1 / span 2', 'row': '3 / span 1' }, { 'width': '150', 'height': '280' }); 158 158 159 testPosition({ 'column': '1 / span "col4"3', 'row': '1 / span 4' }, { 'width': '350', 'height': '490' });160 testPosition({ 'column': '1 / span "col4" 3', 'row': '1 / span "row3"4' }, { 'width': '350', 'height': '210' });159 testPosition({ 'column': '1 / span col4 3', 'row': '1 / span 4' }, { 'width': '350', 'height': '490' }); 160 testPosition({ 'column': '1 / span col4 3', 'row': '1 / span row3 4' }, { 'width': '350', 'height': '210' }); 161 161 162 162 testPosition({ 'column': 'span 2 / 4', 'row': 'span 1 / 4' }, { 'width': '300', 'height': '280' }); 163 testPosition({ 'column': 'span "col1"2 / 4', 'row': 'span 1 / 4' }, { 'width': '350', 'height': '280' });163 testPosition({ 'column': 'span col1 2 / 4', 'row': 'span 1 / 4' }, { 'width': '350', 'height': '280' }); 164 164 165 165 testPosition({ 'column': 'span 2 / 4', 'row': 'span 1 / 4' }, { 'width': '300', 'height': '280' }); 166 testPosition({ 'column': 'span 2 / 4', 'row': 'span "row2"1 / 4' }, { 'width': '300', 'height': '420' });166 testPosition({ 'column': 'span 2 / 4', 'row': 'span row2 1 / 4' }, { 'width': '300', 'height': '420' }); 167 167 168 168 // 6. Explicit to span named grid line. 169 testPosition({ 'column': '1 / 2', 'row': '2 / span "row3"1' }, { 'width': '50', 'height': '140' });170 testPosition({ 'column': '1 / span "col3" 2', 'row': '2 / span "row3"1' }, { 'width': '150', 'height': '140' });169 testPosition({ 'column': '1 / 2', 'row': '2 / span row3 1' }, { 'width': '50', 'height': '140' }); 170 testPosition({ 'column': '1 / span col3 2', 'row': '2 / span row3 1' }, { 'width': '150', 'height': '140' }); 171 171 172 testPosition({ 'column': '1 / 2', 'row': '2 / span "row3"4' }, { 'width': '50', 'height': '140' });172 testPosition({ 'column': '1 / 2', 'row': '2 / span row3 4' }, { 'width': '50', 'height': '140' }); 173 173 testPosition({ 'column': '1 / 2', 'row': '2 / 4' }, { 'width': '50', 'height': '420' }); 174 174 175 testPosition({ 'column': 'span "col2" 1 / 4', 'row': 'span "row1"3 / 4' }, { 'width': '300', 'height': '490' });176 testPosition({ 'column': '1 / 4', 'row': 'span "row1"3 / 4' }, { 'width': '350', 'height': '490' });175 testPosition({ 'column': 'span col2 1 / 4', 'row': 'span row1 3 / 4' }, { 'width': '300', 'height': '490' }); 176 testPosition({ 'column': '1 / 4', 'row': 'span row1 3 / 4' }, { 'width': '350', 'height': '490' }); 177 177 178 testPosition({ 'column': 'span "col2" 1 / 4', 'row': 'span "row1"3 / 4' }, { 'width': '300', 'height': '490' });179 testPosition({ 'column': 'span "col2"1 / 4', 'row': '3 / 4' }, { 'width': '300', 'height': '280' });178 testPosition({ 'column': 'span col2 1 / 4', 'row': 'span row1 3 / 4' }, { 'width': '300', 'height': '490' }); 179 testPosition({ 'column': 'span col2 1 / 4', 'row': '3 / 4' }, { 'width': '300', 'height': '280' }); 180 180 } 181 181 window.addEventListener("load", updateGridItemPosition, false); -
trunk/LayoutTests/fast/css-grid-layout/grid-item-start-before-get-set-expected.txt
r166299 r166712 45 45 PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-row-start') is "auto" 46 46 PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-row-end') is "auto" 47 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column') is "first / auto" 48 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "first" 49 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "auto" 50 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row') is "last / auto" 51 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "last" 52 PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "auto" 53 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-column') is "2 first / auto" 54 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-column-start') is "2 first" 55 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-column-end') is "auto" 56 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-row') is "3 last / auto" 57 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-row-start') is "3 last" 58 PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('-webkit-grid-row-end') is "auto" 59 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-column') is "span 1 first / auto" 60 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-column-start') is "span 1 first" 61 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-column-end') is "auto" 62 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-row') is "span 1 last / auto" 63 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-row-start') is "span 1 last" 64 PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('-webkit-grid-row-end') is "auto" 65 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-column') is "span 2 first / auto" 66 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-column-start') is "span 2 first" 67 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-column-end') is "auto" 68 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-row') is "span 3 last / auto" 69 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-row-start') is "span 3 last" 70 PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('-webkit-grid-row-end') is "auto" 47 71 PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('-webkit-grid-column') is "firstArea / auto" 48 72 PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('-webkit-grid-column-start') is "firstArea" … … 71 95 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "-40" 72 96 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto" 97 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "nav / auto" 98 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "nav" 99 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto" 100 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "last / auto" 101 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "last" 102 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto" 73 103 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "span 3 / auto" 74 104 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "span 3" … … 76 106 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "span 20 / auto" 77 107 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "span 20" 108 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto" 109 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "span 1 nav / auto" 110 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-start') is "span 1 nav" 111 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column-end') is "auto" 112 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row') is "span 1 last / auto" 113 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-start') is "span 1 last" 78 114 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-row-end') is "auto" 79 115 PASS getComputedStyle(gridItem, '').getPropertyValue('-webkit-grid-column') is "auto / auto" -
trunk/LayoutTests/fast/css-grid-layout/grid-item-start-before-get-set.html
r166299 r166712 37 37 -webkit-grid-row-start: auto; 38 38 } 39 .gridItemWithCustomIdent { 40 -webkit-grid-column-start: first; 41 -webkit-grid-row-start: last; 42 } 43 .gridItemWithNumberCustomIdent { 44 -webkit-grid-column-start: first 2; 45 -webkit-grid-row-start: 3 last; 46 } 47 .gridItemWithSpanCustomIdent { 48 -webkit-grid-column-start: first span; 49 -webkit-grid-row-start: span last; 50 } 51 .gridItemWithSpanNumberCustomIdent { 52 -webkit-grid-column-start: 2 first span; 53 -webkit-grid-row-start: last 3 span; 54 } 39 55 .gridItemWithArea { 40 56 -webkit-grid-column-start: firstArea; … … 55 71 <div class="gridItemWithOnlySpan" id="gridItemWithOnlySpan"></div> 56 72 <div class="gridItemWithAuto" id="gridItemWithAutoElement"></div> 73 <div class="gridItemWithCustomIdent" id="gridItemWithCustomIdent"></div> 74 <div class="gridItemWithNumberCustomIdent" id="gridItemWithNumberCustomIdent"></div> 75 <div class="gridItemWithSpanCustomIdent" id="gridItemWithSpanCustomIdentElement"></div> 76 <div class="gridItemWithSpanNumberCustomIdent" id="gridItemWithSpanNumberCustomIdentElement"></div> 57 77 <div class="gridItemWithArea" id="gridItemWithArea"></div> 58 78 </div> … … 73 93 testColumnRowCSSParsing("gridItemWithOnlySpan", "span 1 / auto", "span 1 / auto"); 74 94 testColumnRowCSSParsing("gridItemWithAutoElement", "auto / auto", "auto / auto"); 95 testColumnRowCSSParsing("gridItemWithCustomIdent", "first / auto", "last / auto"); 96 testColumnRowCSSParsing("gridItemWithNumberCustomIdent", "2 first / auto", "3 last / auto"); 97 testColumnRowCSSParsing("gridItemWithSpanCustomIdentElement", "span 1 first / auto", "span 1 last / auto"); 98 testColumnRowCSSParsing("gridItemWithSpanNumberCustomIdentElement", "span 2 first / auto", "span 3 last / auto"); 75 99 testColumnRowCSSParsing("gridItemWithArea", "firstArea / auto", "thirdArea / auto"); 76 100 … … 88 112 testColumnStartRowStartJSParsing("18", "66"); 89 113 testColumnStartRowStartJSParsing("-55", "-40"); 114 testColumnStartRowStartJSParsing("nav", "last", "nav", "last"); 90 115 testColumnStartRowStartJSParsing("span 3", "span 20"); 116 testColumnStartRowStartJSParsing("span nav", "span last", "span 1 nav", "span 1 last"); 91 117 testColumnStartRowStartJSParsing("auto", "auto"); 92 118 testColumnStartRowStartJSParsing("thirdArea", "secondArea"); -
trunk/Source/WebCore/ChangeLog
r166706 r166712 1 2014-03-27 Sergio Villar Senin <svillar@igalia.com> 2 3 [CSS Grid Layout] <string> not allowed in grid-{area | row | column} syntax 4 https://bugs.webkit.org/show_bug.cgi?id=129713 5 6 Reviewed by Darin Adler. 7 8 Grid positioning properties no longer accept <string> values for 9 named grid lines as they did in previous versions of the specs. They 10 were first replaced by <ident> and since the beginning of 2014 they 11 should only accept <custom-ident>. 12 13 Updated the parser and the style resolver to this new syntax. Also 14 updated the tests accordingly. 15 16 Test: fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html 17 18 * css/CSSParser.cpp: 19 (WebCore::isValidCustomIdent): New function that checks that the 20 <custom-ident> is valid. 21 (WebCore::CSSParser::parseIntegerOrCustomIdentFromGridPosition): 22 (WebCore::CSSParser::parseGridPosition): 23 (WebCore::CSSParser::parseIntegerOrStringFromGridPosition): 24 Replaced by WebCore::CSSParser::parseIntegerOrCustomIdentFromGridPosition. 25 * css/CSSParser.h: 26 * css/StyleResolver.cpp: 27 (WebCore::createGridPosition): 28 1 29 2014-04-03 Antti Koivisto <antti@apple.com> 2 30 -
trunk/Source/WebCore/css/CSSParser.cpp
r166618 r166712 4675 4675 4676 4676 #if ENABLE(CSS_GRID_LAYOUT) 4677 // The function parses [ <integer> || <string> ] in <grid-line> (which can be stand alone or with 'span'). 4678 bool CSSParser::parseIntegerOrStringFromGridPosition(RefPtr<CSSPrimitiveValue>& numericValue, RefPtr<CSSPrimitiveValue>& gridLineName) 4677 static inline bool isValidCustomIdent(const CSSParserValue& value) 4678 { 4679 return value.unit == CSSPrimitiveValue::CSS_IDENT && value.id != CSSValueSpan && value.id != CSSValueAuto; 4680 } 4681 4682 // The function parses [ <integer> || <custom-ident> ] in <grid-line> (which can be stand alone or with 'span'). 4683 bool CSSParser::parseIntegerOrCustomIdentFromGridPosition(RefPtr<CSSPrimitiveValue>& numericValue, RefPtr<CSSPrimitiveValue>& gridLineName) 4679 4684 { 4680 4685 CSSParserValue* value = m_valueList->current(); … … 4682 4687 numericValue = createPrimitiveNumericValue(value); 4683 4688 value = m_valueList->next(); 4684 if (value && value->unit == CSSPrimitiveValue::CSS_STRING) {4689 if (value && isValidCustomIdent(*value)) { 4685 4690 gridLineName = createPrimitiveStringValue(m_valueList->current()); 4686 4691 m_valueList->next(); … … 4689 4694 } 4690 4695 4691 if ( value->unit == CSSPrimitiveValue::CSS_STRING) {4696 if (isValidCustomIdent(*value)) { 4692 4697 gridLineName = createPrimitiveStringValue(m_valueList->current()); 4693 4698 value = m_valueList->next(); … … 4710 4715 } 4711 4716 4712 if (value->id != CSSValueSpan && value->unit == CSSPrimitiveValue::CSS_IDENT) {4713 m_valueList->next();4714 return cssValuePool().createValue(value->string, CSSPrimitiveValue::CSS_STRING);4715 }4716 4717 4717 RefPtr<CSSPrimitiveValue> numericValue; 4718 4718 RefPtr<CSSPrimitiveValue> gridLineName; 4719 4719 bool hasSeenSpanKeyword = false; 4720 4720 4721 if (parseIntegerOrStringFromGridPosition(numericValue, gridLineName)) { 4721 if (value->id == CSSValueSpan) { 4722 hasSeenSpanKeyword = true; 4723 if (auto* nextValue = m_valueList->next()) { 4724 if (!isForwardSlashOperator(nextValue) && !parseIntegerOrCustomIdentFromGridPosition(numericValue, gridLineName)) 4725 return nullptr; 4726 } 4727 } else if (parseIntegerOrCustomIdentFromGridPosition(numericValue, gridLineName)) { 4722 4728 value = m_valueList->current(); 4723 4729 if (value && value->id == CSSValueSpan) { … … 4725 4731 m_valueList->next(); 4726 4732 } 4727 } else if (value->id == CSSValueSpan) {4728 hasSeenSpanKeyword = true;4729 if (m_valueList->next())4730 parseIntegerOrStringFromGridPosition(numericValue, gridLineName);4731 4733 } 4732 4734 … … 4734 4736 // the whole value list (including the opposite position). 4735 4737 if (m_valueList->current() && !isForwardSlashOperator(m_valueList->current())) 4736 return 0;4738 return nullptr; 4737 4739 4738 4740 // If we didn't parse anything, this is not a valid grid position. 4739 4741 if (!hasSeenSpanKeyword && !gridLineName && !numericValue) 4740 return 0;4742 return nullptr; 4741 4743 4742 4744 // Negative numbers are not allowed for span (but are for <integer>). 4743 4745 if (hasSeenSpanKeyword && numericValue && numericValue->getIntValue() < 0) 4744 return 0; 4746 return nullptr; 4747 4748 // For the <custom-ident> case. 4749 if (gridLineName && !numericValue && !hasSeenSpanKeyword) 4750 return cssValuePool().createValue(gridLineName->getStringValue(), CSSPrimitiveValue::CSS_STRING); 4745 4751 4746 4752 RefPtr<CSSValueList> values = CSSValueList::createSpaceSeparated(); -
trunk/Source/WebCore/css/CSSParser.h
r166157 r166712 522 522 523 523 #if ENABLE(CSS_GRID_LAYOUT) 524 bool parseIntegerOr StringFromGridPosition(RefPtr<CSSPrimitiveValue>& numericValue, RefPtr<CSSPrimitiveValue>& gridLineName);524 bool parseIntegerOrCustomIdentFromGridPosition(RefPtr<CSSPrimitiveValue>& numericValue, RefPtr<CSSPrimitiveValue>& gridLineName); 525 525 #endif 526 526 -
trunk/Source/WebCore/css/StyleResolver.cpp
r166618 r166712 1942 1942 { 1943 1943 // We accept the specification's grammar: 1944 // 'auto' | [ <integer> || <string> ] | [ span && [ <integer> || string ] ] | <ident>1944 // auto | <custom-ident> | [ <integer> && <custom-ident>? ] | [ span && [ <integer> || <custom-ident> ] ] 1945 1945 if (value->isPrimitiveValue()) { 1946 1946 CSSPrimitiveValue* primitiveValue = toCSSPrimitiveValue(value); … … 1959 1959 1960 1960 bool isSpanPosition = false; 1961 // The specification makes the <integer> optional, in which case it default to '1'. 1962 int gridLineNumber = 1; 1961 int gridLineNumber = 0; 1963 1962 String gridLineName; 1964 1963 … … 1984 1983 ASSERT(!it.hasMore()); 1985 1984 if (isSpanPosition) 1986 position.setSpanPosition(gridLineNumber , gridLineName);1985 position.setSpanPosition(gridLineNumber ? gridLineNumber : 1, gridLineName); 1987 1986 else 1988 1987 position.setExplicitPosition(gridLineNumber, gridLineName);
Note: See TracChangeset
for help on using the changeset viewer.