OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src="../resources/testharness.js"></script> | 2 <script src="../resources/testharness.js"></script> |
3 <script src="../resources/testharnessreport.js"></script> | 3 <script src="../resources/testharnessreport.js"></script> |
4 | 4 |
5 <body> | 5 <body> |
6 <div id='e'></div> | 6 <div id='e'></div> |
7 </body> | 7 </body> |
8 | 8 |
9 <script> | 9 <script> |
10 var element = document.getElementById('e'); | 10 var element = document.getElementById('e'); |
11 | 11 |
12 var animationWithTimingObject = new Animation(element, | 12 test(function() { |
13 [{opacity: '1', offset: 0}, | 13 var animationWithTimingObject = new Animation(element, |
14 {opacity: '0', offset: 1}], | 14 [{opacity: '1', offset: 0}, |
15 {duration: 2, iterations: 5}); | 15 {opacity: '0', offset: 1}], |
| 16 {duration: 2, iterations: 5}); |
16 | 17 |
17 var animationWithDuration = new Animation(element, | |
18 [{opacity: '1', offset: 0}, | |
19 {opacity: '0', offset: 1}], | |
20 2); | |
21 | |
22 var animationNoTiming = new Animation(element, | |
23 [{opacity: '1', offset: 0}, | |
24 {opacity: '0', offset: 1}]); | |
25 | |
26 test(function() { | |
27 assert_false(animationWithTimingObject == undefined); | 18 assert_false(animationWithTimingObject == undefined); |
28 assert_equals(animationWithTimingObject.constructor, Animation); | 19 assert_equals(animationWithTimingObject.constructor, Animation); |
29 }, 'Calling new Animation() with a timing object input should create an animatio
n.'); | 20 }, 'Calling new Animation() with a timing object input should create an animatio
n.'); |
30 | 21 |
31 test(function() { | 22 test(function() { |
| 23 var animationWithDuration = new Animation(element, |
| 24 [{opacity: '1', offset: 0}, |
| 25 {opacity: '0', offset: 1}], |
| 26 2); |
| 27 |
32 assert_false(animationWithDuration == undefined); | 28 assert_false(animationWithDuration == undefined); |
33 assert_equals(animationWithDuration.constructor, Animation); | 29 assert_equals(animationWithDuration.constructor, Animation); |
34 }, 'Calling new Animation() with a duration input should create an animation.'); | 30 }, 'Calling new Animation() with a duration input should create an animation.'); |
35 | 31 |
36 test(function() { | 32 test(function() { |
| 33 var animationNoTiming = new Animation(element, |
| 34 [{opacity: '1', offset: 0}, |
| 35 {opacity: '0', offset: 1}]); |
| 36 |
37 assert_false(animationNoTiming == undefined); | 37 assert_false(animationNoTiming == undefined); |
38 assert_equals(animationNoTiming.constructor, Animation); | 38 assert_equals(animationNoTiming.constructor, Animation); |
39 }, 'Calling new Animation() with no timing input should create an animation.'); | 39 }, 'Calling new Animation() with no timing input should create an animation.'); |
40 </script> | 40 |
| 41 test(function() { |
| 42 var validKeyframes1 = [ |
| 43 {opacity: '1', color: 'red', offset: 0}, |
| 44 {opacity: '0', offset: 1}]; |
| 45 var partialKeyframes1 = [ |
| 46 {opacity: '1', offset: 0}, |
| 47 {opacity: '0', color: 'red', offset: 1}]; |
| 48 var validKeyframes2 = [ |
| 49 {opacity: '1', color: 'red', offset: 0}, |
| 50 {opacity: '0', color: 'foo', offset: 1}]; |
| 51 var partialKeyframes2 = [ |
| 52 {opacity: '1', color: 'foo', offset: 0}, |
| 53 {opacity: '0', color: 'red', offset: 1}]; |
| 54 |
| 55 assert_not_equals(function() { new Animation(element, validKeyframes1); }, u
ndefined); |
| 56 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes1); }); |
| 57 assert_not_equals(function() { new Animation(element, validKeyframes2); }, u
ndefined); |
| 58 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes2); }); |
| 59 }, 'Calling new Animation() with a mismatched keyframe property should throw a N
otSupportedError.'); |
| 60 |
| 61 test(function() { |
| 62 var keyframes1 = [ |
| 63 {opacity: '1', offset: 0}, |
| 64 {opacity: '0', offset: 1}]; |
| 65 var keyframes2 = [ |
| 66 {opacity: '1', offset: 0.1}, |
| 67 {opacity: '0', offset: 1}]; |
| 68 var keyframes3 = [ |
| 69 {opacity: '1', offset: 0.1}, |
| 70 {opacity: '0', offset: 0.2}]; |
| 71 var keyframes4 = [ |
| 72 {opacity: '1', offset: 0.5}, |
| 73 {opacity: '0'}]; |
| 74 |
| 75 assert_not_equals(function() { new Animation(element, keyframes1); }, undefi
ned); |
| 76 assert_not_equals(function() { new Animation(element, keyframes2); }, undefi
ned); |
| 77 assert_not_equals(function() { new Animation(element, keyframes3); }, undefi
ned); |
| 78 assert_not_equals(function() { new Animation(element, keyframes4); }, undefi
ned); |
| 79 }, 'Calling new Animation() with specified offsets but no keframe for offset: 0
should create an animation.'); |
| 80 |
| 81 test(function() { |
| 82 var keyframes = [ |
| 83 {opacity: '1', offset: 0}, |
| 84 {opacity: '0', offset: 0.1}]; |
| 85 |
| 86 assert_not_equals(function() { new Animation(element, keyframes); }, undefin
ed); |
| 87 }, 'Calling new Animation() with specified offsets but no keyframe for offset: 1
should create an animation.'); |
| 88 </script> |
OLD | NEW |