| Test that setting and getting grid-column-end and grid-row-end works as expected |
| |
| On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE". |
| |
| |
| Test getting grid-column-end and grid-row-end set through CSS |
| PASS getComputedStyle(gridElement, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridElement, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridElement, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridElement, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridElement, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridElement, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('grid-column') is "auto / 10" |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('grid-column-end') is "10" |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('grid-row') is "auto / 15" |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('grid-row-end') is "15" |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('grid-column') is "auto / -10" |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('grid-column-end') is "-10" |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('grid-row') is "auto / -15" |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('grid-row-end') is "-15" |
| PASS getComputedStyle(gridItemWithBeforeSpan, '').getPropertyValue('grid-column') is "auto / span 2" |
| PASS getComputedStyle(gridItemWithBeforeSpan, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithBeforeSpan, '').getPropertyValue('grid-column-end') is "span 2" |
| PASS getComputedStyle(gridItemWithBeforeSpan, '').getPropertyValue('grid-row') is "auto / span 9" |
| PASS getComputedStyle(gridItemWithBeforeSpan, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithBeforeSpan, '').getPropertyValue('grid-row-end') is "span 9" |
| PASS getComputedStyle(gridItemWithAfterSpan, '').getPropertyValue('grid-column') is "auto / span 2" |
| PASS getComputedStyle(gridItemWithAfterSpan, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithAfterSpan, '').getPropertyValue('grid-column-end') is "span 2" |
| PASS getComputedStyle(gridItemWithAfterSpan, '').getPropertyValue('grid-row') is "auto / span 9" |
| PASS getComputedStyle(gridItemWithAfterSpan, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithAfterSpan, '').getPropertyValue('grid-row-end') is "span 9" |
| PASS getComputedStyle(gridItemWithOnlySpan, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItemWithOnlySpan, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithOnlySpan, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItemWithOnlySpan, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItemWithOnlySpan, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithOnlySpan, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('grid-column') is "auto / first" |
| PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('grid-column-end') is "first" |
| PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('grid-row') is "auto / last" |
| PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithCustomIdent, '').getPropertyValue('grid-row-end') is "last" |
| PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('grid-column') is "auto / 2 first" |
| PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('grid-column-end') is "2 first" |
| PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('grid-row') is "auto / 3 last" |
| PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithNumberCustomIdent, '').getPropertyValue('grid-row-end') is "3 last" |
| PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('grid-column') is "auto / span 1 first" |
| PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('grid-column-end') is "span 1 first" |
| PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('grid-row') is "auto / span 1 last" |
| PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanCustomIdentElement, '').getPropertyValue('grid-row-end') is "span 1 last" |
| PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('grid-column') is "auto / span 2 first" |
| PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('grid-column-end') is "span 2 first" |
| PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('grid-row') is "auto / span 3 last" |
| PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanNumberCustomIdentElement, '').getPropertyValue('grid-row-end') is "span 3 last" |
| PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('grid-column') is "auto / firstArea" |
| PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('grid-column-end') is "firstArea" |
| PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('grid-row') is "auto / thirdArea" |
| PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithArea, '').getPropertyValue('grid-row-end') is "thirdArea" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword2, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword2, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword2, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword2, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword2, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithCSSWideKeyword2, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAuto, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItemWithSpanAuto, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAuto, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAuto, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItemWithSpanAuto, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAuto, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItemWithOneAuto, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItemWithOneAuto, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithOneAuto, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItemWithOneAuto, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItemWithOneAuto, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithOneAuto, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAutoOne, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItemWithSpanAutoOne, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAutoOne, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAutoOne, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItemWithSpanAutoOne, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItemWithSpanAutoOne, '').getPropertyValue('grid-row-end') is "auto" |
| |
| Test the initial value |
| PASS getComputedStyle(element, '').getPropertyValue('grid-column-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-row-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-row') is 'auto / auto' |
| |
| Test getting and setting grid-column-end and grid-row-end through JS |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / 18" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "18" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / 66" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "66" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / -55" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "-55" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / -40" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "-40" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / first" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "first" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / last" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "last" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / span 7" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "span 7" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / span 1 first" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "span 1 first" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / span 1 last" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "span 1 last" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / thirdArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "thirdArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / secondArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "secondArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / nonExistentArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "nonExistentArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / secondArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "secondArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / secondArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "secondArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / nonExistentArea" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "nonExistentArea" |
| |
| Test setting grid-column-start and grid-row-start to 'inherit' through JS |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / 18" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "18" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / 7" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "7" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "auto / span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "auto / 7" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "7" |
| |
| Test setting grid-column-start and grid-row-start to 'initial' through JS |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "1 / span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "1" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "span 2" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "span 3 / 5" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "span 3" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "5" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "1 / auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "1" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "span 3 / 5" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "span 3" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "5" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column') is "1 / auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-start') is "1" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-column-end') is "auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row') is "span 3 / auto" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-start') is "span 3" |
| PASS getComputedStyle(gridItem, '').getPropertyValue('grid-row-end') is "auto" |
| |
| Test setting grid-column-end and grid-row-end back to 'auto' through JS |
| PASS getComputedStyle(element, '').getPropertyValue('grid-column-end') is '18' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-column') is 'auto / 18' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-row-end') is '66' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-row') is 'auto / 66' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-column-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-row-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('grid-row') is 'auto / auto' |
| PASS successfullyParsed is true |
| |
| TEST COMPLETE |
| |
