Merge pull request #419 from ericwilligers/deprecate-hyphens

Use of hyphens in property names is deprecated

Author: dstoc

src/property-interpolation.js

@@ -12,10 +12,16 @@
 //   See the License for the specific language governing permissions and
 // limitations under the License.
 
-(function(scope, testing) {
+(function(shared, scope, testing) {
 
   var propertyHandlers = {};
 
+  function toCamelCase(property) {
+    return property.replace(/-(.)/g, function(_, c) {
+      return c.toUpperCase();
+    });
+  }
+
   function addPropertyHandler(parser, merger, property) {
     propertyHandlers[property] = propertyHandlers[property] || [];
     propertyHandlers[property].push([parser, merger]);
@@ -24,13 +30,7 @@
     for (var i = 0; i < properties.length; i++) {
       var property = properties[i];
       WEB_ANIMATIONS_TESTING && console.assert(property.toLowerCase() === property);
-      addPropertyHandler(parser, merger, property);
-      if (/-/.test(property)) {
-        // Add camel cased variant.
-        addPropertyHandler(parser, merger, property.replace(/-(.)/g, function(_, c) {
-          return c.toUpperCase();
-        }));
-      }
+      addPropertyHandler(parser, merger, toCamelCase(property));
     }
   }
   scope.addPropertiesHandler = addPropertiesHandler;
@@ -90,16 +90,17 @@
   };
 
   function propertyInterpolation(property, left, right) {
+    var ucProperty = property;
+    if (/-/.test(property) && !shared.isDeprecated('Hyphenated property names', '2016-03-22', 'Use camelCase instead.', true)) {
+      ucProperty = toCamelCase(property);
+    }
     if (left == 'initial' || right == 'initial') {
-      var ucProperty = property.replace(/-(.)/g, function(_, c) {
-        return c.toUpperCase();
-      });
       if (left == 'initial')
         left = initialValues[ucProperty];
       if (right == 'initial')
         right = initialValues[ucProperty];
     }
-    var handlers = left == right ? [] : propertyHandlers[property];
+    var handlers = left == right ? [] : propertyHandlers[ucProperty];
     for (var i = 0; handlers && i < handlers.length; i++) {
       var parsedLeft = handlers[i][0](left);
       var parsedRight = handlers[i][0](right);
@@ -121,5 +122,5 @@
   }
   scope.propertyInterpolation = propertyInterpolation;
 
-})(webAnimations1, webAnimationsTesting);
+})(webAnimationsShared, webAnimations1, webAnimationsTesting);
 

test/js/color-handler.js

@@ -21,7 +21,6 @@ suite('color-handler', function() {
     assert.equal(webAnimations1.propertyInterpolation('color', 'red', 'green')(-1), 'rgba(255,0,0,1)');
   });
   test('interpolation to/from initial', function() {
-    assert.equal(webAnimations1.propertyInterpolation('background-color', 'initial', 'red')(0.5), 'rgba(255,0,0,0.500)');
     assert.equal(webAnimations1.propertyInterpolation('backgroundColor', 'initial', 'red')(0.5), 'rgba(255,0,0,0.500)');
   });
 });

test/js/property-interpolation.js

@@ -24,7 +24,6 @@ suite('property-interpolation', function() {
       return [a, b, function(x) { return a + b; }];
     };
     webAnimations1.addPropertiesHandler(Number, merge, ['dummy-property']);
-    assert.equal(webAnimations1.propertyInterpolation('dummy-property', 1, 2)(0.5), 3);
     assert.equal(webAnimations1.propertyInterpolation('dummyProperty', 5, 3)(0.5), 8);
   });
 });