react 0.13.3 → 0.14.0-alpha1

package/lib/ReactDefaultPerfAnalysis.js

@@ -9,6 +9,8 @@
  * @providesModule ReactDefaultPerfAnalysis
  */
 
+'use strict';
+
 var assign = require("./Object.assign");
 
 // Don't try to save users less than 1.2ms (a number I made up)
@@ -46,7 +48,7 @@ function getDOMSummary(measurements) {
     var id;
 
     for (id in measurement.writes) {
-      measurement.writes[id].forEach(function(write) {
+      measurement.writes[id].forEach(function (write) {
         items.push({
           id: id,
           type: DOM_OPERATION_TYPES[write.type] || write.type,
@@ -64,11 +66,7 @@ function getExclusiveSummary(measurements) {
 
   for (var i = 0; i < measurements.length; i++) {
     var measurement = measurements[i];
-    var allIDs = assign(
-      {},
-      measurement.exclusive,
-      measurement.inclusive
-    );
+    var allIDs = assign({}, measurement.exclusive, measurement.inclusive);
 
     for (var id in allIDs) {
       displayName = measurement.displayNames[id].current;
@@ -103,7 +101,7 @@ function getExclusiveSummary(measurements) {
     }
   }
 
-  arr.sort(function(a, b) {
+  arr.sort(function (a, b) {
     return b.exclusive - a.exclusive;
   });
 
@@ -116,11 +114,7 @@ function getInclusiveSummary(measurements, onlyClean) {
 
   for (var i = 0; i < measurements.length; i++) {
     var measurement = measurements[i];
-    var allIDs = assign(
-      {},
-      measurement.exclusive,
-      measurement.inclusive
-    );
+    var allIDs = assign({}, measurement.exclusive, measurement.inclusive);
     var cleanComponents;
 
     if (onlyClean) {
@@ -162,7 +156,7 @@ function getInclusiveSummary(measurements, onlyClean) {
     }
   }
 
-  arr.sort(function(a, b) {
+  arr.sort(function (a, b) {
     return b.time - a.time;
   });
 
@@ -201,4 +195,4 @@ var ReactDefaultPerfAnalysis = {
   getTotalTime: getTotalTime
 };
 
-module.exports = ReactDefaultPerfAnalysis;
+module.exports = ReactDefaultPerfAnalysis;

package/lib/ReactElement.js

@@ -35,20 +35,15 @@ function defineWarningProperty(object, key) {
     configurable: false,
     enumerable: true,
 
-    get: function() {
+    get: function () {
       if (!this._store) {
         return null;
       }
       return this._store[key];
     },
 
-    set: function(value) {
-      ("production" !== process.env.NODE_ENV ? warning(
-        false,
-        'Don\'t set the %s property of the React element. Instead, ' +
-        'specify the correct value when initially creating the element.',
-        key
-      ) : null);
+    set: function (value) {
+      'production' !== process.env.NODE_ENV ? warning(false, 'Don\'t set the %s property of the React element. Instead, ' + 'specify the correct value when initially creating the element.', key) : null;
       this._store[key] = value;
     }
 
@@ -75,9 +70,7 @@ function defineMutationMembrane(prototype) {
       defineWarningProperty(prototype, key);
     }
     useMutationMembrane = true;
-  } catch (x) {
-    // IE will fail on defineProperty
-  }
+  } catch (x) {}
 }
 
 /**
@@ -90,7 +83,7 @@ function defineMutationMembrane(prototype) {
  * @param {*} props
  * @internal
  */
-var ReactElement = function(type, key, ref, owner, context, props) {
+var ReactElement = function (type, key, ref, owner, context, props) {
   // Built-in properties that belong on the element
   this.type = type;
   this.key = key;
@@ -99,30 +92,12 @@ var ReactElement = function(type, key, ref, owner, context, props) {
   // Record the component responsible for creating this element.
   this._owner = owner;
 
-  // TODO: Deprecate withContext, and then the context becomes accessible
-  // through the owner.
-  this._context = context;
-
-  if ("production" !== process.env.NODE_ENV) {
+  if ('production' !== process.env.NODE_ENV) {
     // The validation flag and props are currently mutative. We put them on
     // an external backing store so that we can freeze the whole object.
     // This can be replaced with a WeakMap once they are implemented in
     // commonly used development environments.
-    this._store = {props: props, originalProps: assign({}, props)};
-
-    // To make comparing ReactElements easier for testing purposes, we make
-    // the validation flag non-enumerable (where possible, which should
-    // include every environment we run tests in), so the test framework
-    // ignores it.
-    try {
-      Object.defineProperty(this._store, 'validated', {
-        configurable: false,
-        enumerable: false,
-        writable: true
-      });
-    } catch (x) {
-    }
-    this._store.validated = false;
+    this._store = { props: props, originalProps: assign({}, props) };
 
     // We're not allowed to set props directly on the object so we early
     // return and rely on the prototype membrane to forward to the backing
@@ -142,11 +117,11 @@ ReactElement.prototype = {
   _isReactElement: true
 };
 
-if ("production" !== process.env.NODE_ENV) {
+if ('production' !== process.env.NODE_ENV) {
   defineMutationMembrane(ReactElement.prototype);
 }
 
-ReactElement.createElement = function(type, config, children) {
+ReactElement.createElement = function (type, config, children) {
   var propName;
 
   // Reserved names are extracted
@@ -160,8 +135,7 @@ ReactElement.createElement = function(type, config, children) {
     key = config.key === undefined ? null : '' + config.key;
     // Remaining properties are added to a new props object
     for (propName in config) {
-      if (config.hasOwnProperty(propName) &&
-          !RESERVED_PROPS.hasOwnProperty(propName)) {
+      if (config.hasOwnProperty(propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
         props[propName] = config[propName];
       }
     }
@@ -174,6 +148,20 @@ ReactElement.createElement = function(type, config, children) {
     props.children = children;
   } else if (childrenLength > 1) {
     var childArray = Array(childrenLength);
+
+    // To make comparing ReactElements easier for testing purposes, we make
+    // the validation flag non-enumerable (where possible, which should
+    // include every environment we run tests in), so the test framework
+    // ignores it.
+    try {
+      Object.defineProperty(childArray, '_reactChildKeysValidated', {
+        configurable: false,
+        enumerable: false,
+        writable: true
+      });
+    } catch (x) {}
+    childArray._reactChildKeysValidated = true;
+
     for (var i = 0; i < childrenLength; i++) {
       childArray[i] = arguments[i + 2];
     }
@@ -190,20 +178,13 @@ ReactElement.createElement = function(type, config, children) {
     }
   }
 
-  return new ReactElement(
-    type,
-    key,
-    ref,
-    ReactCurrentOwner.current,
-    ReactContext.current,
-    props
-  );
+  return new ReactElement(type, key, ref, ReactCurrentOwner.current, ReactContext.current, props);
 };
 
-ReactElement.createFactory = function(type) {
+ReactElement.createFactory = function (type) {
   var factory = ReactElement.createElement.bind(null, type);
   // Expose the type on the factory and the prototype so that it can be
-  // easily accessed on elements. E.g. <Foo />.type === Foo.type.
+  // easily accessed on elements. E.g. `<Foo />.type === Foo`.
   // This should not be named `constructor` since this may not be the function
   // that created the element, and it may not even be a constructor.
   // Legacy hook TODO: Warn if this is accessed
@@ -211,24 +192,12 @@ ReactElement.createFactory = function(type) {
   return factory;
 };
 
-ReactElement.cloneAndReplaceProps = function(oldElement, newProps) {
-  var newElement = new ReactElement(
-    oldElement.type,
-    oldElement.key,
-    oldElement.ref,
-    oldElement._owner,
-    oldElement._context,
-    newProps
-  );
-
-  if ("production" !== process.env.NODE_ENV) {
-    // If the key on the original is valid, then the clone is valid
-    newElement._store.validated = oldElement._store.validated;
-  }
+ReactElement.cloneAndReplaceProps = function (oldElement, newProps) {
+  var newElement = new ReactElement(oldElement.type, oldElement.key, oldElement.ref, oldElement._owner, oldElement._context, newProps);
   return newElement;
 };
 
-ReactElement.cloneElement = function(element, config, children) {
+ReactElement.cloneElement = function (element, config, children) {
   var propName;
 
   // Original props are copied
@@ -252,8 +221,7 @@ ReactElement.cloneElement = function(element, config, children) {
     }
     // Remaining properties override existing props
     for (propName in config) {
-      if (config.hasOwnProperty(propName) &&
-          !RESERVED_PROPS.hasOwnProperty(propName)) {
+      if (config.hasOwnProperty(propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
         props[propName] = config[propName];
       }
     }
@@ -272,14 +240,7 @@ ReactElement.cloneElement = function(element, config, children) {
     props.children = childArray;
   }
 
-  return new ReactElement(
-    element.type,
-    key,
-    ref,
-    owner,
-    element._context,
-    props
-  );
+  return new ReactElement(element.type, key, ref, owner, element._context, props);
 };
 
 /**
@@ -287,7 +248,7 @@ ReactElement.cloneElement = function(element, config, children) {
  * @return {boolean} True if `object` is a valid component.
  * @final
  */
-ReactElement.isValidElement = function(object) {
+ReactElement.isValidElement = function (object) {
   // ReactTestUtils is often used outside of beforeEach where as React is
   // within it. This leads to two different instances of React on the same
   // page. To identify a element from a different React instance we use
@@ -302,3 +263,5 @@ ReactElement.isValidElement = function(object) {
 };
 
 module.exports = ReactElement;
+
+// IE will fail on defineProperty

package/lib/ReactElementValidator.js

@@ -76,9 +76,7 @@ function getName(instance) {
  */
 function getCurrentOwnerDisplayName() {
   var current = ReactCurrentOwner.current;
-  return (
-    current && getName(current) || undefined
-  );
+  return current && getName(current) || undefined;
 }
 
 /**
@@ -92,16 +90,10 @@ function getCurrentOwnerDisplayName() {
  * @param {*} parentType element's parent's type.
  */
 function validateExplicitKey(element, parentType) {
-  if (element._store.validated || element.key != null) {
+  if (element.key != null) {
     return;
   }
-  element._store.validated = true;
-
-  warnAndMonitorForKeyUse(
-    'Each child in an array or iterator should have a unique "key" prop.',
-    element,
-    parentType
-  );
+  warnAndMonitorForKeyUse('Each child in an array or iterator should have a unique "key" prop.', element, parentType);
 }
 
 /**
@@ -117,11 +109,7 @@ function validatePropertyKey(name, element, parentType) {
   if (!NUMERIC_PROPERTY_REGEX.test(name)) {
     return;
   }
-  warnAndMonitorForKeyUse(
-    'Child objects should have non-numeric keys so ordering is preserved.',
-    element,
-    parentType
-  );
+  warnAndMonitorForKeyUse('Child objects should have non-numeric keys so ordering is preserved.', element, parentType);
 }
 
 /**
@@ -134,42 +122,29 @@ function validatePropertyKey(name, element, parentType) {
  */
 function warnAndMonitorForKeyUse(message, element, parentType) {
   var ownerName = getCurrentOwnerDisplayName();
-  var parentName = typeof parentType === 'string' ?
-    parentType : parentType.displayName || parentType.name;
+  var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
 
   var useName = ownerName || parentName;
-  var memoizer = ownerHasKeyUseWarning[message] || (
-    (ownerHasKeyUseWarning[message] = {})
-  );
+  var memoizer = ownerHasKeyUseWarning[message] || (ownerHasKeyUseWarning[message] = {});
   if (memoizer.hasOwnProperty(useName)) {
     return;
   }
   memoizer[useName] = true;
 
-  var parentOrOwnerAddendum =
-    ownerName ? (" Check the render method of " + ownerName + ".") :
-    parentName ? (" Check the React.render call using <" + parentName + ">.") :
-    '';
+  var parentOrOwnerAddendum = ownerName ? ' Check the render method of ' + ownerName + '.' : parentName ? ' Check the React.render call using <' + parentName + '>.' : '';
 
   // Usually the current owner is the offender, but if it accepts children as a
   // property, it may be the creator of the child that's responsible for
   // assigning it a key.
   var childOwnerAddendum = '';
-  if (element &&
-      element._owner &&
-      element._owner !== ReactCurrentOwner.current) {
+  if (element && element._owner && element._owner !== ReactCurrentOwner.current) {
     // Name of the component that originally created this child.
     var childOwnerName = getName(element._owner);
 
-    childOwnerAddendum = (" It was passed a child from " + childOwnerName + ".");
+    childOwnerAddendum = ' It was passed a child from ' + childOwnerName + '.';
   }
 
-  ("production" !== process.env.NODE_ENV ? warning(
-    false,
-    message + '%s%s See https://fb.me/react-warning-keys for more information.',
-    parentOrOwnerAddendum,
-    childOwnerAddendum
-  ) : null);
+  'production' !== process.env.NODE_ENV ? warning(false, message + '%s%s See https://fb.me/react-warning-keys for more information.', parentOrOwnerAddendum, childOwnerAddendum) : null;
 }
 
 /**
@@ -183,15 +158,22 @@ function warnAndMonitorForKeyUse(message, element, parentType) {
  */
 function validateChildKeys(node, parentType) {
   if (Array.isArray(node)) {
+    if (node._reactChildKeysValidated) {
+      // All child elements were passed in a valid location.
+      return;
+    }
     for (var i = 0; i < node.length; i++) {
       var child = node[i];
       if (ReactElement.isValidElement(child)) {
         validateExplicitKey(child, parentType);
+      } else {
+        // TODO: Warn on unkeyed arrays and suggest using createFragment
+        validateChildKeys(child, parentType);
       }
     }
-  } else if (ReactElement.isValidElement(node)) {
+  } else if (typeof node === 'string' || typeof node === 'number' || ReactElement.isValidElement(node)) {
     // This element was passed in a valid location.
-    node._store.validated = true;
+    return;
   } else if (node) {
     var iteratorFn = getIteratorFn(node);
     // Entry iterators provide implicit keys.
@@ -202,6 +184,8 @@ function validateChildKeys(node, parentType) {
         while (!(step = iterator.next()).done) {
           if (ReactElement.isValidElement(step.value)) {
             validateExplicitKey(step.value, parentType);
+          } else {
+            validateChildKeys(step.value, parentType);
           }
         }
       }
@@ -210,6 +194,7 @@ function validateChildKeys(node, parentType) {
       for (var key in fragment) {
         if (fragment.hasOwnProperty(key)) {
           validatePropertyKey(key, fragment[key], parentType);
+          validateChildKeys(fragment[key], parentType);
         }
       }
     }
@@ -235,25 +220,19 @@ function checkPropTypes(componentName, propTypes, props, location) {
       try {
         // This is intentionally an invariant that gets caught. It's the same
         // behavior as without this statement except with a better message.
-        ("production" !== process.env.NODE_ENV ? invariant(
-          typeof propTypes[propName] === 'function',
-          '%s: %s type `%s` is invalid; it must be a function, usually from ' +
-          'React.PropTypes.',
-          componentName || 'React class',
-          ReactPropTypeLocationNames[location],
-          propName
-        ) : invariant(typeof propTypes[propName] === 'function'));
+        'production' !== process.env.NODE_ENV ? invariant(typeof propTypes[propName] === 'function', '%s: %s type `%s` is invalid; it must be a function, usually from ' + 'React.PropTypes.', componentName || 'React class', ReactPropTypeLocationNames[location], propName) : invariant(typeof propTypes[propName] === 'function');
         error = propTypes[propName](props, propName, componentName, location);
       } catch (ex) {
         error = ex;
       }
+      'production' !== process.env.NODE_ENV ? warning(!error || error instanceof Error, '%s: type specification of %s `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', ReactPropTypeLocationNames[location], propName, typeof error) : null;
       if (error instanceof Error && !(error.message in loggedTypeFailures)) {
         // Only monitor this failure once because there tends to be a lot of the
         // same error.
         loggedTypeFailures[error.message] = true;
 
-        var addendum = getDeclarationErrorAddendum(this);
-        ("production" !== process.env.NODE_ENV ? warning(false, 'Failed propType: %s%s', error.message, addendum) : null);
+        var addendum = getDeclarationErrorAddendum();
+        'production' !== process.env.NODE_ENV ? warning(false, 'Failed propType: %s%s', error.message, addendum) : null;
       }
     }
   }
@@ -270,8 +249,7 @@ var warnedPropsMutations = {};
 function warnForPropsMutation(propName, element) {
   var type = element.type;
   var elementName = typeof type === 'string' ? type : type.displayName;
-  var ownerName = element._owner ?
-    element._owner.getPublicInstance().constructor.displayName : null;
+  var ownerName = element._owner ? element._owner.getPublicInstance().constructor.displayName : null;
 
   var warningKey = propName + '|' + elementName + '|' + ownerName;
   if (warnedPropsMutations.hasOwnProperty(warningKey)) {
@@ -288,15 +266,7 @@ function warnForPropsMutation(propName, element) {
     ownerInfo = ' The element was created by ' + ownerName + '.';
   }
 
-  ("production" !== process.env.NODE_ENV ? warning(
-    false,
-    'Don\'t set .props.%s of the React component%s. Instead, specify the ' +
-    'correct value when initially creating the element or use ' +
-    'React.cloneElement to make a new element with updated props.%s',
-    propName,
-    elementInfo,
-    ownerInfo
-  ) : null);
+  'production' !== process.env.NODE_ENV ? warning(false, 'Don\'t set .props.%s of the React component%s. Instead, specify the ' + 'correct value when initially creating the element or use ' + 'React.cloneElement to make a new element with updated props.%s', propName, elementInfo, ownerInfo) : null;
 }
 
 // Inline Object.is polyfill
@@ -332,8 +302,7 @@ function checkAndWarnForMutatedProps(element) {
 
   for (var propName in props) {
     if (props.hasOwnProperty(propName)) {
-      if (!originalProps.hasOwnProperty(propName) ||
-          !is(originalProps[propName], props[propName])) {
+      if (!originalProps.hasOwnProperty(propName) || !is(originalProps[propName], props[propName])) {
         warnForPropsMutation(propName, element);
 
         // Copy over the new value so that the two props objects match again
@@ -350,7 +319,7 @@ function checkAndWarnForMutatedProps(element) {
  * @param {ReactElement} element
  */
 function validatePropTypes(element) {
-  if (element.type == null) {
+  if (!(typeof element.type === 'string' || typeof element.type === 'function')) {
     // This has already warned. Don't throw.
     return;
   }
@@ -358,24 +327,13 @@ function validatePropTypes(element) {
   // to a composite class which may have propTypes.
   // TODO: Validating a string's propTypes is not decoupled from the
   // rendering target which is problematic.
-  var componentClass = ReactNativeComponent.getComponentClassForElement(
-    element
-  );
+  var componentClass = ReactNativeComponent.getComponentClassForElement(element);
   var name = componentClass.displayName || componentClass.name;
   if (componentClass.propTypes) {
-    checkPropTypes(
-      name,
-      componentClass.propTypes,
-      element.props,
-      ReactPropTypeLocations.prop
-    );
+    checkPropTypes(name, componentClass.propTypes, element.props, ReactPropTypeLocations.prop);
   }
   if (typeof componentClass.getDefaultProps === 'function') {
-    ("production" !== process.env.NODE_ENV ? warning(
-      componentClass.getDefaultProps.isReactClassApproved,
-      'getDefaultProps is only used on classic React.createClass ' +
-      'definitions. Use a static property named `defaultProps` instead.'
-    ) : null);
+    'production' !== process.env.NODE_ENV ? warning(componentClass.getDefaultProps.isReactClassApproved, 'getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.') : null;
   }
 }
 
@@ -383,15 +341,10 @@ var ReactElementValidator = {
 
   checkAndWarnForMutatedProps: checkAndWarnForMutatedProps,
 
-  createElement: function(type, props, children) {
+  createElement: function (type, props, children) {
     // We warn in this case but don't throw. We expect the element creation to
     // succeed and there will likely be errors in render.
-    ("production" !== process.env.NODE_ENV ? warning(
-      type != null,
-      'React.createElement: type should not be null or undefined. It should ' +
-        'be a string (for DOM elements) or a ReactClass (for composite ' +
-        'components).'
-    ) : null);
+    'production' !== process.env.NODE_ENV ? warning(typeof type === 'string' || typeof type === 'function', 'React.createElement: type should not be null, undefined, boolean, or ' + 'number. It should be a string (for DOM elements) or a ReactClass ' + '(for composite components).%s', getDeclarationErrorAddendum()) : null;
 
     var element = ReactElement.createElement.apply(this, arguments);
 
@@ -410,44 +363,30 @@ var ReactElementValidator = {
     return element;
   },
 
-  createFactory: function(type) {
-    var validatedFactory = ReactElementValidator.createElement.bind(
-      null,
-      type
-    );
+  createFactory: function (type) {
+    var validatedFactory = ReactElementValidator.createElement.bind(null, type);
     // Legacy hook TODO: Warn if this is accessed
     validatedFactory.type = type;
 
-    if ("production" !== process.env.NODE_ENV) {
+    if ('production' !== process.env.NODE_ENV) {
       try {
-        Object.defineProperty(
-          validatedFactory,
-          'type',
-          {
-            enumerable: false,
-            get: function() {
-              ("production" !== process.env.NODE_ENV ? warning(
-                false,
-                'Factory.type is deprecated. Access the class directly ' +
-                'before passing it to createFactory.'
-              ) : null);
-              Object.defineProperty(this, 'type', {
-                value: type
-              });
-              return type;
-            }
+        Object.defineProperty(validatedFactory, 'type', {
+          enumerable: false,
+          get: function () {
+            'production' !== process.env.NODE_ENV ? warning(false, 'Factory.type is deprecated. Access the class directly ' + 'before passing it to createFactory.') : null;
+            Object.defineProperty(this, 'type', {
+              value: type
+            });
+            return type;
           }
-        );
-      } catch (x) {
-        // IE will fail on defineProperty (es5-shim/sham too)
-      }
+        });
+      } catch (x) {}
     }
 
-
     return validatedFactory;
   },
 
-  cloneElement: function(element, props, children) {
+  cloneElement: function (element, props, children) {
     var newElement = ReactElement.cloneElement.apply(this, arguments);
     for (var i = 2; i < arguments.length; i++) {
       validateChildKeys(arguments[i], newElement.type);
@@ -459,3 +398,5 @@ var ReactElementValidator = {
 };
 
 module.exports = ReactElementValidator;
+
+// IE will fail on defineProperty (es5-shim/sham too)