Test the parsing of the -webkit-animation-trigger property.

On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".


Valid property tests


Auto : auto
PASS cssRule.type is 1
PASS declaration.length is 1
PASS declaration.getPropertyValue('-webkit-animation-trigger') is 'auto'
PASS triggerRule.cssText is 'auto'

Container Scroll : container-scroll(200px)
PASS cssRule.type is 1
PASS declaration.length is 1
PASS declaration.getPropertyValue('-webkit-animation-trigger') is 'container-scroll(200px)'
PASS triggerRule.cssText is 'container-scroll(200px)'

Container Scroll : container-scroll(2em)
PASS cssRule.type is 1
PASS declaration.length is 1
PASS declaration.getPropertyValue('-webkit-animation-trigger') is 'container-scroll(2em)'
PASS triggerRule.cssText is 'container-scroll(2em)'

Container Scroll : container-scroll(30vw)
PASS cssRule.type is 1
PASS declaration.length is 1
PASS declaration.getPropertyValue('-webkit-animation-trigger') is 'container-scroll(30vw)'
PASS triggerRule.cssText is 'container-scroll(30vw)'

Container Scroll with end value : container-scroll(200px, 300px)
PASS cssRule.type is 1
PASS declaration.length is 1
PASS declaration.getPropertyValue('-webkit-animation-trigger') is 'container-scroll(200px, 300px)'
PASS triggerRule.cssText is 'container-scroll(200px, 300px)'

Two scroll values : container-scroll(1px), container-scroll(2px)
PASS cssRule.type is 1
PASS declaration.length is 1
PASS declaration.getPropertyValue('-webkit-animation-trigger') is 'container-scroll(1px), container-scroll(2px)'
PASS triggerRule.length is 2
PASS subRule.cssText is 'container-scroll(1px)'
PASS subRule.cssText is 'container-scroll(2px)'

Many scroll values : container-scroll(1px), container-scroll(2px), container-scroll(3px), container-scroll(4px), container-scroll(5px), container-scroll(3000px)
PASS cssRule.type is 1
PASS declaration.length is 1
PASS declaration.getPropertyValue('-webkit-animation-trigger') is 'container-scroll(1px), container-scroll(2px), container-scroll(3px), container-scroll(4px), container-scroll(5px), container-scroll(3000px)'
PASS triggerRule.length is 6
PASS subRule.cssText is 'container-scroll(1px)'
PASS subRule.cssText is 'container-scroll(2px)'
PASS subRule.cssText is 'container-scroll(3px)'
PASS subRule.cssText is 'container-scroll(4px)'
PASS subRule.cssText is 'container-scroll(5px)'
PASS subRule.cssText is 'container-scroll(3000px)'

Invalid property tests


No value : 
PASS cssRule.type is 1
PASS declaration.length is 0
PASS declaration.getPropertyValue('-webkit-animation-trigger') is ""

Bad value : banana
PASS cssRule.type is 1
PASS declaration.length is 0
PASS declaration.getPropertyValue('-webkit-animation-trigger') is ""

Bad list : container-scroll(1px), orange
PASS cssRule.type is 1
PASS declaration.length is 0
PASS declaration.getPropertyValue('-webkit-animation-trigger') is ""

Missing comma : container-scroll(1px) container-scroll(2px)
PASS cssRule.type is 1
PASS declaration.length is 0
PASS declaration.getPropertyValue('-webkit-animation-trigger') is ""

Too many values : container-scroll(1px, 2px, 3px)
PASS cssRule.type is 1
PASS declaration.length is 0
PASS declaration.getPropertyValue('-webkit-animation-trigger') is ""
PASS successfullyParsed is true

TEST COMPLETE