| <!DOCTYPE html> |
| <style> |
| #base { |
| animation-name: anim; |
| animation-duration: 5s; |
| animation-timing-function: linear; |
| animation-delay: 2s; |
| animation-iteration-count: infinite; |
| animation-direction: alternate; |
| animation-play-state: running; |
| } |
| |
| #inherit { |
| animation-name: inherit; |
| animation-duration: inherit; |
| animation-timing-function: inherit; |
| animation-delay: inherit; |
| animation-iteration-count: inherit; |
| animation-direction: inherit; |
| animation-play-state: inherit; |
| } |
| |
| #initial { |
| animation-name: initial; |
| animation-duration: initial; |
| animation-timing-function: initial; |
| animation-delay: initial; |
| animation-iteration-count: initial; |
| animation-direction: initial; |
| animation-play-state: initial; |
| } |
| |
| </style> |
| <div style="width:500px;height:500px" id="base"> |
| <div id="inherit"></div> |
| <div id="initial"></div> |
| </div> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| test(() => { |
| var testContainer = document.createElement("div"); |
| document.body.appendChild(testContainer); |
| |
| e = document.getElementById('inherit'); |
| computedStyle = window.getComputedStyle(e, null); |
| |
| assert_equals(computedStyle.animationName, "anim"); |
| assert_equals(computedStyle.webkitAnimationName, "anim"); |
| |
| assert_equals(computedStyle.animationDuration, "5s"); |
| assert_equals(computedStyle.webkitAnimationDuration, "5s"); |
| |
| assert_equals(computedStyle.animationTimingFunction, "linear"); |
| assert_equals(computedStyle.webkitAnimationTimingFunction, "linear"); |
| |
| assert_equals(computedStyle.animationDelay, "2s"); |
| assert_equals(computedStyle.webkitAnimationDelay, "2s"); |
| |
| assert_equals(computedStyle.animationIterationCount, "infinite"); |
| assert_equals(computedStyle.webkitAnimationIterationCount, "infinite"); |
| |
| assert_equals(computedStyle.animationDirection, "alternate"); |
| assert_equals(computedStyle.webkitAnimationDirection, "alternate"); |
| |
| assert_equals(computedStyle.animationPlayState, "running"); |
| assert_equals(computedStyle.webkitAnimationPlayState, "running"); |
| |
| e = document.getElementById('initial'); |
| computedStyle = window.getComputedStyle(e, null); |
| |
| assert_equals(computedStyle.animationName, "none"); |
| assert_equals(computedStyle.webkitAnimationName, "none"); |
| |
| assert_equals(computedStyle.animationDuration, "0s"); |
| assert_equals(computedStyle.webkitAnimationDuration, "0s"); |
| |
| assert_equals(computedStyle.animationTimingFunction, "ease"); |
| assert_equals(computedStyle.webkitAnimationTimingFunction, "ease"); |
| |
| assert_equals(computedStyle.animationDelay, "0s"); |
| assert_equals(computedStyle.webkitAnimationDelay, "0s"); |
| |
| assert_equals(computedStyle.animationIterationCount, "1"); |
| assert_equals(computedStyle.webkitAnimationIterationCount, "1"); |
| |
| assert_equals(computedStyle.animationDirection, "normal"); |
| assert_equals(computedStyle.webkitAnimationDirection, "normal"); |
| |
| assert_equals(computedStyle.animationPlayState, "running"); |
| assert_equals(computedStyle.webkitAnimationPlayState, "running"); |
| |
| document.body.removeChild(testContainer); |
| }, "Test that inherit and initial works on unprefixed animations"); |
| </script> |
