[WIP] Web Animations API: Constructing an Animation from partial keyframes throws a JS exception

LayoutTests/web-animations-api/animation-constructor.html

Index: LayoutTests/web-animations-api/animation-constructor.html
diff --git a/LayoutTests/web-animations-api/animation-constructor.html b/LayoutTests/web-animations-api/animation-constructor.html
index 0a679cdabdda1dc950c33d88cbdd84ce1870bcc6..c9491773e5237fef65ac3c5881d2810d1a89d263 100644
--- a/LayoutTests/web-animations-api/animation-constructor.html
+++ b/LayoutTests/web-animations-api/animation-constructor.html
@@ -9,32 +9,80 @@
 <script>
 var element = document.getElementById('e');
 
-var animationWithTimingObject = new Animation(element,
-    [{opacity: '1', offset: 0},
-    {opacity: '0', offset: 1}],
-    {duration: 2, iterations: 5});
-
-var animationWithDuration = new Animation(element,
-    [{opacity: '1', offset: 0},
-    {opacity: '0', offset: 1}],
-    2);
-
-var animationNoTiming = new Animation(element,
-    [{opacity: '1', offset: 0},
-    {opacity: '0', offset: 1}]);
-
 test(function() {
+    var animationWithTimingObject = new Animation(element,
+        [{opacity: '1', offset: 0},
+        {opacity: '0', offset: 1}],
+        {duration: 2, iterations: 5});
+
     assert_false(animationWithTimingObject == undefined);
     assert_equals(animationWithTimingObject.constructor, Animation);
 }, 'Calling new Animation() with a timing object input should create an animation.');
 
 test(function() {
+    var animationWithDuration = new Animation(element,
+        [{opacity: '1', offset: 0},
+        {opacity: '0', offset: 1}],
+        2);
+
     assert_false(animationWithDuration == undefined);
     assert_equals(animationWithDuration.constructor, Animation);
 }, 'Calling new Animation() with a duration input should create an animation.');
 
 test(function() {
+    var animationNoTiming = new Animation(element,
+        [{opacity: '1', offset: 0},
+        {opacity: '0', offset: 1}]);
+
     assert_false(animationNoTiming == undefined);
     assert_equals(animationNoTiming.constructor, Animation);
 }, 'Calling new Animation() with no timing input should create an animation.');
-</script>
+
+test(function() {
+    var validKeyframes1 = [
+        {opacity: '1', color: 'red', offset: 0},
+        {opacity: '0', offset: 1}];
+    var partialKeyframes1 = [
+        {opacity: '1', offset: 0},
+        {opacity: '0', color: 'red', offset: 1}];
+    var validKeyframes2 = [
+        {opacity: '1', color: 'red', offset: 0},
+        {opacity: '0', color: 'foo', offset: 1}];
+    var partialKeyframes2 = [
+        {opacity: '1', color: 'foo', offset: 0},
+        {opacity: '0', color: 'red', offset: 1}];
+
+    assert_not_equals(function() { new Animation(element, validKeyframes1); }, undefined);
+    assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, partialKeyframes1); });
+    assert_not_equals(function() { new Animation(element, validKeyframes2); }, undefined);
+    assert_throws('NOT_SUPPORTED_ERR', function() { new Animation(element, partialKeyframes2); });
+}, 'Calling new Animation() with a mismatched keyframe property should throw a NotSupportedError.');
+
+test(function() {
+    var keyframes1 = [
+        {opacity: '1', offset: 0},
+        {opacity: '0', offset: 1}];
+    var keyframes2 = [
+        {opacity: '1', offset: 0.1},
+        {opacity: '0', offset: 1}];
+    var keyframes3 = [
+        {opacity: '1', offset: 0.1},
+        {opacity: '0', offset: 0.2}];
+    var keyframes4 = [
+        {opacity: '1', offset: 0.5},
+        {opacity: '0'}];
+
+    assert_not_equals(function() { new Animation(element, keyframes1); }, undefined);
+    assert_not_equals(function() { new Animation(element, keyframes2); }, undefined);
+    assert_not_equals(function() { new Animation(element, keyframes3); }, undefined);
+    assert_not_equals(function() { new Animation(element, keyframes4); }, undefined);
+}, 'Calling new Animation() with specified offsets but no keframe for offset: 0 should create an animation.');
+
+test(function() {
+    var keyframes = [
+        {opacity: '1', offset: 0},
+        {opacity: '0', offset: 0.1}];
+
+    assert_not_equals(function() { new Animation(element, keyframes); }, undefined);
+}, 'Calling new Animation() with specified offsets but no keyframe for offset: 1 should create an animation.');
+</script>