add lineClamp, vendor prefixes to CSSProperty.isUnitlessNumber

Author: jbonta

src/browser/dom/CSSProperty.js

@@ -28,6 +28,7 @@ var isUnitlessNumber = {
  flexGrow: true,
  flexShrink: true,
  fontWeight: true,
+ lineClamp: true,
  lineHeight: true,
  opacity: true,
  order: true,
@@ -41,6 +42,27 @@ var isUnitlessNumber = {
  zoom: true
 };
 
+/**
+ * @param {string} prefix vendor-specific prefix, eg: Webkit
+ * @param {string} key style name, eg: transitionDuration
+ * @return {string} style name prefixed with `prefix`, properly camelCased, eg:
+ * WebkitTransitionDuration
+ */
+function prefixKey(prefix, key) {
+ return prefix + key.charAt(0).toUpperCase() + key.substring(1);
+}
+
+/**
+ * Support style names that may come passed in prefixed by adding permutations
+ * of vendor prefixes.
+ */
+var prefixes = ['Webkit', 'ms', 'Moz', 'O'];
+for (var k in isUnitlessNumber) {
+ prefixes.forEach(function(prefix) {
+ isUnitlessNumber[prefixKey(prefix, k)] = isUnitlessNumber[k];
+ });
+}
+
 /**
  * Most style properties can be unset by doing .style[prop] = '' but IE8
  * doesn't like doing that with shorthand properties so for the properties that

src/browser/dom/__tests__/CSSProperty-test.js

@@ -0,0 +1,39 @@
+/**
+ * Copyright 2014 Facebook, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * @jsx React.DOM
+ * @emails react-core
+ */
+
+/*jslint evil: true */
+
+"use strict";
+
+describe('CSSProperty', function() {
+ var CSSProperty;
+
+ beforeEach(function() {
+ require('mock-modules').dumpCache();
+ CSSProperty = require('CSSProperty');
+ });
+
+ it('should generate browser prefixes for its `isUnitlessNumber`', function() {
+ expect(CSSProperty.isUnitlessNumber.lineClamp).toBeTruthy();
+ expect(CSSProperty.isUnitlessNumber.WebkitLineClamp).toBeTruthy();
+ expect(CSSProperty.isUnitlessNumber.msFlexGrow).toBeTruthy();
+ expect(CSSProperty.isUnitlessNumber.MozFlexGrow).toBeTruthy();
+ });
+
+});

src/browser/dom/__tests__/CSSPropertyOperations-test.js

@@ -69,25 +69,8 @@ describe('CSSPropertyOperations', function() {
  });
 
  it('should not append `px` to styles that might need a number', function() {
- var unitlessProperties = [
- 'columnCount',
- 'fillOpacity',
- 'flex',
- 'flexGrow',
- 'flexShrink',
- 'fontWeight',
- 'lineHeight',
- 'opacity',
- 'order',
- 'orphans',
- 'pitchRange',
- 'richness',
- 'stress',
- 'volume',
- 'widows',
- 'zIndex',
- 'zoom'
- ];
+ var CSSProperty = require('CSSProperty');
+ var unitlessProperties = Object.keys(CSSProperty.isUnitlessNumber);
  unitlessProperties.forEach(function(property) {
  var styles = {};
  styles[property] = 1;