| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <script src="../resources/testharness.js"></script> | |
| 3 <script src="../resources/testharnessreport.js"></script> | |
| 4 | |
| 5 <body> | |
| 6 <div id='e'></div> | |
| 7 </body> | |
| 8 | |
| 9 <script> | |
| 10 var element = document.getElementById('e'); | |
| 11 | |
| 12 test(function() { | |
| 13 var partialKeyframes1 = [ | |
| 14 {opacity: '1', color: 'red'}, | |
| 15 {opacity: '0'} | |
| 16 ]; | |
| 17 var partialKeyframes2 = [ | |
| 18 {opacity: '1'}, | |
| 19 {opacity: '0', color: 'red'} | |
| 20 ]; | |
| 21 var partialKeyframes3 = [ | |
| 22 {opacity: '1', color: 'red'}, | |
| 23 {opacity: '0', color: 'foo'} | |
| 24 ]; | |
| 25 var partialKeyframes4 = [ | |
| 26 {opacity: '1', color: 'foo'}, | |
| 27 {opacity: '0', color: 'red'} | |
| 28 ]; | |
| 29 | |
| 30 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); | |
| 31 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); | |
| 32 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes3); }); | |
| 33 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes4); }); | |
| 34 }, 'Calling new KeyframeEffect() with a mismatched keyframe property should thro
w a NotSupportedError.'); | |
| 35 | |
| 36 test(function() { | |
| 37 var validKeyframes1 = [ | |
| 38 {opacity: '1'}, | |
| 39 {opacity: '0.3', offset: 0.5}, | |
| 40 {opacity: '0', offset: 1} | |
| 41 ]; | |
| 42 var validKeyframes2 = [ | |
| 43 {width: '0px'}, | |
| 44 {height: '0px', offset: 0}, | |
| 45 {width: '10px', height: '10px', offset: 1} | |
| 46 ]; | |
| 47 | |
| 48 assert_not_equals(new KeyframeEffect(element, validKeyframes1), undefined); | |
| 49 assert_not_equals(new KeyframeEffect(element, validKeyframes2), undefined); | |
| 50 }, 'Calling new KeyframeEffect() with no offset specified for the first keyframe
should create and animation.'); | |
| 51 | |
| 52 test(function() { | |
| 53 var partialKeyframes1 = [ | |
| 54 {opacity: '1', offset: 0.1}, | |
| 55 {opacity: '0', offset: 1} | |
| 56 ]; | |
| 57 var partialKeyframes2 = [ | |
| 58 {opacity: '1', offset: 0.1}, | |
| 59 {opacity: '0'} | |
| 60 ]; | |
| 61 | |
| 62 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); | |
| 63 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); | |
| 64 }, 'Calling new KeyframeEffect() with the offset of the first keyframe specified
but not equal to 0 should throw a NotSupportedError.'); | |
| 65 | |
| 66 test(function() { | |
| 67 var validKeyframes1 = [ | |
| 68 {opacity: '1', offset: 0}, | |
| 69 {opacity: '0.3', offset: 0.5}, | |
| 70 {opacity: '0'} | |
| 71 ]; | |
| 72 var validKeyframes2 = [ | |
| 73 {width: '0px', height: '0px', offset: 0}, | |
| 74 {height: '10px', offset: 1}, | |
| 75 {width: '10px'} | |
| 76 ]; | |
| 77 | |
| 78 assert_not_equals(new KeyframeEffect(element, validKeyframes1), undefined); | |
| 79 assert_not_equals(new KeyframeEffect(element, validKeyframes2), undefined); | |
| 80 }, 'Calling new KeyframeEffect() with no offset specified for the last keyframe
should create an animation.'); | |
| 81 | |
| 82 test(function() { | |
| 83 var partialKeyframes1 = [ | |
| 84 {opacity: '1', offset: 0}, | |
| 85 {opacity: '0', offset: 0.1} | |
| 86 ]; | |
| 87 var partialKeyframes2 = [ | |
| 88 {opacity: '1'}, | |
| 89 {opacity: '0', offset: 0.1} | |
| 90 ]; | |
| 91 | |
| 92 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); | |
| 93 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); | |
| 94 }, 'Calling new KeyframeEffect() with the offset of the last keyframe specified
but not equal to 1 should throw a NotSupportedError.'); | |
| 95 | |
| 96 test(function() { | |
| 97 var partialKeyframes1 = [ | |
| 98 {width: '0px', height: '0px', offset: 0}, | |
| 99 {height: '10px'}, | |
| 100 {width: '10px', offset: 1} | |
| 101 ]; | |
| 102 var partialKeyframes2 = [ | |
| 103 {width: '0px', height: '0px', offset: 0}, | |
| 104 {height: '10px'}, | |
| 105 {width: '10px'} | |
| 106 ]; | |
| 107 | |
| 108 // Height is missing keyframe at offset: 1 | |
| 109 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); | |
| 110 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); | |
| 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.'
); | |
| 113 | |
| 114 test(function() { | |
| 115 var partialKeyframes1 = [ | |
| 116 {width: '0px', offset: 0}, | |
| 117 {height: '0px'}, | |
| 118 {width: '10px', height: '10px', offset: 1} | |
| 119 ]; | |
| 120 var partialKeyframes2 = [ | |
| 121 {width: '0px'}, | |
| 122 {height: '0px'}, | |
| 123 {width: '10px', height: '10px', offset: 1} | |
| 124 ]; | |
| 125 | |
| 126 // Height is missing keyframe at offset: 0 | |
| 127 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes1); }); | |
| 128 assert_throws('NOT_SUPPORTED_ERR', function() { new KeyframeEffect(element,
partialKeyframes2); }); | |
| 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.
'); | |
| 131 </script> | |
| OLD | NEW |