| <!DOCTYPE HTML> |
| <script src="../resources/js-test-pre.js"></script> |
| <p id="description"></p> |
| <div id="console"></div> |
| <script> |
| description("Test the computed style of the -webkit-animation-trigger property."); |
| |
| // These have to be global for the test helpers to see them. |
| var stylesheet, triggerStyle, subRule; |
| var styleElement = document.createElement("style"); |
| document.head.appendChild(styleElement); |
| stylesheet = styleElement.sheet; |
| |
| function testComputedTriggerRule(description, rule, expectedLength, expectedTexts) |
| { |
| debug(""); |
| debug(description + " : " + rule); |
| |
| stylesheet.insertRule("body { -webkit-animation-trigger: " + rule + "; }", 0); |
| |
| triggerStyle = window.getComputedStyle(document.body).getPropertyCSSValue("-webkit-animation-trigger"); |
| shouldBe("triggerStyle.length", "" + expectedLength); |
| for (var i = 0; i < expectedLength; i++) { |
| subRule = triggerStyle[i]; |
| shouldBe("subRule.cssText", "'" + expectedTexts[i] + "'"); |
| } |
| stylesheet.deleteRule(0); |
| } |
| |
| testComputedTriggerRule("Auto", |
| "auto", 1, |
| ["auto"]); |
| |
| testComputedTriggerRule("One container-scroll value", |
| "container-scroll(10px)", 1, |
| ["container-scroll(10px)"]); |
| |
| testComputedTriggerRule("One container-scroll value", |
| "container-scroll(2em)", 1, |
| ["container-scroll(32px)"]); |
| |
| testComputedTriggerRule("One container-scroll value with end value", |
| "container-scroll(10px, 20px)", 1, |
| ["container-scroll(10px, 20px)"]); |
| |
| testComputedTriggerRule("Two container-scroll values", |
| "container-scroll(10px), container-scroll(20px)", 2, |
| ["container-scroll(10px)", "container-scroll(20px)"]); |
| |
| testComputedTriggerRule("Many container-scroll values", |
| "container-scroll(10px), container-scroll(20px), container-scroll(30px), container-scroll(40px), container-scroll(1px)", 5, |
| ["container-scroll(10px)", "container-scroll(20px)", "container-scroll(30px)", "container-scroll(40px)", "container-scroll(1px)"]); |
| |
| testComputedTriggerRule("No value", |
| "", 1, |
| ["auto"]); |
| |
| testComputedTriggerRule("Bad value", |
| "banana", 1, |
| ["auto"]); |
| |
| testComputedTriggerRule("Multiple bad values", |
| "banana, eggs, bacon", 1, |
| ["auto"]); |
| |
| testComputedTriggerRule("Some good, some bad values", |
| "container-scroll(10), eggs, bacon", 1, |
| ["auto"]); |
| |
| successfullyParsed = true; |
| </script> |
| <script src="../resources/js-test-post.js"></script> |
