OLD | NEW |
1 Test that setting and getting grid-columns and grid-rows works as expected | 1 Test that setting and getting grid-columns and grid-rows works as expected |
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 |display| set through CSS | 6 Test getting |display| set through CSS |
7 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-columns')
is '7px 11px' | 7 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-columns')
is '7px 11px' |
8 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-rows') is
'17px 2px' | 8 PASS getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-rows') is
'17px 2px' |
9 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-columns
') is '53% 99%' | 9 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-columns
') is '53% 99%' |
10 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-rows')
is '27% 52%' | 10 PASS getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-rows')
is '27% 52%' |
11 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('grid-columns')
is 'auto auto' | 11 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('grid-columns')
is 'auto auto' |
12 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('grid-rows') is
'auto auto' | 12 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('grid-rows') is
'auto auto' |
13 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('grid-columns') is
'100px 120px' | 13 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('grid-columns') is
'100px 120px' |
14 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('grid-rows') is '1
50px 170px' | 14 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('grid-rows') is '1
50px 170px' |
15 PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('grid-columns') i
s '15px auto 100px' | 15 PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('grid-columns') i
s '15px auto 100px' |
16 PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('grid-rows') is '
120px 18px auto' | 16 PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('grid-rows') is '
120px 18px auto' |
17 PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('g
rid-columns') is '50% 120px' | 17 PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('g
rid-columns') is '50% 120px' |
18 PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('g
rid-rows') is '35% 168px' | 18 PASS getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyValue('g
rid-rows') is '35% 168px' |
19 PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('g
rid-columns') is 'none' | 19 PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('g
rid-columns') is 'none' |
20 PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('g
rid-rows') is 'none' | 20 PASS getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyValue('g
rid-rows') is 'none' |
21 PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-columns'
) is '-webkit-min-content -webkit-max-content' | 21 PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-columns'
) is 'min-content max-content' |
22 PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-rows') i
s '-webkit-max-content -webkit-min-content' | 22 PASS getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-rows') i
s 'max-content min-content' |
23 PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-columns
') is 'minmax(45px, 30%) 15px' | 23 PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-columns
') is 'minmax(45px, 30%) 15px' |
24 PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-rows')
is '120px minmax(35%, 10px)' | 24 PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-rows')
is '120px minmax(35%, 10px)' |
25 PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('grid
-columns') is 'minmax(-webkit-min-content, 30%) 15px' | 25 PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('grid
-columns') is 'minmax(min-content, 30%) 15px' |
26 PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('grid
-rows') is '120px minmax(35%, -webkit-max-content)' | 26 PASS getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue('grid
-rows') is '120px minmax(35%, max-content)' |
27 PASS getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-colum
ns') is '1fr 2fr' | 27 PASS getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-colum
ns') is '1fr 2fr' |
28 PASS getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-rows'
) is '3fr 4fr' | 28 PASS getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-rows'
) is '3fr 4fr' |
29 PASS getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-columns
') is 'minmax(-webkit-min-content, 45px) 2fr' | 29 PASS getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-columns
') is 'minmax(min-content, 45px) 2fr' |
30 PASS getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-rows')
is '3fr minmax(14px, -webkit-max-content)' | 30 PASS getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-rows')
is '3fr minmax(14px, max-content)' |
31 | 31 |
32 Test the initial value | 32 Test the initial value |
33 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is 'none' | 33 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is 'none' |
34 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is 'none' | 34 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is 'none' |
35 | 35 |
36 Test getting and setting display through JS | 36 Test getting and setting display through JS |
37 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is '18px 22p
x' | 37 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is '18px 22p
x' |
38 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is '66px 70px' | 38 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is '66px 70px' |
39 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is '55% 80%' | 39 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is '55% 80%' |
40 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is '40% 63%' | 40 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is '40% 63%' |
(...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
77 | 77 |
78 Test setting grid-columns and grid-rows to 'initial' through JS | 78 Test setting grid-columns and grid-rows to 'initial' through JS |
79 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is '150% mid
dle 55px' | 79 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is '150% mid
dle 55px' |
80 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is '1fr line 2f
r line' | 80 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is '1fr line 2f
r line' |
81 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is 'none' | 81 PASS getComputedStyle(element, '').getPropertyValue('grid-columns') is 'none' |
82 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is 'none' | 82 PASS getComputedStyle(element, '').getPropertyValue('grid-rows') is 'none' |
83 PASS successfullyParsed is true | 83 PASS successfullyParsed is true |
84 | 84 |
85 TEST COMPLETE | 85 TEST COMPLETE |
86 | 86 |
OLD | NEW |