| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <style> |
| #target { |
| animation-name: first, second; |
| animation-duration: 1e8s; |
| animation-timing-function: steps(2, start); |
| left: 100px; |
| } |
| |
| @keyframes first { |
| from { left: 300px; } |
| to { left: 300px; } |
| } |
| |
| @keyframes second { |
| to { left: 200px; } |
| } |
| </style> |
| <div id="target"></div> |
| <script> |
| test(_ => { |
| assert_equals(getComputedStyle(target).left, '250px'); |
| }, 'Multiple CSS Animations on the same property should composite together'); |
| </script> |