| 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 test(function() { | 12 test(function() { |
| 13 var partialKeyframes1 = [ | 13 var partialKeyframes1 = [ |
| 14 {opacity: '1', color: 'red'}, | 14 {opacity: '1', color: 'red'}, |
| 15 {opacity: '0'} | 15 {opacity: '0'} |
| 16 ]; | 16 ]; |
| 17 var partialKeyframes2 = [ | 17 var partialKeyframes2 = [ |
| 18 {opacity: '1'}, | 18 {opacity: '1'}, |
| 19 {opacity: '0', color: 'red'} | 19 {opacity: '0', color: 'red'} |
| 20 ]; | 20 ]; |
| 21 var partialKeyframes3 = [ | 21 var partialKeyframes3 = [ |
| 22 {opacity: '1', color: 'red'}, | 22 {opacity: '1', color: 'red'}, |
| 23 {opacity: '0', color: 'foo'} | 23 {opacity: '0', color: 'foo'} |
| 24 ]; | 24 ]; |
| 25 var partialKeyframes4 = [ | 25 var partialKeyframes4 = [ |
| 26 {opacity: '1', color: 'foo'}, | 26 {opacity: '1', color: 'foo'}, |
| 27 {opacity: '0', color: 'red'} | 27 {opacity: '0', color: 'red'} |
| 28 ]; | 28 ]; |
| 29 | 29 |
| 30 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes1); }); | 30 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); |
| 31 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes2); }); | 31 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); |
| 32 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes3); }); | 32 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes3); }); |
| 33 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes4); }); | 33 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes4); }); |
| 34 }, 'Calling new Animation() with a mismatched keyframe property should throw a N
otSupportedError.'); | 34 }, 'Calling new KeyframeEffect() with a mismatched keyframe property should thro
w a NotSupportedError.'); |
| 35 | 35 |
| 36 test(function() { | 36 test(function() { |
| 37 var validKeyframes1 = [ | 37 var validKeyframes1 = [ |
| 38 {opacity: '1'}, | 38 {opacity: '1'}, |
| 39 {opacity: '0.3', offset: 0.5}, | 39 {opacity: '0.3', offset: 0.5}, |
| 40 {opacity: '0', offset: 1} | 40 {opacity: '0', offset: 1} |
| 41 ]; | 41 ]; |
| 42 var validKeyframes2 = [ | 42 var validKeyframes2 = [ |
| 43 {width: '0px'}, | 43 {width: '0px'}, |
| 44 {height: '0px', offset: 0}, | 44 {height: '0px', offset: 0}, |
| 45 {width: '10px', height: '10px', offset: 1} | 45 {width: '10px', height: '10px', offset: 1} |
| 46 ]; | 46 ]; |
| 47 | 47 |
| 48 assert_not_equals(new Animation(element, validKeyframes1), undefined); | 48 assert_not_equals(new KeyframeEffect(element, validKeyframes1), undefined); |
| 49 assert_not_equals(new Animation(element, validKeyframes2), undefined); | 49 assert_not_equals(new KeyframeEffect(element, validKeyframes2), undefined); |
| 50 }, 'Calling new Animation() with no offset specified for the first keyframe shou
ld create and animation.'); | 50 }, 'Calling new KeyframeEffect() with no offset specified for the first keyframe
should create and animation.'); |
| 51 | 51 |
| 52 test(function() { | 52 test(function() { |
| 53 var partialKeyframes1 = [ | 53 var partialKeyframes1 = [ |
| 54 {opacity: '1', offset: 0.1}, | 54 {opacity: '1', offset: 0.1}, |
| 55 {opacity: '0', offset: 1} | 55 {opacity: '0', offset: 1} |
| 56 ]; | 56 ]; |
| 57 var partialKeyframes2 = [ | 57 var partialKeyframes2 = [ |
| 58 {opacity: '1', offset: 0.1}, | 58 {opacity: '1', offset: 0.1}, |
| 59 {opacity: '0'} | 59 {opacity: '0'} |
| 60 ]; | 60 ]; |
| 61 | 61 |
| 62 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes1); }); | 62 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); |
| 63 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes2); }); | 63 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); |
| 64 }, 'Calling new Animation() with the offset of the first keyframe specified but
not equal to 0 should throw a NotSupportedError.'); | 64 }, 'Calling new KeyframeEffect() with the offset of the first keyframe specified
but not equal to 0 should throw a NotSupportedError.'); |
| 65 | 65 |
| 66 test(function() { | 66 test(function() { |
| 67 var validKeyframes1 = [ | 67 var validKeyframes1 = [ |
| 68 {opacity: '1', offset: 0}, | 68 {opacity: '1', offset: 0}, |
| 69 {opacity: '0.3', offset: 0.5}, | 69 {opacity: '0.3', offset: 0.5}, |
| 70 {opacity: '0'} | 70 {opacity: '0'} |
| 71 ]; | 71 ]; |
| 72 var validKeyframes2 = [ | 72 var validKeyframes2 = [ |
| 73 {width: '0px', height: '0px', offset: 0}, | 73 {width: '0px', height: '0px', offset: 0}, |
| 74 {height: '10px', offset: 1}, | 74 {height: '10px', offset: 1}, |
| 75 {width: '10px'} | 75 {width: '10px'} |
| 76 ]; | 76 ]; |
| 77 | 77 |
| 78 assert_not_equals(new Animation(element, validKeyframes1), undefined); | 78 assert_not_equals(new KeyframeEffect(element, validKeyframes1), undefined); |
| 79 assert_not_equals(new Animation(element, validKeyframes2), undefined); | 79 assert_not_equals(new KeyframeEffect(element, validKeyframes2), undefined); |
| 80 }, 'Calling new Animation() with no offset specified for the last keyframe shoul
d create an animation.'); | 80 }, 'Calling new KeyframeEffect() with no offset specified for the last keyframe
should create an animation.'); |
| 81 | 81 |
| 82 test(function() { | 82 test(function() { |
| 83 var partialKeyframes1 = [ | 83 var partialKeyframes1 = [ |
| 84 {opacity: '1', offset: 0}, | 84 {opacity: '1', offset: 0}, |
| 85 {opacity: '0', offset: 0.1} | 85 {opacity: '0', offset: 0.1} |
| 86 ]; | 86 ]; |
| 87 var partialKeyframes2 = [ | 87 var partialKeyframes2 = [ |
| 88 {opacity: '1'}, | 88 {opacity: '1'}, |
| 89 {opacity: '0', offset: 0.1} | 89 {opacity: '0', offset: 0.1} |
| 90 ]; | 90 ]; |
| 91 | 91 |
| 92 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes1); }); | 92 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); |
| 93 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes2); }); | 93 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); |
| 94 }, 'Calling new Animation() with the offset of the last keyframe specified but n
ot equal to 1 should throw a NotSupportedError.'); | 94 }, 'Calling new KeyframeEffect() with the offset of the last keyframe specified
but not equal to 1 should throw a NotSupportedError.'); |
| 95 | 95 |
| 96 test(function() { | 96 test(function() { |
| 97 var partialKeyframes1 = [ | 97 var partialKeyframes1 = [ |
| 98 {width: '0px', height: '0px', offset: 0}, | 98 {width: '0px', height: '0px', offset: 0}, |
| 99 {height: '10px'}, | 99 {height: '10px'}, |
| 100 {width: '10px', offset: 1} | 100 {width: '10px', offset: 1} |
| 101 ]; | 101 ]; |
| 102 var partialKeyframes2 = [ | 102 var partialKeyframes2 = [ |
| 103 {width: '0px', height: '0px', offset: 0}, | 103 {width: '0px', height: '0px', offset: 0}, |
| 104 {height: '10px'}, | 104 {height: '10px'}, |
| 105 {width: '10px'} | 105 {width: '10px'} |
| 106 ]; | 106 ]; |
| 107 | 107 |
| 108 // Height is missing keyframe at offset: 1 | 108 // Height is missing keyframe at offset: 1 |
| 109 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes1); }); | 109 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); |
| 110 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes2); }); | 110 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); |
| 111 }, 'Calling new Animation() with a keyframe that has no offset specified, is fol
lowed by other keyframes, ' + | 111 }, 'Calling new KeyframeEffect() with a keyframe that has no offset specified, i
s followed by other keyframes, ' + |
| 112 'and is the last keyframe for a property, should throw a NotSupportedError.'
); | 112 'and is the last keyframe for a property, should throw a NotSupportedError.'
); |
| 113 | 113 |
| 114 test(function() { | 114 test(function() { |
| 115 var partialKeyframes1 = [ | 115 var partialKeyframes1 = [ |
| 116 {width: '0px', offset: 0}, | 116 {width: '0px', offset: 0}, |
| 117 {height: '0px'}, | 117 {height: '0px'}, |
| 118 {width: '10px', height: '10px', offset: 1} | 118 {width: '10px', height: '10px', offset: 1} |
| 119 ]; | 119 ]; |
| 120 var partialKeyframes2 = [ | 120 var partialKeyframes2 = [ |
| 121 {width: '0px'}, | 121 {width: '0px'}, |
| 122 {height: '0px'}, | 122 {height: '0px'}, |
| 123 {width: '10px', height: '10px', offset: 1} | 123 {width: '10px', height: '10px', offset: 1} |
| 124 ]; | 124 ]; |
| 125 | 125 |
| 126 // Height is missing keyframe at offset: 0 | 126 // Height is missing keyframe at offset: 0 |
| 127 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes1); }); | 127 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); |
| 128 assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, parti
alKeyframes2); }); | 128 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); |
| 129 }, 'Calling new Animation() with a keyframe that has no offset specified, is pre
ceded by other keyframes, ' + | 129 }, 'Calling new KeyframeEffect() with a keyframe that has no offset specified, i
s preceded by other keyframes, ' + |
| 130 'and is the first keyframe for a property, should throw a NotSupportedError.
'); | 130 'and is the first keyframe for a property, should throw a NotSupportedError.
'); |
| 131 </script> | 131 </script> |
| OLD | NEW |