| OLD | NEW |
| 1 This test checks that grid-template-areas is properly parsed. | 1 This test checks that grid-template-areas is properly parsed. |
| 2 | 2 |
| 3 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
". | 3 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
". |
| 4 | 4 |
| 5 | 5 |
| 6 Test getting grid-template-areas set through CSS. | 6 Test getting grid-template-areas set through CSS. |
| 7 PASS window.getComputedStyle(gridWithDefaultTemplate).getPropertyValue('grid-tem
plate-areas') is "none" | 7 PASS window.getComputedStyle(gridWithDefaultTemplate).getPropertyValue('grid-tem
plate-areas') is "none" |
| 8 PASS window.getComputedStyle(gridWithSingleStringTemplate).getPropertyValue('gri
d-template-areas') is "\"area\"" | 8 PASS window.getComputedStyle(gridWithSingleStringTemplate).getPropertyValue('gri
d-template-areas') is "\"area\"" |
| 9 PASS window.getComputedStyle(gridWithTwoColumnsTemplate).getPropertyValue('grid-
template-areas') is "\"first second\"" | 9 PASS window.getComputedStyle(gridWithTwoColumnsTemplate).getPropertyValue('grid-
template-areas') is "\"first second\"" |
| 10 PASS window.getComputedStyle(gridWithTwoRowsTemplate).getPropertyValue('grid-tem
plate-areas') is "\"first\" \"second\"" | 10 PASS window.getComputedStyle(gridWithTwoRowsTemplate).getPropertyValue('grid-tem
plate-areas') is "\"first\" \"second\"" |
| 11 PASS window.getComputedStyle(gridWithSpanningColumnsTemplate).getPropertyValue('
grid-template-areas') is "\"span span\"" | 11 PASS window.getComputedStyle(gridWithSpanningColumnsTemplate).getPropertyValue('
grid-template-areas') is "\"span span\"" |
| 12 PASS window.getComputedStyle(gridWithSpanningRowsDotTemplate).getPropertyValue('
grid-template-areas') is "\"span\" \".\"" | 12 PASS window.getComputedStyle(gridWithSpanningRowsDotTemplate).getPropertyValue('
grid-template-areas') is "\"span\" \".\"" |
| 13 PASS window.getComputedStyle(gridWithSpanningRowsDotsTemplate).getPropertyValue(
'grid-template-areas') is "\"span\" \".\"" | 13 PASS window.getComputedStyle(gridWithSpanningRowsDotsTemplate).getPropertyValue(
'grid-template-areas') is "\"span\" \".\"" |
| 14 PASS window.getComputedStyle(gridWithDotColumn).getPropertyValue('grid-template-
areas') is "\"header .\" \"footer .\"" | 14 PASS window.getComputedStyle(gridWithDotColumn).getPropertyValue('grid-template-
areas') is "\"header .\" \"footer .\"" |
| 15 PASS window.getComputedStyle(gridWithDotsColumn).getPropertyValue('grid-template
-areas') is "\"header .\" \"footer .\"" | 15 PASS window.getComputedStyle(gridWithDotsColumn).getPropertyValue('grid-template
-areas') is "\"header .\" \"footer .\"" |
| 16 PASS window.getComputedStyle(gridWithDotCells).getPropertyValue('grid-template-a
reas') is "\"first .\" \". second\"" | 16 PASS window.getComputedStyle(gridWithDotCells).getPropertyValue('grid-template-a
reas') is "\"first .\" \". second\"" |
| 17 PASS window.getComputedStyle(gridWithDotsCells).getPropertyValue('grid-template-
areas') is "\"first .\" \". second\"" | 17 PASS window.getComputedStyle(gridWithDotsCells).getPropertyValue('grid-template-
areas') is "\"first .\" \". second\"" |
| 18 PASS window.getComputedStyle(gridWithComplexDotAreas).getPropertyValue('grid-tem
plate-areas') is "\". header header .\" \". . . .\" \"nav main main aside\" \"na
v main main aside\" \". . . aside\" \". footer footer aside\"" | 18 PASS window.getComputedStyle(gridWithComplexDotAreas).getPropertyValue('grid-tem
plate-areas') is "\". header header .\" \". . . .\" \"nav main main aside\" \"na
v main main aside\" \". . . aside\" \". footer footer aside\"" |
| 19 PASS window.getComputedStyle(gridWithComplexDotsAreas).getPropertyValue('grid-te
mplate-areas') is "\". header header .\" \". . . .\" \"nav main main aside\" \"n
av main main aside\" \". . . aside\" \". footer footer aside\"" | 19 PASS window.getComputedStyle(gridWithComplexDotsAreas).getPropertyValue('grid-te
mplate-areas') is "\". header header .\" \". . . .\" \"nav main main aside\" \"n
av main main aside\" \". . . aside\" \". footer footer aside\"" |
| 20 PASS window.getComputedStyle(gridWithMixedDotAndDotsAreas).getPropertyValue('gri
d-template-areas') is "\". title .\" \". main main\" \"nav . aside\" \". footer
.\"" | 20 PASS window.getComputedStyle(gridWithMixedDotAndDotsAreas).getPropertyValue('gri
d-template-areas') is "\". title .\" \". main main\" \"nav . aside\" \". footer
.\"" |
| 21 PASS window.getComputedStyle(gridWithDotsNoSpace).getPropertyValue('grid-templat
e-areas') is "\". title . nav . . main test\"" |
| 21 PASS window.getComputedStyle(gridWithHorizontalRectangle).getPropertyValue('grid
-template-areas') is "\"a a a\" \"a a a\"" | 22 PASS window.getComputedStyle(gridWithHorizontalRectangle).getPropertyValue('grid
-template-areas') is "\"a a a\" \"a a a\"" |
| 22 PASS window.getComputedStyle(gridWithVerticalRectangle).getPropertyValue('grid-t
emplate-areas') is "\"a a\" \"a a\" \"a a\"" | 23 PASS window.getComputedStyle(gridWithVerticalRectangle).getPropertyValue('grid-t
emplate-areas') is "\"a a\" \"a a\" \"a a\"" |
| 23 Test grid-template-areas: initial | 24 Test grid-template-areas: initial |
| 24 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"\"foobar\"" | 25 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"\"foobar\"" |
| 25 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" | 26 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" |
| 26 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"\"foobar\"" | 27 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"\"foobar\"" |
| 27 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" | 28 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" |
| 28 Test grid-template-areas: inherit | 29 Test grid-template-areas: inherit |
| 29 PASS window.getComputedStyle(parentElement).getPropertyValue('grid-template-area
s') is "\"foo bar\"" | 30 PASS window.getComputedStyle(parentElement).getPropertyValue('grid-template-area
s') is "\"foo bar\"" |
| 30 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"\"foo bar\"" | 31 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"\"foo bar\"" |
| 31 Test invalid grid-template-areas values. | 32 Test invalid grid-template-areas values. |
| 32 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" | 33 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" |
| 33 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" | 34 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" |
| 34 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" | 35 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" |
| 35 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" | 36 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" |
| 36 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" | 37 PASS window.getComputedStyle(element).getPropertyValue('grid-template-areas') is
"none" |
| 37 | 38 |
| 38 FIXME: We currently don't validate that the named grid areas are <indent>. | 39 FIXME: We currently don't validate that the named grid areas are <indent>. |
| 39 FAIL window.getComputedStyle(element).getPropertyValue('grid-template-areas') sh
ould be none. Was "nav-up". | 40 FAIL window.getComputedStyle(element).getPropertyValue('grid-template-areas') sh
ould be none. Was "nav-up". |
| 40 PASS successfullyParsed is true | 41 PASS successfullyParsed is true |
| 41 | 42 |
| 42 TEST COMPLETE | 43 TEST COMPLETE |
| 43 | 44 |
| OLD | NEW |