| 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 |