| <!doctype html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <style> |
| @keyframes anim { |
| 0% { left: 100px; } |
| 100% { left: 100px; } |
| } |
| |
| #target { |
| animation: anim 1s paused; |
| left: 0px; |
| } |
| |
| </style> |
| <div id="target"></div> |
| <script> |
| test(function() { |
| var sheet = document.styleSheets[0]; |
| var rules = sheet.rules; |
| var keyframes = rules[0]; |
| |
| assert_equals(parseInt(getComputedStyle(target).left), 100, 'left offset'); |
| keyframes.name = 'foobar'; |
| assert_equals(parseInt(getComputedStyle(target).left), 0, 'left offset'); |
| keyframes.name = 'anim'; |
| assert_equals(parseInt(getComputedStyle(target).left), 100, 'left offset'); |
| |
| }, "Check that changes to @keyframes name updates the animating element accordingly"); |
| </script> |
