OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <meta charset=utf-8> | 2 <meta charset=utf-8> |
3 <title>Animating with KeyframeEffectReadOnly objects</title> | 3 <title>Animating with KeyframeEffectReadOnly objects</title> |
4 <script src="../resources/testharness.js"></script> | 4 <script src="../../resources/testharness.js"></script> |
5 <script src="../resources/testharnessreport.js"></script> | 5 <script src="../../resources/testharnessreport.js"></script> |
6 <script src="../external/wpt/web-animations/testcommon.js"></script> | 6 <script src="../../external/wpt/web-animations/testcommon.js"></script> |
7 <body> | 7 <body> |
8 <script> | 8 <script> |
9 "use strict"; | 9 "use strict"; |
10 | 10 |
11 test(function(t) { | 11 test(function(t) { |
12 var target = createDiv(t); | 12 var target = createDiv(t); |
13 var effect = new KeyframeEffectReadOnly(target, null); | 13 var effect = new KeyframeEffectReadOnly(target, null); |
14 var anim = target.animate(null); | 14 var anim = target.animate(null); |
15 anim.effect = effect; | 15 anim.effect = effect; |
16 assert_class_string(anim.effect, "KeyframeEffectReadOnly"); | 16 assert_class_string(anim.effect, "KeyframeEffectReadOnly"); |
17 assert_class_string(anim.effect.timing, "AnimationEffectTimingReadOnly"); | 17 assert_class_string(anim.effect.timing, "AnimationEffectTimingReadOnly"); |
18 }, "An animation can be created with a KeyframeEffectReadOnly, and the effect" | 18 }, "An animation can be created with a KeyframeEffectReadOnly, and the effect" |
19 + " is of the expected type"); | 19 + " is of the expected type"); |
20 | 20 |
21 test(function(t) { | 21 test(function(t) { |
22 var target = createDiv(t); | 22 var target = createDiv(t); |
23 var effect = new KeyframeEffectReadOnly(target, { opacity: [0, 0.9] }, 1000); | 23 var effect = new KeyframeEffectReadOnly(target, { opacity: [0, 0.9] }, 1000); |
24 var anim = target.animate(null); | 24 var anim = target.animate(null); |
25 anim.pause(); | 25 anim.pause(); |
26 anim.effect = effect; | 26 anim.effect = effect; |
27 anim.currentTime = 500; | 27 anim.currentTime = 500; |
28 assert_equals(getComputedStyle(target).opacity, '0.45', | 28 assert_equals(getComputedStyle(target).opacity, '0.45', |
29 'opacity at mid-point'); | 29 'opacity at mid-point'); |
30 }, "An animation based on a KeyframeEffectReadOnly applies an effect"); | 30 }, "An animation based on a KeyframeEffectReadOnly applies an effect"); |
31 | 31 |
32 </script> | 32 </script> |
33 </body> | 33 </body> |
OLD | NEW |