[Web Animations] Expose Web Animations CSS integration as an experimental feature
[WebKit-https.git] / LayoutTests / imported / w3c / web-platform-tests / web-animations / timing-model / animations / playing-an-animation.html
1 <!DOCTYPE html><!-- webkit-test-runner [ enableWebAnimationsCSSIntegration=true ] -->
2 <meta charset=utf-8>
3 <title>Playing an animation</title>
4 <link rel="help"
5       href="https://drafts.csswg.org/web-animations/#playing-an-animation-section">
6 <script src="/resources/testharness.js"></script>
7 <script src="/resources/testharnessreport.js"></script>
8 <script src="../../testcommon.js"></script>
9 <body>
10 <div id="log"></div>
11 <script>
12 'use strict';
13
14 test(t => {
15   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
16   animation.currentTime = 1 * MS_PER_SEC;
17   assert_time_equals_literal(animation.currentTime, 1 * MS_PER_SEC);
18   animation.play();
19   assert_time_equals_literal(animation.currentTime, 1 * MS_PER_SEC);
20 }, 'Playing a running animation leaves the current time unchanged');
21
22 test(t => {
23   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
24   animation.finish();
25   assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
26   animation.play();
27   assert_time_equals_literal(animation.currentTime, 0);
28 }, 'Playing a finished animation seeks back to the start');
29
30 test(t => {
31   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
32   animation.playbackRate = -1;
33   animation.currentTime = 0;
34   assert_time_equals_literal(animation.currentTime, 0);
35   animation.play();
36   assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
37 }, 'Playing a finished and reversed animation seeks to end');
38
39 test(t => {
40   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
41   animation.cancel();
42   const promise = animation.ready;
43   animation.play();
44   assert_not_equals(animation.ready, promise);
45 }, 'The ready promise should be replaced if the animation is not already'
46    + ' pending');
47
48 promise_test(t => {
49   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
50   const promise = animation.ready;
51   return promise.then(p => {
52     assert_equals(p, animation);
53     assert_equals(animation.ready, promise);
54   });
55 }, 'A pending ready promise should be resolved and not replaced when the'
56    + ' animation enters the running state');
57
58 </script>
59 </body>