[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 / interfaces / AnimationEffectTiming / iterations.html
1 <!DOCTYPE html>
2 <meta charset=utf-8>
3 <title>AnimationEffectTiming.iterations</title>
4 <link rel="help" href="https://drafts.csswg.org/web-animations/#dom-animationeffecttiming-iterations">
5 <script src="/resources/testharness.js"></script>
6 <script src="/resources/testharnessreport.js"></script>
7 <script src="../../testcommon.js"></script>
8 <body>
9 <div id="log"></div>
10 <script>
11 'use strict';
12
13 test(t => {
14   const anim = createDiv(t).animate(null);
15   assert_equals(anim.effect.timing.iterations, 1);
16 }, 'Has the default value 1');
17
18 test(t => {
19   const div = createDiv(t);
20   const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
21   anim.effect.timing.iterations = 2;
22   assert_equals(anim.effect.timing.iterations, 2, 'set duration 2');
23   assert_equals(anim.effect.getComputedTiming().iterations, 2,
24                        'getComputedTiming() after set iterations 2');
25 }, 'Can be set to a double value');
26
27 test(t => {
28   const div = createDiv(t);
29   const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
30   anim.effect.timing.iterations = Infinity;
31   assert_equals(anim.effect.timing.iterations, Infinity, 'set duration Infinity');
32   assert_equals(anim.effect.getComputedTiming().iterations, Infinity,
33                        'getComputedTiming() after set iterations Infinity');
34 }, 'Can be set to infinity');
35
36 test(t => {
37   const div = createDiv(t);
38   const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
39   assert_throws({ name: 'TypeError' }, () => {
40     anim.effect.timing.iterations = -1;
41   });
42 }, 'Throws when setting a negative number');
43
44 test(t => {
45   const div = createDiv(t);
46   const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
47   assert_throws({ name: 'TypeError' }, () => {
48     anim.effect.timing.iterations = -Infinity;
49   });
50 }, 'Throws when setting negative infinity');
51
52 test(t => {
53   const div = createDiv(t);
54   const anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
55   assert_throws({ name: 'TypeError' }, () => {
56     anim.effect.timing.iterations = NaN;
57   });
58 }, 'Throws when setting a NaN value');
59
60 test(t => {
61   const div = createDiv(t);
62   const anim = div.animate(null, { duration: 100000, fill: 'both' });
63
64   anim.finish();
65
66   assert_equals(anim.effect.getComputedTiming().progress, 1,
67                 'progress when animation is finished');
68   assert_equals(anim.effect.getComputedTiming().currentIteration, 0,
69                 'current iteration when animation is finished');
70
71   anim.effect.timing.iterations = 2;
72
73   assert_time_equals_literal(anim.effect.getComputedTiming().progress,
74                              0,
75                              'progress after adding an iteration');
76   assert_time_equals_literal(anim.effect.getComputedTiming().currentIteration,
77                              1,
78                              'current iteration after adding an iteration');
79
80   anim.effect.timing.iterations = 0;
81
82   assert_equals(anim.effect.getComputedTiming().progress, 0,
83                 'progress after setting iterations to zero');
84   assert_equals(anim.effect.getComputedTiming().currentIteration, 0,
85                 'current iteration after setting iterations to zero');
86
87   anim.effect.timing.iterations = Infinity;
88
89   assert_equals(anim.effect.getComputedTiming().progress, 0,
90                 'progress after setting iterations to Infinity');
91   assert_equals(anim.effect.getComputedTiming().currentIteration, 1,
92                 'current iteration after setting iterations to Infinity');
93 }, 'Can be updated while the animation is in progress');
94
95 </script>
96 </body>