Support animation of SVG color properties

Animation of 'fill', 'flood-color', 'lighting-color', 'stop-color',
'stroke' is now supported.

Author: ericwilligers

src/color-handler.js

@@ -52,7 +52,8 @@
 
   scope.addPropertiesHandler(parseColor, mergeColors,
       ['background-color', 'border-bottom-color', 'border-left-color', 'border-right-color',
-       'border-top-color', 'color', 'outline-color', 'text-decoration-color']);
+       'border-top-color', 'color', 'fill', 'flood-color', 'lighting-color',
+       'outline-color', 'stop-color', 'stroke', 'text-decoration-color']);
   scope.consumeColor = scope.consumeParenthesised.bind(null, parseColor);
   scope.mergeColors = mergeColors;
 

test/js/color-handler.js

@@ -20,6 +20,13 @@ suite('color-handler', function() {
     assert.equal(webAnimations1.propertyInterpolation('color', 'red', 'green')(2), 'rgba(0,255,0,1)');
     assert.equal(webAnimations1.propertyInterpolation('color', 'red', 'green')(-1), 'rgba(255,0,0,1)');
   });
+  test('svg color interpolation', function() {
+    assert.equal(webAnimations1.propertyInterpolation('fill', '#00fe00', '#180036')(0.5), 'rgba(12,127,27,1)');
+    assert.equal(webAnimations1.propertyInterpolation('floodColor', '#00fe00', '#180036')(0.5), 'rgba(12,127,27,1)');
+    assert.equal(webAnimations1.propertyInterpolation('lightingColor', '#00fe00', '#180036')(0.5), 'rgba(12,127,27,1)');
+    assert.equal(webAnimations1.propertyInterpolation('stopColor', '#00fe00', '#180036')(0.5), 'rgba(12,127,27,1)');
+    assert.equal(webAnimations1.propertyInterpolation('stroke', '#00fe00', '#180036')(0.5), 'rgba(12,127,27,1)');
+  });
   test('interpolation to/from initial', function() {
     assert.equal(webAnimations1.propertyInterpolation('backgroundColor', 'initial', 'red')(0.5), 'rgba(255,0,0,0.500)');
   });