| <!DOCTYPE html> |
| <style> |
| #test1 { |
| animation-fill-mode: forwards; |
| animation-duration: 1s; |
| animation-name: green; |
| } |
| #test2 { |
| animation-fill-mode: forwards; |
| animation-duration: 1s; |
| } |
| #test3 { |
| animation-fill-mode: forwards; |
| animation-duration: 1s; |
| animation-name: notredorgreen; |
| } |
| @keyframes green { |
| from { |
| background-color: white; |
| } |
| to { |
| background-color: green; |
| } |
| } |
| @keyframes red { |
| from { |
| background-color: white; |
| } |
| to { |
| background-color: red; |
| } |
| } |
| </style> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <div id="test1"></div> |
| <div id="test2"></div> |
| <div id="test3"></div> |
| <script> |
| var test = async_test("Tests that an animation does not run when it specifies an incorrect name"); |
| test1.addEventListener('animationstart', test.step_func(() => { |
| test2.style.animationName = 'green'; |
| })); |
| test2.addEventListener('animationstart', test.step_func_done(() => {})); |
| test3.addEventListener('animationstart', test.unreached_func("Should not run when it specifies an incorrect name")); |
| </script> |
