| Test that setting and getting grid-column and grid-row works as expected |
| |
| On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE". |
| |
| |
| Test getting -webkit-grid-column and -webkit-grid-row set through CSS |
| PASS getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(gridElement, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('-webkit-grid-column') is '10 / auto' |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('-webkit-grid-start') is '10' |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('-webkit-grid-row') is '15 / auto' |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('-webkit-grid-before') is '15' |
| PASS getComputedStyle(gridItemWithPositiveInteger, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('-webkit-grid-column') is '-10 / auto' |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('-webkit-grid-start') is '-10' |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('-webkit-grid-row') is '-15 / auto' |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('-webkit-grid-before') is '-15' |
| PASS getComputedStyle(gridItemWithNegativeInteger, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(gridItemWithAutoElement, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue('-webkit-grid-column') is '10 / 15' |
| PASS getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue('-webkit-grid-start') is '10' |
| PASS getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue('-webkit-grid-end') is '15' |
| PASS getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue('-webkit-grid-row') is '5 / 5' |
| PASS getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue('-webkit-grid-before') is '5' |
| PASS getComputedStyle(gridItemWith2IntegerElement, '').getPropertyValue('-webkit-grid-after') is '5' |
| PASS getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').getPropertyValue('-webkit-grid-column') is '10 / -10' |
| PASS getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').getPropertyValue('-webkit-grid-start') is '10' |
| PASS getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').getPropertyValue('-webkit-grid-end') is '-10' |
| PASS getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').getPropertyValue('-webkit-grid-row') is '-8 / 5' |
| PASS getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').getPropertyValue('-webkit-grid-before') is '-8' |
| PASS getComputedStyle(gridItemWithNegativePositiveIntegerElement, '').getPropertyValue('-webkit-grid-after') is '5' |
| PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(gridItemWith2AutoElement, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(gridItemWithBothShortLongHandElement, '').getPropertyValue('-webkit-grid-column') is '10 / 11' |
| PASS getComputedStyle(gridItemWithBothShortLongHandElement, '').getPropertyValue('-webkit-grid-start') is '10' |
| PASS getComputedStyle(gridItemWithBothShortLongHandElement, '').getPropertyValue('-webkit-grid-end') is '11' |
| PASS getComputedStyle(gridItemWithBothShortLongHandElement, '').getPropertyValue('-webkit-grid-row') is '4 / 5' |
| PASS getComputedStyle(gridItemWithBothShortLongHandElement, '').getPropertyValue('-webkit-grid-before') is '4' |
| PASS getComputedStyle(gridItemWithBothShortLongHandElement, '').getPropertyValue('-webkit-grid-after') is '5' |
| PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-column') is 'auto / 1' |
| PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-end') is '1' |
| PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-row') is '5 / auto' |
| PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-before') is '5' |
| PASS getComputedStyle(gridItemWithNoSpaceElement, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| |
| Test the initial value |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| |
| Test getting and setting grid-column and grid-row through JS |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is '18 / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is '18' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is '66 / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is '66' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is '-55 / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is '-55' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is '-40 / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is '-40' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is '10 / 55' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is '10' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is '55' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is '1 / 10' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is '1' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is '10' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is '-5 / 5' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is '-5' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is '5' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is '4 / -4' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is '4' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is '-4' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is '4 / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is '4' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is '5 / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is '5' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / 5' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is '5' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / 8' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is '8' |
| |
| Test setting grid-column and grid-row back to 'auto' through JS |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is '18 / 19' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is '18' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is '19' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is '66 / 68' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is '66' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is '68' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| |
| Test getting and setting invalid grid-column and grid-row through JS |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-column') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-start') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-end') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-row') is 'auto / auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-before') is 'auto' |
| PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-after') is 'auto' |
| PASS successfullyParsed is true |
| |
| TEST COMPLETE |
| |
