OLD | NEW |
(Empty) | |
| 1 <script src="../resources/testharness.js"></script> |
| 2 <script src="../resources/testharnessreport.js"></script> |
| 3 <style> |
| 4 body { |
| 5 --x: green; |
| 6 --y: lime; |
| 7 } |
| 8 @keyframes test { |
| 9 from { background: var(--x); } |
| 10 to { background: var(--y); } |
| 11 } |
| 12 #cssAnimations { |
| 13 animation: test 1s -0.5s linear paused; |
| 14 } |
| 15 </style> |
| 16 <div id="cssAnimations"></div> |
| 17 <div id="webAnimations"></div> |
| 18 <script> |
| 19 test(() => { |
| 20 assert_equals(getComputedStyle(cssAnimations).backgroundColor, 'rgb(0, 192, 0)
'); |
| 21 }, 'CSS Animations should interpolate shorthand properties with variable referen
ces in them.'); |
| 22 |
| 23 test(() => { |
| 24 var animation = webAnimations.animate({background: ['var(--x)', 'var(--y)']},
1); |
| 25 animation.currentTime = 0.5; |
| 26 assert_equals(getComputedStyle(webAnimations).backgroundColor, 'rgb(0, 192, 0)
'); |
| 27 }, 'Web Animations should interpolate shorthand properties with variable referen
ces in them.'); |
| 28 </script> |
OLD | NEW |