| <!DOCTYPE html> |
| <link rel="help" href="https://drafts.csswg.org/css-animations-2/#animation-shorthand"> |
| <link rel="help" href="https://drafts.csswg.org/css-animations-2/#animation-timeline"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/css/support/computed-testcommon.js"></script> |
| <script src="/css/support/parsing-testcommon.js"></script> |
| <script src="/css/support/shorthand-testcommon.js"></script> |
| <div id="target"></div> |
| <script> |
| test_valid_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim'); |
| test_valid_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim timeline'); |
| test_valid_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim none'); |
| test_valid_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim "initial"'); |
| test_valid_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim auto', |
| '1s linear 1s 2 reverse forwards paused anim'); |
| |
| test_invalid_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim initial'); |
| test_invalid_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim 2000'); |
| |
| test_computed_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim'); |
| test_computed_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim timeline'); |
| test_computed_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim none'); |
| test_computed_value('animation', |
| '1s linear 1s 2 reverse forwards paused anim auto', |
| '1s linear 1s 2 reverse forwards paused anim'); |
| |
| test_shorthand_value('animation', |
| `1s linear 1s 2 reverse forwards paused anim1 timeline, |
| 1s linear 1s 2 reverse forwards paused anim2 none, |
| 1s linear 1s 2 reverse forwards paused anim3 auto`, |
| { |
| 'animation-duration': '1s, 1s, 1s', |
| 'animation-timing-function': 'linear, linear, linear', |
| 'animation-delay': '1s, 1s, 1s', |
| 'animation-iteration-count': '2, 2, 2', |
| 'animation-direction': 'reverse, reverse, reverse', |
| 'animation-fill-mode': 'forwards, forwards, forwards', |
| 'animation-play-state': 'paused, paused, paused', |
| 'animation-name': 'anim1, anim2, anim3', |
| 'animation-timeline': 'timeline, none, auto' |
| }); |
| </script> |
