| <!DOCTYPE html> |
| <style> |
| .animated { |
| animation: test 10ms; |
| animation-delay: -10ms; |
| } |
| @keyframes test { |
| 0% {} |
| } |
| </style> |
| <div id="block"></div> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| async_test(t => { |
| window.addEventListener("load", t.step_func(() => { |
| // This test covers a specific regression where an on-demand timing update |
| // that was triggered after an animation received a start time could cause |
| // CSS Animation and Transition events to not be fired on the subseuquent |
| // animation-frame timing update. |
| block.classList.add('animated'); |
| block.addEventListener('animationstart', t.step_func_done(() => {})); |
| requestAnimationFrame(t.step_func(() => { |
| t.step_timeout(() => { |
| getComputedStyle(block).left; |
| }); |
| })); |
| })); |
| }, "Should fire animation events after on-demand timing update"); |
| </script> |
