[Web Animations] Update WPT tests and move them to imported/w3c/web-platform-tests
[WebKit-https.git] / LayoutTests / imported / w3c / web-platform-tests / web-animations / timing-model / timelines / timelines.html
1 <!doctype html>
2 <meta charset=utf-8>
3 <title>Timelines</title>
4 <link rel="help" href="https://drafts.csswg.org/web-animations/#timelines">
5 <script src="/resources/testharness.js"></script>
6 <script src="/resources/testharnessreport.js"></script>
7 <script src="../../testcommon.js"></script>
8 <div id="log"></div>
9 <script>
10 'use strict';
11
12 promise_test(t => {
13   const valueAtStart = document.timeline.currentTime;
14   const timeAtStart = window.performance.now();
15   while (window.performance.now() - timeAtStart < 50) {
16     // Wait 50ms
17   }
18   assert_equals(document.timeline.currentTime, valueAtStart,
19     'Timeline time does not change within an animation frame');
20   return waitForAnimationFrames(1).then(() => {
21     assert_greater_than(document.timeline.currentTime, valueAtStart,
22       'Timeline time increases between animation frames');
23   });
24 }, 'Timeline time increases once per animation frame');
25
26 async_test(t => {
27   const iframe = document.createElement('iframe');
28   iframe.width = 10;
29   iframe.height = 10;
30
31   iframe.addEventListener('load', t.step_func(() => {
32     const iframeTimeline = iframe.contentDocument.timeline;
33     const valueAtStart   = iframeTimeline.currentTime;
34     const timeAtStart    = window.performance.now();
35     while (iframe.contentWindow.performance.now() - timeAtStart < 50) {
36       // Wait 50ms
37     }
38     assert_equals(iframeTimeline.currentTime, valueAtStart,
39       'Timeline time within an iframe does not change within an '
40       + ' animation frame');
41
42     iframe.contentWindow.requestAnimationFrame(t.step_func_done(() => {
43       assert_greater_than(iframeTimeline.currentTime, valueAtStart,
44         'Timeline time within an iframe increases between animation frames');
45       iframe.remove();
46     }));
47   }));
48
49   document.body.appendChild(iframe);
50 }, 'Timeline time increases once per animation frame in an iframe');
51
52 async_test(t => {
53   const startTime = document.timeline.currentTime;
54   let firstRafTime;
55
56   requestAnimationFrame(() => {
57     t.step(() => {
58       assert_greater_than_equal(document.timeline.currentTime, startTime,
59                                 'Timeline time should have progressed');
60       firstRafTime = document.timeline.currentTime;
61     });
62   });
63
64   requestAnimationFrame(() => {
65     t.step(() => {
66       assert_equals(document.timeline.currentTime, firstRafTime,
67                     'Timeline time should be the same');
68     });
69     t.done();
70   });
71 }, 'Timeline time should be the same for all RAF callbacks in an animation'
72    + ' frame');
73
74 async_test(t => {
75   const div = createDiv(t);
76   const animation = div.animate(null, 100 * MS_PER_SEC);
77
78   animation.ready.then(t.step_func(() => {
79     const readyTimelineTime = document.timeline.currentTime;
80     requestAnimationFrame(t.step_func_done(() => {
81       assert_equals(readyTimelineTime, document.timeline.currentTime,
82                     'There should be a microtask checkpoint');
83     }));
84   }));
85 }, 'Performs a microtask checkpoint after updating timelins');
86
87 </script>