Throw TypeErrors on invalid inputs to AnimationEffectTiming

src/timing-utilities.js

@@ -16,6 +16,7 @@
 
   var fills = 'backwards|forwards|both|none'.split('|');
   var directions = 'reverse|alternate|alternate-reverse'.split('|');
+  var linear = function(x) { return x; };
 
   function cloneTimingInput(timingInput) {
     if (typeof timingInput == 'number') {
@@ -38,6 +39,7 @@
     this._playbackRate = 1;
     this._direction = 'normal';
     this._easing = 'linear';
+    this._easingFunction = linear;
   }
 
   AnimationEffectTiming.prototype = {
@@ -74,12 +76,18 @@
       return this._fill;
     },
     set iterationStart(value) {
+      if (value < 0) {
+        throw new TypeError('iterationStart must be non-negative, received: ' + timing.iterationStart);
+      }
       this._setMember('iterationStart', value);
     },
     get iterationStart() {
       return this._iterationStart;
     },
     set duration(value) {
+      if (value != 'auto' && (isNaN(value) || value < 0)) {
+        throw new TypeError('duration must be non-negative or auto, received: ' + value);
+      }
       this._setMember('duration', value);
     },
     get duration() {
@@ -92,12 +100,16 @@
       return this._direction;
     },
     set easing(value) {
+      this._easingFunction = toTimingFunction(value);
       this._setMember('easing', value);
     },
     get easing() {
       return this._easing;
     },
     set iterations(value) {
+      if (isNaN(value) || value < 0) {
+        throw new TypeError('iterations must be non-negative, received: ' + value);
+      }
       this._setMember('iterations', value);
     },
     get iterations() {
@@ -150,9 +162,7 @@
 
   function normalizeTimingInput(timingInput, forGroup) {
     timingInput = shared.numericTimingToObject(timingInput);
-    var timing = makeTiming(timingInput, forGroup);
-    timing._easingFunction = toTimingFunction(timing.easing);
-    return timing;
+    return makeTiming(timingInput, forGroup);
   }
 
   function cubic(a, b, c, d) {
@@ -209,25 +219,28 @@
   var numberString = '\\s*(-?\\d+\\.?\\d*|-?\\.\\d+)\\s*';
   var cubicBezierRe = new RegExp('cubic-bezier\\(' + numberString + ',' + numberString + ',' + numberString + ',' + numberString + '\\)');
   var stepRe = /steps\(\s*(\d+)\s*,\s*(start|middle|end)\s*\)/;
-  var linear = function(x) { return x; };
 
   function toTimingFunction(easing) {
     if (!styleForCleaning) {
       styleForCleaning = document.createElement('div').style;
     }
     styleForCleaning.animationTimingFunction = '';
     styleForCleaning.animationTimingFunction = easing;
-    easing = styleForCleaning.animationTimingFunction;
+    var validatedEasing = styleForCleaning.animationTimingFunction;
+
+    if (validatedEasing == '') {
+      throw new TypeError(easing + ' is not a valid value for easing');
+    }
 
-    var cubicData = cubicBezierRe.exec(easing);
+    var cubicData = cubicBezierRe.exec(validatedEasing);
     if (cubicData) {
       return cubic.apply(this, cubicData.slice(1).map(Number));
     }
-    var stepData = stepRe.exec(easing);
+    var stepData = stepRe.exec(validatedEasing);
     if (stepData) {
       return step(Number(stepData[1]), {'start': Start, 'middle': Middle, 'end': End}[stepData[2]]);
     }
-    var preset = presets[easing];
+    var preset = presets[validatedEasing];
     if (preset) {
       return preset;
     }

test/js/keyframes.js

@@ -442,16 +442,13 @@ suite('keyframes', function() {
     assert.equal(typeof interpolations[1].interpolation, 'function');
   });
 
-  test('Make interpolations with invalid easing.', function() {
-    var interpolations;
-    assert.doesNotThrow(function() {
-      interpolations = makeInterpolations(makePropertySpecificKeyframeGroups(normalizeKeyframes([
+  test('Make interpolations with invalid easing should throw.', function() {
+    assert.throws(function() {
+      makeInterpolations(makePropertySpecificKeyframeGroups(normalizeKeyframes([
         {left: '0px', easing: 'pants and ducks'},
         {left: '200px'},
       ])));
     });
-    assert.equal(interpolations.length, 1);
-    assert.equal(interpolations[0].easing.toString(), 'function (x) { return x; }');
   });
 });
 

test/js/timing-utilities.js

@@ -33,18 +33,17 @@ suite('timing-utilities', function() {
     f = toTimingFunction('cubic-bezier(0, 1, 1, 0)');
     assert.closeTo(f(0.104), 0.392, 0.01);
 
-    function assertIsLinear(easing) {
-      var f = toTimingFunction(easing);
-      for (var i = 0; i <= 1; i += 0.1) {
-        assert.equal(f(i), i, easing + ' is linear');
-      }
+    function assertThrows(easing) {
+      assert.throws(function() {
+        toTimingFunction(easing);
+      }, easing);
     }
 
-    assertIsLinear('cubic-bezier(.25, 0.1, 0.25, 1.)');
-    assertIsLinear('cubic-bezier(0, 1, -1, 1)');
-    assertIsLinear('an elephant');
-    assertIsLinear('cubic-bezier(-1, 1, 1, 1)');
-    assertIsLinear('cubic-bezier(1, 1, 1)');
+    assertThrows('cubic-bezier(.25, 0.1, 0.25, 1.)');
+    assertThrows('cubic-bezier(0, 1, -1, 1)');
+    assertThrows('an elephant');
+    assertThrows('cubic-bezier(-1, 1, 1, 1)');
+    assertThrows('cubic-bezier(1, 1, 1)');
 
     f = toTimingFunction('steps(10, end)');
     assert.equal(f(0), 0);
@@ -119,4 +118,24 @@ suite('timing-utilities', function() {
     assert.equal(effectTF(6000), 0.5);
     assert.closeTo(effectTF2(6000), 0.8, 0.005);
   });
+  test('TypeErrors', function() {
+    var timing = normalizeTimingInput({
+      iterationStart: 123,
+      iterations: 456,
+      duration: 789,
+      easing: 'ease',
+    });
+
+    assert.throws(function() { timing.iterationStart = -1; });
+    assert.equal(timing.iterationStart, 123);
+
+    assert.throws(function() { timing.iterations = -1; });
+    assert.equal(timing.iterations, 456);
+
+    assert.throws(function() { timing.duration = -1; });
+    assert.equal(timing.duration, 789);
+
+    assert.throws(function() { timing.easing = 'invalid timing function'; });
+    assert.equal(timing.easing, 'ease');
+  });
 });