react 0.14.0-alpha2 → 0.14.0-beta3

package/lib/ReactRef.js

@@ -11,7 +11,7 @@
 
 'use strict';
 
-var ReactOwner = require("./ReactOwner");
+var ReactOwner = require('./ReactOwner');
 
 var ReactRef = {};
 

package/lib/ReactServerBatchingStrategy.js

@@ -0,0 +1,23 @@
+/**
+ * Copyright 2014-2015, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule ReactServerBatchingStrategy
+ * @typechecks
+ */
+
+'use strict';
+
+var ReactServerBatchingStrategy = {
+  isBatchingUpdates: false,
+  batchedUpdates: function (callback) {
+    // Don't do anything here. During the server rendering we don't want to
+    // schedule any updates. We will simply ignore them.
+  }
+};
+
+module.exports = ReactServerBatchingStrategy;

package/lib/ReactServerRendering.js

@@ -11,24 +11,29 @@
  */
 'use strict';
 
-var ReactElement = require("./ReactElement");
-var ReactInstanceHandles = require("./ReactInstanceHandles");
-var ReactMarkupChecksum = require("./ReactMarkupChecksum");
-var ReactServerRenderingTransaction = require("./ReactServerRenderingTransaction");
+var ReactDefaultBatchingStrategy = require('./ReactDefaultBatchingStrategy');
+var ReactElement = require('./ReactElement');
+var ReactInstanceHandles = require('./ReactInstanceHandles');
+var ReactMarkupChecksum = require('./ReactMarkupChecksum');
+var ReactServerBatchingStrategy = require('./ReactServerBatchingStrategy');
+var ReactServerRenderingTransaction = require('./ReactServerRenderingTransaction');
+var ReactUpdates = require('./ReactUpdates');
 
-var emptyObject = require("./emptyObject");
-var instantiateReactComponent = require("./instantiateReactComponent");
-var invariant = require("./invariant");
+var emptyObject = require('fbjs/lib/emptyObject');
+var instantiateReactComponent = require('./instantiateReactComponent');
+var invariant = require('fbjs/lib/invariant');
 
 /**
  * @param {ReactElement} element
  * @return {string} the HTML markup
  */
 function renderToString(element) {
-  'production' !== process.env.NODE_ENV ? invariant(ReactElement.isValidElement(element), 'renderToString(): You must pass a valid ReactElement.') : invariant(ReactElement.isValidElement(element));
+  !ReactElement.isValidElement(element) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'renderToString(): You must pass a valid ReactElement.') : invariant(false) : undefined;
 
   var transaction;
   try {
+    ReactUpdates.injection.injectBatchingStrategy(ReactServerBatchingStrategy);
+
     var id = ReactInstanceHandles.createReactRootID();
     transaction = ReactServerRenderingTransaction.getPooled(false);
 
@@ -39,6 +44,9 @@ function renderToString(element) {
     }, null);
   } finally {
     ReactServerRenderingTransaction.release(transaction);
+    // Revert to the DOM batching strategy since these two renderers
+    // currently share these stateful modules.
+    ReactUpdates.injection.injectBatchingStrategy(ReactDefaultBatchingStrategy);
   }
 }
 
@@ -48,10 +56,12 @@ function renderToString(element) {
  * (for generating static pages)
  */
 function renderToStaticMarkup(element) {
-  'production' !== process.env.NODE_ENV ? invariant(ReactElement.isValidElement(element), 'renderToStaticMarkup(): You must pass a valid ReactElement.') : invariant(ReactElement.isValidElement(element));
+  !ReactElement.isValidElement(element) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'renderToStaticMarkup(): You must pass a valid ReactElement.') : invariant(false) : undefined;
 
   var transaction;
   try {
+    ReactUpdates.injection.injectBatchingStrategy(ReactServerBatchingStrategy);
+
     var id = ReactInstanceHandles.createReactRootID();
     transaction = ReactServerRenderingTransaction.getPooled(true);
 
@@ -61,6 +71,9 @@ function renderToStaticMarkup(element) {
     }, null);
   } finally {
     ReactServerRenderingTransaction.release(transaction);
+    // Revert to the DOM batching strategy since these two renderers
+    // currently share these stateful modules.
+    ReactUpdates.injection.injectBatchingStrategy(ReactDefaultBatchingStrategy);
   }
 }
 

package/lib/ReactServerRenderingTransaction.js

@@ -12,12 +12,12 @@
 
 'use strict';
 
-var PooledClass = require("./PooledClass");
-var CallbackQueue = require("./CallbackQueue");
-var Transaction = require("./Transaction");
+var PooledClass = require('./PooledClass');
+var CallbackQueue = require('./CallbackQueue');
+var Transaction = require('./Transaction');
 
-var assign = require("./Object.assign");
-var emptyFunction = require("./emptyFunction");
+var assign = require('./Object.assign');
+var emptyFunction = require('fbjs/lib/emptyFunction');
 
 /**
  * Provides a `CallbackQueue` queue for collecting `onDOMReady` callbacks
@@ -56,7 +56,7 @@ var Mixin = {
    * @see Transaction
    * @abstract
    * @final
-   * @return {array} Empty list of operation wrap proceedures.
+   * @return {array} Empty list of operation wrap procedures.
    */
   getTransactionWrappers: function () {
     return TRANSACTION_WRAPPERS;
@@ -71,7 +71,7 @@ var Mixin = {
 
   /**
    * `PooledClass` looks for this, and will invoke this before allowing this
-   * instance to be resused.
+   * instance to be reused.
    */
   destructor: function () {
     CallbackQueue.release(this.reactMountReady);

package/lib/ReactTestUtils.js

@@ -11,23 +11,24 @@
 
 'use strict';
 
-var EventConstants = require("./EventConstants");
-var EventPluginHub = require("./EventPluginHub");
-var EventPropagators = require("./EventPropagators");
-var React = require("./React");
-var ReactElement = require("./ReactElement");
-var ReactEmptyComponent = require("./ReactEmptyComponent");
-var ReactBrowserEventEmitter = require("./ReactBrowserEventEmitter");
-var ReactCompositeComponent = require("./ReactCompositeComponent");
-var ReactInstanceHandles = require("./ReactInstanceHandles");
-var ReactInstanceMap = require("./ReactInstanceMap");
-var ReactMount = require("./ReactMount");
-var ReactUpdates = require("./ReactUpdates");
-var SyntheticEvent = require("./SyntheticEvent");
-
-var assign = require("./Object.assign");
-var emptyObject = require("./emptyObject");
-var findDOMNode = require("./findDOMNode");
+var EventConstants = require('./EventConstants');
+var EventPluginHub = require('./EventPluginHub');
+var EventPropagators = require('./EventPropagators');
+var React = require('./React');
+var ReactElement = require('./ReactElement');
+var ReactEmptyComponent = require('./ReactEmptyComponent');
+var ReactBrowserEventEmitter = require('./ReactBrowserEventEmitter');
+var ReactCompositeComponent = require('./ReactCompositeComponent');
+var ReactInstanceHandles = require('./ReactInstanceHandles');
+var ReactInstanceMap = require('./ReactInstanceMap');
+var ReactMount = require('./ReactMount');
+var ReactUpdates = require('./ReactUpdates');
+var SyntheticEvent = require('./SyntheticEvent');
+
+var assign = require('./Object.assign');
+var emptyObject = require('fbjs/lib/emptyObject');
+var findDOMNode = require('./findDOMNode');
+var invariant = require('fbjs/lib/invariant');
 
 var topLevelTypes = EventConstants.topLevelTypes;
 
@@ -37,6 +38,27 @@ function Event(suffix) {}
  * @class ReactTestUtils
  */
 
+function findAllInRenderedTreeInternal(inst, test) {
+  if (!inst || !inst.getPublicInstance) {
+    return [];
+  }
+  var publicInst = inst.getPublicInstance();
+  var ret = test(publicInst) ? [publicInst] : [];
+  if (ReactTestUtils.isDOMComponent(publicInst)) {
+    var renderedChildren = inst._renderedChildren;
+    var key;
+    for (key in renderedChildren) {
+      if (!renderedChildren.hasOwnProperty(key)) {
+        continue;
+      }
+      ret = ret.concat(findAllInRenderedTreeInternal(renderedChildren[key], test));
+    }
+  } else if (ReactTestUtils.isCompositeComponent(publicInst)) {
+    ret = ret.concat(findAllInRenderedTreeInternal(inst._renderedComponent, test));
+  }
+  return ret;
+}
+
 /**
  * Todo: Support the entire DOM.scry query syntax. For now, these simple
  * utilities will suffice for testing purposes.
@@ -64,7 +86,7 @@ var ReactTestUtils = {
   isDOMComponent: function (inst) {
     // TODO: Fix this heuristic. It's just here because composites can currently
     // pretend to be DOM components.
-    return !!(inst && inst.tagName && inst.getDOMNode);
+    return !!(inst && inst.nodeType === 1 && inst.tagName);
   },
 
   isDOMComponentElement: function (inst) {
@@ -72,11 +94,22 @@ var ReactTestUtils = {
   },
 
   isCompositeComponent: function (inst) {
+    if (ReactTestUtils.isDOMComponent(inst)) {
+      // Accessing inst.setState warns; just return false as that'll be what
+      // this returns when we have DOM nodes as refs directly
+      return false;
+    }
     return typeof inst.render === 'function' && typeof inst.setState === 'function';
   },
 
   isCompositeComponentWithType: function (inst, type) {
-    return !!(ReactTestUtils.isCompositeComponent(inst) && inst.constructor === type);
+    if (!ReactTestUtils.isCompositeComponent(inst)) {
+      return false;
+    }
+    var internalInstance = ReactInstanceMap.get(inst);
+    var constructor = internalInstance._currentElement.type;
+
+    return constructor === type;
   },
 
   isCompositeComponentElement: function (inst) {
@@ -90,7 +123,10 @@ var ReactTestUtils = {
   },
 
   isCompositeComponentElementWithType: function (inst, type) {
-    return !!(ReactTestUtils.isCompositeComponentElement(inst) && inst.constructor === type);
+    var internalInstance = ReactInstanceMap.get(inst);
+    var constructor = internalInstance._currentElement.type;
+
+    return !!(ReactTestUtils.isCompositeComponentElement(inst) && constructor === type);
   },
 
   getRenderedChildOfCompositeComponent: function (inst) {
@@ -105,35 +141,22 @@ var ReactTestUtils = {
     if (!inst) {
       return [];
     }
-    var ret = test(inst) ? [inst] : [];
-    if (ReactTestUtils.isDOMComponent(inst)) {
-      var internalInstance = ReactInstanceMap.get(inst);
-      var renderedChildren = internalInstance._renderedComponent._renderedChildren;
-      var key;
-      for (key in renderedChildren) {
-        if (!renderedChildren.hasOwnProperty(key)) {
-          continue;
-        }
-        if (!renderedChildren[key].getPublicInstance) {
-          continue;
-        }
-        ret = ret.concat(ReactTestUtils.findAllInRenderedTree(renderedChildren[key].getPublicInstance(), test));
-      }
-    } else if (ReactTestUtils.isCompositeComponent(inst)) {
-      ret = ret.concat(ReactTestUtils.findAllInRenderedTree(ReactTestUtils.getRenderedChildOfCompositeComponent(inst), test));
-    }
-    return ret;
+    !ReactTestUtils.isCompositeComponent(inst) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'findAllInRenderedTree(...): instance must be a composite component') : invariant(false) : undefined;
+    return findAllInRenderedTreeInternal(ReactInstanceMap.get(inst), test);
   },
 
   /**
    * Finds all instance of components in the rendered tree that are DOM
    * components with the class name matching `className`.
-   * @return an array of all the matches.
+   * @return {array} an array of all the matches.
    */
   scryRenderedDOMComponentsWithClass: function (root, className) {
     return ReactTestUtils.findAllInRenderedTree(root, function (inst) {
-      var instClassName = inst.props.className;
-      return ReactTestUtils.isDOMComponent(inst) && (instClassName && (' ' + instClassName + ' ').indexOf(' ' + className + ' ') !== -1);
+      if (ReactTestUtils.isDOMComponent(inst)) {
+        var instClassName = React.findDOMNode(inst).className;
+        return instClassName && ('' + instClassName).split(/\s+/).indexOf(className) !== -1;
+      }
+      return false;
     });
   },
 
@@ -154,11 +177,11 @@ var ReactTestUtils = {
   /**
    * Finds all instance of components in the rendered tree that are DOM
    * components with the tag name matching `tagName`.
-   * @return an array of all the matches.
+   * @return {array} an array of all the matches.
    */
   scryRenderedDOMComponentsWithTag: function (root, tagName) {
     return ReactTestUtils.findAllInRenderedTree(root, function (inst) {
-      return ReactTestUtils.isDOMComponent(inst) && inst.tagName === tagName.toUpperCase();
+      return ReactTestUtils.isDOMComponent(inst) && inst.tagName.toUpperCase() === tagName.toUpperCase();
     });
   },
 
@@ -178,7 +201,7 @@ var ReactTestUtils = {
 
   /**
    * Finds all instances of components with type equal to `componentType`.
-   * @return an array of all the matches.
+   * @return {array} an array of all the matches.
    */
   scryRenderedComponentsWithType: function (root, componentType) {
     return ReactTestUtils.findAllInRenderedTree(root, function (inst) {
@@ -195,7 +218,7 @@ var ReactTestUtils = {
   findRenderedComponentWithType: function (root, componentType) {
     var all = ReactTestUtils.scryRenderedComponentsWithType(root, componentType);
     if (all.length !== 1) {
-      throw new Error('Did not find exactly one match for componentType:' + componentType);
+      throw new Error('Did not find exactly one match for componentType:' + componentType + ' (found ' + all.length + ')');
     }
     return all[0];
   },
@@ -226,7 +249,7 @@ var ReactTestUtils = {
   /**
    * Simulates a top level event being dispatched from a raw event that occured
    * on an `Element` node.
-   * @param topLevelType {Object} A type from `EventConstants.topLevelTypes`
+   * @param {Object} topLevelType A type from `EventConstants.topLevelTypes`
    * @param {!Element} node The dom to simulate an event occurring on.
    * @param {?Event} fakeNativeEvent Fake native event to use in SyntheticEvent.
    */
@@ -238,8 +261,8 @@ var ReactTestUtils = {
   /**
    * Simulates a top level event being dispatched from a raw event that occured
    * on the `ReactDOMComponent` `comp`.
-   * @param topLevelType {Object} A type from `EventConstants.topLevelTypes`.
-   * @param comp {!ReactDOMComponent}
+   * @param {Object} topLevelType A type from `EventConstants.topLevelTypes`.
+   * @param {!ReactDOMComponent} comp
    * @param {?Event} fakeNativeEvent Fake native event to use in SyntheticEvent.
    */
   simulateNativeEventOnDOMComponent: function (topLevelType, comp, fakeNativeEvent) {
@@ -314,7 +337,9 @@ ReactShallowRenderer.prototype.unmount = function () {
 };
 
 ReactShallowRenderer.prototype._render = function (element, transaction, context) {
-  if (!this._instance) {
+  if (this._instance) {
+    this._instance.receiveComponent(element, transaction, context);
+  } else {
     var rootID = ReactInstanceHandles.createReactRootID();
     var instance = new ShallowComponentWrapper(element.type);
     instance.construct(element);
@@ -322,8 +347,6 @@ ReactShallowRenderer.prototype._render = function (element, transaction, context
     instance.mountComponent(rootID, transaction, context);
 
     this._instance = instance;
-  } else {
-    this._instance.receiveComponent(element, transaction, context);
   }
 };
 
@@ -350,7 +373,7 @@ function makeSimulator(eventType) {
     fakeNativeEvent.target = node;
     // We don't use SyntheticEvent.getPooled in order to not have to worry about
     // properly destroying any properties assigned from `eventData` upon release
-    var event = new SyntheticEvent(dispatchConfig, ReactMount.getID(node), fakeNativeEvent);
+    var event = new SyntheticEvent(dispatchConfig, ReactMount.getID(node), fakeNativeEvent, node);
     assign(event, eventData);
 
     if (dispatchConfig.phasedRegistrationNames) {
@@ -372,7 +395,7 @@ function buildSimulators() {
   var eventType;
   for (eventType in ReactBrowserEventEmitter.eventNameDispatchConfigs) {
     /**
-     * @param {!Element || ReactDOMComponent} domComponentOrNode
+     * @param {!Element|ReactDOMComponent} domComponentOrNode
      * @param {?object} eventData Fake event data to use in SyntheticEvent.
      */
     ReactTestUtils.Simulate[eventType] = makeSimulator(eventType);
@@ -415,22 +438,21 @@ function makeNativeSimulator(eventType) {
     assign(fakeNativeEvent, nativeEventData);
     if (ReactTestUtils.isDOMComponent(domComponentOrNode)) {
       ReactTestUtils.simulateNativeEventOnDOMComponent(eventType, domComponentOrNode, fakeNativeEvent);
-    } else if (!!domComponentOrNode.tagName) {
+    } else if (domComponentOrNode.tagName) {
       // Will allow on actual dom nodes.
       ReactTestUtils.simulateNativeEventOnNode(eventType, domComponentOrNode, fakeNativeEvent);
     }
   };
 }
 
-var eventType;
-for (eventType in topLevelTypes) {
+Object.keys(topLevelTypes).forEach(function (eventType) {
   // Event type is stored as 'topClick' - we transform that to 'click'
   var convenienceName = eventType.indexOf('top') === 0 ? eventType.charAt(3).toLowerCase() + eventType.substr(4) : eventType;
   /**
-   * @param {!Element || ReactDOMComponent} domComponentOrNode
+   * @param {!Element|ReactDOMComponent} domComponentOrNode
    * @param {?Event} nativeEventData Fake native event to use in SyntheticEvent.
    */
   ReactTestUtils.SimulateNative[convenienceName] = makeNativeSimulator(eventType);
-}
+});
 
 module.exports = ReactTestUtils;

package/lib/ReactTransitionChildMapping.js

@@ -12,8 +12,8 @@
 
 'use strict';
 
-var ReactChildren = require("./ReactChildren");
-var ReactFragment = require("./ReactFragment");
+var ReactChildren = require('./ReactChildren');
+var ReactFragment = require('./ReactFragment');
 
 var ReactTransitionChildMapping = {
   /**

package/lib/ReactTransitionEvents.js

@@ -11,7 +11,7 @@
 
 'use strict';
 
-var ExecutionEnvironment = require("./ExecutionEnvironment");
+var ExecutionEnvironment = require('fbjs/lib/ExecutionEnvironment');
 
 /**
  * EVENT_NAME_MAP is used to determine which event fired when a

package/lib/ReactTransitionGroup.js

@@ -11,12 +11,11 @@
 
 'use strict';
 
-var React = require("./React");
-var ReactTransitionChildMapping = require("./ReactTransitionChildMapping");
+var React = require('./React');
+var ReactTransitionChildMapping = require('./ReactTransitionChildMapping');
 
-var assign = require("./Object.assign");
-var cloneWithProps = require("./cloneWithProps");
-var emptyFunction = require("./emptyFunction");
+var assign = require('./Object.assign');
+var emptyFunction = require('fbjs/lib/emptyFunction');
 
 var ReactTransitionGroup = React.createClass({
   displayName: 'ReactTransitionGroup',
@@ -196,7 +195,7 @@ var ReactTransitionGroup = React.createClass({
         // already been removed. In case you need this behavior you can provide
         // a childFactory function to wrap every child, even the ones that are
         // leaving.
-        childrenToRender.push(cloneWithProps(this.props.childFactory(child), { ref: key, key: key }));
+        childrenToRender.push(React.cloneElement(this.props.childFactory(child), { ref: key, key: key }));
       }
     }
     return React.createElement(this.props.component, this.props, childrenToRender);