react 15.0.3-alpha.1 → 15.2.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react-with-addons.js +3311 -2007
- package/dist/react-with-addons.min.js +7 -6
- package/dist/react.js +2734 -2014
- package/dist/react.min.js +6 -6
- package/lib/CSSPropertyOperations.js +5 -5
- package/lib/CallbackQueue.js +3 -2
- package/lib/DOMChildrenOperations.js +42 -7
- package/lib/DOMLazyTree.js +18 -5
- package/lib/DOMProperty.js +6 -4
- package/lib/DOMPropertyOperations.js +35 -12
- package/lib/Danger.js +10 -8
- package/lib/DisabledInputUtils.js +5 -5
- package/lib/EventPluginHub.js +8 -2
- package/lib/EventPluginRegistry.js +13 -7
- package/lib/EventPluginUtils.js +3 -1
- package/lib/HTMLDOMPropertyConfig.js +1 -2
- package/lib/LinkedStateMixin.js +1 -0
- package/lib/LinkedValueUtils.js +5 -3
- package/lib/NativeMethodsMixin.js +6 -4
- package/lib/PooledClass.js +3 -1
- package/lib/React.js +1 -1
- package/lib/ReactCSSTransitionGroup.js +5 -0
- package/lib/ReactCSSTransitionGroupChild.js +15 -8
- package/lib/ReactChildReconciler.js +15 -6
- package/lib/ReactChildren.js +9 -1
- package/lib/ReactClass.js +15 -13
- package/lib/ReactComponent.js +3 -6
- package/lib/ReactComponentBrowserEnvironment.js +0 -5
- package/lib/ReactComponentEnvironment.js +3 -1
- package/lib/ReactComponentTreeDevtool.js +223 -0
- package/lib/ReactComponentTreeTestUtils.js +87 -0
- package/lib/ReactComponentWithPureRenderMixin.js +2 -0
- package/lib/ReactCompositeComponent.js +208 -119
- package/lib/ReactDOM.js +3 -6
- package/lib/ReactDOMButton.js +2 -2
- package/lib/ReactDOMComponent.js +165 -71
- package/lib/ReactDOMComponentTree.js +23 -21
- package/lib/ReactDOMDebugTool.js +7 -1
- package/lib/ReactDOMEmptyComponent.js +9 -9
- package/lib/ReactDOMFactories.js +1 -1
- package/lib/ReactDOMIDOperations.js +0 -5
- package/lib/ReactDOMInput.js +57 -19
- package/lib/ReactDOMOption.js +40 -26
- package/lib/ReactDOMSelect.js +3 -3
- package/lib/ReactDOMTextComponent.js +28 -26
- package/lib/ReactDOMTextarea.js +59 -32
- package/lib/ReactDOMTreeTraversal.js +18 -16
- package/lib/ReactDOMUnknownPropertyDevtool.js +41 -15
- package/lib/ReactDebugTool.js +250 -11
- package/lib/ReactDefaultInjection.js +2 -11
- package/lib/ReactElement.js +90 -25
- package/lib/ReactElementValidator.js +26 -81
- package/lib/ReactEventListener.js +2 -2
- package/lib/ReactFragment.js +8 -3
- package/lib/{ReactNativeComponent.js → ReactHostComponent.js} +10 -29
- package/lib/ReactHostOperationHistoryDevtool.js +37 -0
- package/lib/ReactInjection.js +2 -4
- package/lib/ReactInstanceHandles.js +8 -6
- package/lib/ReactLink.js +3 -0
- package/lib/ReactMount.js +43 -20
- package/lib/ReactMultiChild.js +51 -8
- package/lib/ReactNativeAttributePayload.js +5 -2
- package/lib/ReactNativeBaseComponent.js +7 -7
- package/lib/ReactNativeBridgeEventPlugin.js +1 -1
- package/lib/ReactNativeComponentTree.js +8 -6
- package/lib/ReactNativeDOMIDOperations.js +4 -8
- package/lib/ReactNativeDefaultInjection.js +9 -7
- package/lib/ReactNativeGlobalResponderHandler.js +1 -1
- package/lib/ReactNativeMount.js +25 -8
- package/lib/ReactNativeTagHandles.js +3 -1
- package/lib/ReactNativeTextComponent.js +18 -9
- package/lib/ReactNativeTreeTraversal.js +11 -11
- package/lib/ReactNodeTypes.js +5 -3
- package/lib/ReactNoop.js +76 -0
- package/lib/ReactOwner.js +4 -2
- package/lib/ReactPerf.js +473 -75
- package/lib/ReactPropTypes.js +23 -0
- package/lib/ReactReconcileTransaction.js +1 -1
- package/lib/ReactReconciler.js +57 -11
- package/lib/ReactServerRendering.js +24 -3
- package/lib/ReactServerRenderingTransaction.js +5 -1
- package/lib/ReactSimpleEmptyComponent.js +4 -4
- package/lib/ReactTestMount.js +126 -0
- package/lib/ReactTestReconcileTransaction.js +100 -0
- package/lib/ReactTestRenderer.js +133 -0
- package/lib/ReactTestUtils.js +25 -10
- package/lib/ReactTransitionChildMapping.js +7 -1
- package/lib/ReactTransitionGroup.js +44 -5
- package/lib/ReactUpdateQueue.js +9 -1
- package/lib/ReactUpdates.js +30 -11
- package/lib/ReactVersion.js +1 -1
- package/lib/ReactWithAddons.js +1 -1
- package/lib/ResponderEventPlugin.js +8 -6
- package/lib/ResponderTouchHistoryStore.js +6 -4
- package/lib/SimpleEventPlugin.js +3 -1
- package/lib/SyntheticEvent.js +2 -3
- package/lib/SyntheticUIEvent.js +1 -1
- package/lib/Transaction.js +4 -2
- package/lib/accumulate.js +3 -1
- package/lib/accumulateInto.js +3 -1
- package/lib/checkReactTypeSpec.js +71 -0
- package/lib/createReactNativeComponentClass.js +2 -2
- package/lib/dangerousStyleValue.js +3 -1
- package/lib/escapeTextContentForBrowser.js +96 -12
- package/lib/findDOMNode.js +8 -4
- package/lib/findNodeHandle.js +5 -3
- package/lib/flattenChildren.js +13 -4
- package/lib/{getNativeComponentFromComposite.js → getHostComponentFromComposite.js} +4 -4
- package/lib/instantiateReactComponent.js +44 -10
- package/lib/onlyChild.js +10 -5
- package/lib/reactComponentExpect.js +3 -3
- package/lib/reactProdInvariant.js +38 -0
- package/lib/setInnerHTML.js +17 -1
- package/lib/setTextContent.js +8 -0
- package/lib/shallowCompare.js +1 -0
- package/lib/traverseAllChildren.js +3 -1
- package/lib/update.js +16 -11
- package/package.json +2 -2
- package/lib/MetaMatchers.js +0 -118
- package/lib/ReactDebugInstanceMap.js +0 -102
- package/lib/ReactDefaultPerf.js +0 -316
- package/lib/ReactDefaultPerfAnalysis.js +0 -210
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright 2013-present, Facebook, Inc.
|
|
3
|
+
* All rights reserved.
|
|
4
|
+
*
|
|
5
|
+
* This source code is licensed under the BSD-style license found in the
|
|
6
|
+
* LICENSE file in the root directory of this source tree. An additional grant
|
|
7
|
+
* of patent rights can be found in the PATENTS file in the same directory.
|
|
8
|
+
*
|
|
9
|
+
* @providesModule ReactTestRenderer
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
'use strict';
|
|
13
|
+
|
|
14
|
+
var _assign = require('object-assign');
|
|
15
|
+
|
|
16
|
+
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
|
|
17
|
+
|
|
18
|
+
var ReactDefaultBatchingStrategy = require('./ReactDefaultBatchingStrategy');
|
|
19
|
+
var ReactEmptyComponent = require('./ReactEmptyComponent');
|
|
20
|
+
var ReactMultiChild = require('./ReactMultiChild');
|
|
21
|
+
var ReactHostComponent = require('./ReactHostComponent');
|
|
22
|
+
var ReactTestMount = require('./ReactTestMount');
|
|
23
|
+
var ReactTestReconcileTransaction = require('./ReactTestReconcileTransaction');
|
|
24
|
+
var ReactUpdates = require('./ReactUpdates');
|
|
25
|
+
|
|
26
|
+
var renderSubtreeIntoContainer = require('./renderSubtreeIntoContainer');
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
* Drill down (through composites and empty components) until we get a native or
|
|
30
|
+
* native text component.
|
|
31
|
+
*
|
|
32
|
+
* This is pretty polymorphic but unavoidable with the current structure we have
|
|
33
|
+
* for `_renderedChildren`.
|
|
34
|
+
*/
|
|
35
|
+
function getRenderedHostOrTextFromComponent(component) {
|
|
36
|
+
var rendered;
|
|
37
|
+
while (rendered = component._renderedComponent) {
|
|
38
|
+
component = rendered;
|
|
39
|
+
}
|
|
40
|
+
return component;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
// =============================================================================
|
|
44
|
+
|
|
45
|
+
var ReactTestComponent = function (element) {
|
|
46
|
+
this._currentElement = element;
|
|
47
|
+
this._renderedChildren = null;
|
|
48
|
+
this._topLevelWrapper = null;
|
|
49
|
+
};
|
|
50
|
+
ReactTestComponent.prototype.mountComponent = function (transaction, nativeParent, nativeContainerInfo, context) {
|
|
51
|
+
var element = this._currentElement;
|
|
52
|
+
this.mountChildren(element.props.children, transaction, context);
|
|
53
|
+
};
|
|
54
|
+
ReactTestComponent.prototype.receiveComponent = function (nextElement, transaction, context) {
|
|
55
|
+
this._currentElement = nextElement;
|
|
56
|
+
this.updateChildren(nextElement.props.children, transaction, context);
|
|
57
|
+
};
|
|
58
|
+
ReactTestComponent.prototype.getHostNode = function () {};
|
|
59
|
+
ReactTestComponent.prototype.unmountComponent = function () {};
|
|
60
|
+
ReactTestComponent.prototype.toJSON = function () {
|
|
61
|
+
var _currentElement$props = this._currentElement.props;
|
|
62
|
+
var children = _currentElement$props.children;
|
|
63
|
+
|
|
64
|
+
var props = _objectWithoutProperties(_currentElement$props, ['children']);
|
|
65
|
+
|
|
66
|
+
var childrenJSON = [];
|
|
67
|
+
for (var key in this._renderedChildren) {
|
|
68
|
+
var inst = this._renderedChildren[key];
|
|
69
|
+
inst = getRenderedHostOrTextFromComponent(inst);
|
|
70
|
+
var json = inst.toJSON();
|
|
71
|
+
if (json !== undefined) {
|
|
72
|
+
childrenJSON.push(json);
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
var object = {
|
|
76
|
+
type: this._currentElement.type,
|
|
77
|
+
props: props,
|
|
78
|
+
children: childrenJSON.length ? childrenJSON : null
|
|
79
|
+
};
|
|
80
|
+
Object.defineProperty(object, '$$typeof', {
|
|
81
|
+
value: Symbol['for']('react.test.json')
|
|
82
|
+
});
|
|
83
|
+
return object;
|
|
84
|
+
};
|
|
85
|
+
_assign(ReactTestComponent.prototype, ReactMultiChild.Mixin);
|
|
86
|
+
|
|
87
|
+
// =============================================================================
|
|
88
|
+
|
|
89
|
+
var ReactTestTextComponent = function (element) {
|
|
90
|
+
this._currentElement = element;
|
|
91
|
+
};
|
|
92
|
+
ReactTestTextComponent.prototype.mountComponent = function () {};
|
|
93
|
+
ReactTestTextComponent.prototype.receiveComponent = function (nextElement) {
|
|
94
|
+
this._currentElement = nextElement;
|
|
95
|
+
};
|
|
96
|
+
ReactTestTextComponent.prototype.getHostNode = function () {};
|
|
97
|
+
ReactTestTextComponent.prototype.unmountComponent = function () {};
|
|
98
|
+
ReactTestTextComponent.prototype.toJSON = function () {
|
|
99
|
+
return this._currentElement;
|
|
100
|
+
};
|
|
101
|
+
|
|
102
|
+
// =============================================================================
|
|
103
|
+
|
|
104
|
+
var ReactTestEmptyComponent = function (element) {
|
|
105
|
+
this._currentElement = null;
|
|
106
|
+
};
|
|
107
|
+
ReactTestEmptyComponent.prototype.mountComponent = function () {};
|
|
108
|
+
ReactTestEmptyComponent.prototype.receiveComponent = function () {};
|
|
109
|
+
ReactTestEmptyComponent.prototype.getHostNode = function () {};
|
|
110
|
+
ReactTestEmptyComponent.prototype.unmountComponent = function () {};
|
|
111
|
+
ReactTestEmptyComponent.prototype.toJSON = function () {};
|
|
112
|
+
|
|
113
|
+
// =============================================================================
|
|
114
|
+
|
|
115
|
+
ReactUpdates.injection.injectReconcileTransaction(ReactTestReconcileTransaction);
|
|
116
|
+
ReactUpdates.injection.injectBatchingStrategy(ReactDefaultBatchingStrategy);
|
|
117
|
+
|
|
118
|
+
ReactHostComponent.injection.injectGenericComponentClass(ReactTestComponent);
|
|
119
|
+
ReactHostComponent.injection.injectTextComponentClass(ReactTestTextComponent);
|
|
120
|
+
ReactEmptyComponent.injection.injectEmptyComponentFactory(function () {
|
|
121
|
+
return new ReactTestEmptyComponent();
|
|
122
|
+
});
|
|
123
|
+
|
|
124
|
+
var ReactTestRenderer = {
|
|
125
|
+
create: ReactTestMount.render,
|
|
126
|
+
|
|
127
|
+
/* eslint-disable camelcase */
|
|
128
|
+
unstable_batchedUpdates: ReactUpdates.batchedUpdates,
|
|
129
|
+
unstable_renderSubtreeIntoContainer: renderSubtreeIntoContainer
|
|
130
|
+
};
|
|
131
|
+
|
|
132
|
+
/* eslint-enable camelcase */
|
|
133
|
+
module.exports = ReactTestRenderer;
|
package/lib/ReactTestUtils.js
CHANGED
|
@@ -11,7 +11,8 @@
|
|
|
11
11
|
|
|
12
12
|
'use strict';
|
|
13
13
|
|
|
14
|
-
var
|
|
14
|
+
var _prodInvariant = require('./reactProdInvariant'),
|
|
15
|
+
_assign = require('object-assign');
|
|
15
16
|
|
|
16
17
|
var EventConstants = require('./EventConstants');
|
|
17
18
|
var EventPluginHub = require('./EventPluginHub');
|
|
@@ -25,6 +26,8 @@ var ReactElement = require('./ReactElement');
|
|
|
25
26
|
var ReactBrowserEventEmitter = require('./ReactBrowserEventEmitter');
|
|
26
27
|
var ReactCompositeComponent = require('./ReactCompositeComponent');
|
|
27
28
|
var ReactInstanceMap = require('./ReactInstanceMap');
|
|
29
|
+
var ReactInstrumentation = require('./ReactInstrumentation');
|
|
30
|
+
var ReactReconciler = require('./ReactReconciler');
|
|
28
31
|
var ReactUpdates = require('./ReactUpdates');
|
|
29
32
|
var SyntheticEvent = require('./SyntheticEvent');
|
|
30
33
|
|
|
@@ -63,6 +66,10 @@ function findAllInRenderedTreeInternal(inst, test) {
|
|
|
63
66
|
}
|
|
64
67
|
|
|
65
68
|
/**
|
|
69
|
+
* Utilities for making it easy to test React components.
|
|
70
|
+
*
|
|
71
|
+
* See https://facebook.github.io/react/docs/test-utils.html
|
|
72
|
+
*
|
|
66
73
|
* Todo: Support the entire DOM.scry query syntax. For now, these simple
|
|
67
74
|
* utilities will suffice for testing purposes.
|
|
68
75
|
* @lends ReactTestUtils
|
|
@@ -142,7 +149,7 @@ var ReactTestUtils = {
|
|
|
142
149
|
if (!inst) {
|
|
143
150
|
return [];
|
|
144
151
|
}
|
|
145
|
-
!ReactTestUtils.isCompositeComponent(inst) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'findAllInRenderedTree(...): instance must be a composite component') :
|
|
152
|
+
!ReactTestUtils.isCompositeComponent(inst) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'findAllInRenderedTree(...): instance must be a composite component') : _prodInvariant('10') : void 0;
|
|
146
153
|
return findAllInRenderedTreeInternal(ReactInstanceMap.get(inst), test);
|
|
147
154
|
},
|
|
148
155
|
|
|
@@ -162,7 +169,7 @@ var ReactTestUtils = {
|
|
|
162
169
|
var classList = className.split(/\s+/);
|
|
163
170
|
|
|
164
171
|
if (!Array.isArray(classNames)) {
|
|
165
|
-
!(classNames !== undefined) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'TestUtils.scryRenderedDOMComponentsWithClass expects a
|
|
172
|
+
!(classNames !== undefined) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'TestUtils.scryRenderedDOMComponentsWithClass expects a className as a second argument.') : _prodInvariant('11') : void 0;
|
|
166
173
|
classNames = classNames.split(/\s+/);
|
|
167
174
|
}
|
|
168
175
|
return classNames.every(function (name) {
|
|
@@ -307,9 +314,12 @@ ReactShallowRenderer.prototype.getMountedInstance = function () {
|
|
|
307
314
|
return this._instance ? this._instance._instance : null;
|
|
308
315
|
};
|
|
309
316
|
|
|
317
|
+
var nextDebugID = 1;
|
|
318
|
+
|
|
310
319
|
var NoopInternalComponent = function (element) {
|
|
311
320
|
this._renderedOutput = element;
|
|
312
321
|
this._currentElement = element;
|
|
322
|
+
this._debugID = nextDebugID++;
|
|
313
323
|
};
|
|
314
324
|
|
|
315
325
|
NoopInternalComponent.prototype = {
|
|
@@ -321,7 +331,7 @@ NoopInternalComponent.prototype = {
|
|
|
321
331
|
this._currentElement = element;
|
|
322
332
|
},
|
|
323
333
|
|
|
324
|
-
|
|
334
|
+
getHostNode: function () {
|
|
325
335
|
return undefined;
|
|
326
336
|
},
|
|
327
337
|
|
|
@@ -333,6 +343,11 @@ NoopInternalComponent.prototype = {
|
|
|
333
343
|
};
|
|
334
344
|
|
|
335
345
|
var ShallowComponentWrapper = function (element) {
|
|
346
|
+
// TODO: Consolidate with instantiateReactComponent
|
|
347
|
+
this._debugID = nextDebugID++;
|
|
348
|
+
var displayName = element.type.displayName || element.type.name || 'Unknown';
|
|
349
|
+
ReactInstrumentation.debugTool.onSetDisplayName(this._debugID, displayName);
|
|
350
|
+
|
|
336
351
|
this.construct(element);
|
|
337
352
|
};
|
|
338
353
|
_assign(ShallowComponentWrapper.prototype, ReactCompositeComponent.Mixin, {
|
|
@@ -350,8 +365,8 @@ ReactShallowRenderer.prototype.render = function (element, context) {
|
|
|
350
365
|
// conjunction with an inline-requires transform.
|
|
351
366
|
ReactDefaultInjection.inject();
|
|
352
367
|
|
|
353
|
-
!ReactElement.isValidElement(element) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactShallowRenderer render(): Invalid component element.%s', typeof element === 'function' ? ' Instead of passing a component class, make sure to instantiate ' + 'it by passing it to React.createElement.' : '') :
|
|
354
|
-
!(typeof element.type !== 'string') ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactShallowRenderer render(): Shallow rendering works only with custom
|
|
368
|
+
!ReactElement.isValidElement(element) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactShallowRenderer render(): Invalid component element.%s', typeof element === 'function' ? ' Instead of passing a component class, make sure to instantiate ' + 'it by passing it to React.createElement.' : '') : _prodInvariant('12', typeof element === 'function' ? ' Instead of passing a component class, make sure to instantiate ' + 'it by passing it to React.createElement.' : '') : void 0;
|
|
369
|
+
!(typeof element.type !== 'string') ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactShallowRenderer render(): Shallow rendering works only with custom components, not primitives (%s). Instead of calling `.render(el)` and inspecting the rendered output, look at `el.props` directly instead.', element.type) : _prodInvariant('13', element.type) : void 0;
|
|
355
370
|
|
|
356
371
|
if (!context) {
|
|
357
372
|
context = emptyObject;
|
|
@@ -373,16 +388,16 @@ ReactShallowRenderer.prototype.getRenderOutput = function () {
|
|
|
373
388
|
|
|
374
389
|
ReactShallowRenderer.prototype.unmount = function () {
|
|
375
390
|
if (this._instance) {
|
|
376
|
-
this._instance
|
|
391
|
+
ReactReconciler.unmountComponent(this._instance, false);
|
|
377
392
|
}
|
|
378
393
|
};
|
|
379
394
|
|
|
380
395
|
ReactShallowRenderer.prototype._render = function (element, transaction, context) {
|
|
381
396
|
if (this._instance) {
|
|
382
|
-
this._instance
|
|
397
|
+
ReactReconciler.receiveComponent(this._instance, element, transaction, context);
|
|
383
398
|
} else {
|
|
384
399
|
var instance = new ShallowComponentWrapper(element);
|
|
385
|
-
|
|
400
|
+
ReactReconciler.mountComponent(instance, transaction, null, null, context);
|
|
386
401
|
this._instance = instance;
|
|
387
402
|
}
|
|
388
403
|
};
|
|
@@ -398,7 +413,7 @@ ReactShallowRenderer.prototype._render = function (element, transaction, context
|
|
|
398
413
|
function makeSimulator(eventType) {
|
|
399
414
|
return function (domComponentOrNode, eventData) {
|
|
400
415
|
var node;
|
|
401
|
-
!!React.isValidElement(domComponentOrNode) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'TestUtils.Simulate expects a component instance and not a ReactElement.
|
|
416
|
+
!!React.isValidElement(domComponentOrNode) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'TestUtils.Simulate expects a component instance and not a ReactElement.TestUtils.Simulate will not work if you are using shallow rendering.') : _prodInvariant('14') : void 0;
|
|
402
417
|
if (ReactTestUtils.isDOMComponent(domComponentOrNode)) {
|
|
403
418
|
node = findDOMNode(domComponentOrNode);
|
|
404
419
|
} else if (domComponentOrNode.tagName) {
|
|
@@ -19,12 +19,18 @@ var ReactTransitionChildMapping = {
|
|
|
19
19
|
* simple syntactic sugar around flattenChildren().
|
|
20
20
|
*
|
|
21
21
|
* @param {*} children `this.props.children`
|
|
22
|
+
* @param {number=} selfDebugID Optional debugID of the current internal instance.
|
|
22
23
|
* @return {object} Mapping of key to child
|
|
23
24
|
*/
|
|
24
|
-
getChildMapping: function (children) {
|
|
25
|
+
getChildMapping: function (children, selfDebugID) {
|
|
25
26
|
if (!children) {
|
|
26
27
|
return children;
|
|
27
28
|
}
|
|
29
|
+
|
|
30
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
31
|
+
return flattenChildren(children, selfDebugID);
|
|
32
|
+
}
|
|
33
|
+
|
|
28
34
|
return flattenChildren(children);
|
|
29
35
|
},
|
|
30
36
|
|
|
@@ -14,10 +14,16 @@
|
|
|
14
14
|
var _assign = require('object-assign');
|
|
15
15
|
|
|
16
16
|
var React = require('./React');
|
|
17
|
+
var ReactInstanceMap = require('./ReactInstanceMap');
|
|
17
18
|
var ReactTransitionChildMapping = require('./ReactTransitionChildMapping');
|
|
18
19
|
|
|
19
20
|
var emptyFunction = require('fbjs/lib/emptyFunction');
|
|
20
21
|
|
|
22
|
+
/**
|
|
23
|
+
* A basis for animations. When children are declaratively added or removed,
|
|
24
|
+
* special lifecycle hooks are called.
|
|
25
|
+
* See https://facebook.github.io/react/docs/animation.html#low-level-api-reacttransitiongroup
|
|
26
|
+
*/
|
|
21
27
|
var ReactTransitionGroup = React.createClass({
|
|
22
28
|
displayName: 'ReactTransitionGroup',
|
|
23
29
|
|
|
@@ -35,6 +41,7 @@ var ReactTransitionGroup = React.createClass({
|
|
|
35
41
|
|
|
36
42
|
getInitialState: function () {
|
|
37
43
|
return {
|
|
44
|
+
// TODO: can we get useful debug information to show at this point?
|
|
38
45
|
children: ReactTransitionChildMapping.getChildMapping(this.props.children)
|
|
39
46
|
};
|
|
40
47
|
},
|
|
@@ -55,7 +62,12 @@ var ReactTransitionGroup = React.createClass({
|
|
|
55
62
|
},
|
|
56
63
|
|
|
57
64
|
componentWillReceiveProps: function (nextProps) {
|
|
58
|
-
var nextChildMapping
|
|
65
|
+
var nextChildMapping;
|
|
66
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
67
|
+
nextChildMapping = ReactTransitionChildMapping.getChildMapping(nextProps.children, ReactInstanceMap.get(this)._debugID);
|
|
68
|
+
} else {
|
|
69
|
+
nextChildMapping = ReactTransitionChildMapping.getChildMapping(nextProps.children);
|
|
70
|
+
}
|
|
59
71
|
var prevChildMapping = this.state.children;
|
|
60
72
|
|
|
61
73
|
this.setState({
|
|
@@ -111,7 +123,12 @@ var ReactTransitionGroup = React.createClass({
|
|
|
111
123
|
|
|
112
124
|
delete this.currentlyTransitioningKeys[key];
|
|
113
125
|
|
|
114
|
-
var currentChildMapping
|
|
126
|
+
var currentChildMapping;
|
|
127
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
128
|
+
currentChildMapping = ReactTransitionChildMapping.getChildMapping(this.props.children, ReactInstanceMap.get(this)._debugID);
|
|
129
|
+
} else {
|
|
130
|
+
currentChildMapping = ReactTransitionChildMapping.getChildMapping(this.props.children);
|
|
131
|
+
}
|
|
115
132
|
|
|
116
133
|
if (!currentChildMapping || !currentChildMapping.hasOwnProperty(key)) {
|
|
117
134
|
// This was removed before it had fully appeared. Remove it.
|
|
@@ -139,7 +156,12 @@ var ReactTransitionGroup = React.createClass({
|
|
|
139
156
|
|
|
140
157
|
delete this.currentlyTransitioningKeys[key];
|
|
141
158
|
|
|
142
|
-
var currentChildMapping
|
|
159
|
+
var currentChildMapping;
|
|
160
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
161
|
+
currentChildMapping = ReactTransitionChildMapping.getChildMapping(this.props.children, ReactInstanceMap.get(this)._debugID);
|
|
162
|
+
} else {
|
|
163
|
+
currentChildMapping = ReactTransitionChildMapping.getChildMapping(this.props.children);
|
|
164
|
+
}
|
|
143
165
|
|
|
144
166
|
if (!currentChildMapping || !currentChildMapping.hasOwnProperty(key)) {
|
|
145
167
|
// This was removed before it had fully entered. Remove it.
|
|
@@ -170,7 +192,12 @@ var ReactTransitionGroup = React.createClass({
|
|
|
170
192
|
|
|
171
193
|
delete this.currentlyTransitioningKeys[key];
|
|
172
194
|
|
|
173
|
-
var currentChildMapping
|
|
195
|
+
var currentChildMapping;
|
|
196
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
197
|
+
currentChildMapping = ReactTransitionChildMapping.getChildMapping(this.props.children, ReactInstanceMap.get(this)._debugID);
|
|
198
|
+
} else {
|
|
199
|
+
currentChildMapping = ReactTransitionChildMapping.getChildMapping(this.props.children);
|
|
200
|
+
}
|
|
174
201
|
|
|
175
202
|
if (currentChildMapping && currentChildMapping.hasOwnProperty(key)) {
|
|
176
203
|
// This entered again before it fully left. Add it again.
|
|
@@ -199,7 +226,19 @@ var ReactTransitionGroup = React.createClass({
|
|
|
199
226
|
childrenToRender.push(React.cloneElement(this.props.childFactory(child), { ref: key, key: key }));
|
|
200
227
|
}
|
|
201
228
|
}
|
|
202
|
-
|
|
229
|
+
|
|
230
|
+
// Do not forward ReactTransitionGroup props to primitive DOM nodes
|
|
231
|
+
var props = _assign({}, this.props);
|
|
232
|
+
delete props.transitionLeave;
|
|
233
|
+
delete props.transitionName;
|
|
234
|
+
delete props.transitionAppear;
|
|
235
|
+
delete props.transitionEnter;
|
|
236
|
+
delete props.childFactory;
|
|
237
|
+
delete props.transitionLeaveTimeout;
|
|
238
|
+
delete props.transitionEnterTimeout;
|
|
239
|
+
delete props.component;
|
|
240
|
+
|
|
241
|
+
return React.createElement(this.props.component, props, childrenToRender);
|
|
203
242
|
}
|
|
204
243
|
});
|
|
205
244
|
|
package/lib/ReactUpdateQueue.js
CHANGED
|
@@ -11,8 +11,11 @@
|
|
|
11
11
|
|
|
12
12
|
'use strict';
|
|
13
13
|
|
|
14
|
+
var _prodInvariant = require('./reactProdInvariant');
|
|
15
|
+
|
|
14
16
|
var ReactCurrentOwner = require('./ReactCurrentOwner');
|
|
15
17
|
var ReactInstanceMap = require('./ReactInstanceMap');
|
|
18
|
+
var ReactInstrumentation = require('./ReactInstrumentation');
|
|
16
19
|
var ReactUpdates = require('./ReactUpdates');
|
|
17
20
|
|
|
18
21
|
var invariant = require('fbjs/lib/invariant');
|
|
@@ -189,6 +192,11 @@ var ReactUpdateQueue = {
|
|
|
189
192
|
* @internal
|
|
190
193
|
*/
|
|
191
194
|
enqueueSetState: function (publicInstance, partialState) {
|
|
195
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
196
|
+
ReactInstrumentation.debugTool.onSetState();
|
|
197
|
+
process.env.NODE_ENV !== 'production' ? warning(partialState != null, 'setState(...): You passed an undefined or null state object; ' + 'instead, use forceUpdate().') : void 0;
|
|
198
|
+
}
|
|
199
|
+
|
|
192
200
|
var internalInstance = getInternalInstanceReadyForUpdate(publicInstance, 'setState');
|
|
193
201
|
|
|
194
202
|
if (!internalInstance) {
|
|
@@ -207,7 +215,7 @@ var ReactUpdateQueue = {
|
|
|
207
215
|
},
|
|
208
216
|
|
|
209
217
|
validateCallback: function (callback, callerName) {
|
|
210
|
-
!(!callback || typeof callback === 'function') ? process.env.NODE_ENV !== 'production' ? invariant(false, '%s(...): Expected the last optional `callback` argument to be a
|
|
218
|
+
!(!callback || typeof callback === 'function') ? process.env.NODE_ENV !== 'production' ? invariant(false, '%s(...): Expected the last optional `callback` argument to be a function. Instead received: %s.', callerName, formatUnexpectedArgument(callback)) : _prodInvariant('122', callerName, formatUnexpectedArgument(callback)) : void 0;
|
|
211
219
|
}
|
|
212
220
|
|
|
213
221
|
};
|
package/lib/ReactUpdates.js
CHANGED
|
@@ -11,25 +11,27 @@
|
|
|
11
11
|
|
|
12
12
|
'use strict';
|
|
13
13
|
|
|
14
|
-
var
|
|
14
|
+
var _prodInvariant = require('./reactProdInvariant'),
|
|
15
|
+
_assign = require('object-assign');
|
|
15
16
|
|
|
16
17
|
var CallbackQueue = require('./CallbackQueue');
|
|
17
18
|
var PooledClass = require('./PooledClass');
|
|
18
19
|
var ReactFeatureFlags = require('./ReactFeatureFlags');
|
|
19
|
-
var
|
|
20
|
+
var ReactInstrumentation = require('./ReactInstrumentation');
|
|
20
21
|
var ReactReconciler = require('./ReactReconciler');
|
|
21
22
|
var Transaction = require('./Transaction');
|
|
22
23
|
|
|
23
24
|
var invariant = require('fbjs/lib/invariant');
|
|
24
25
|
|
|
25
26
|
var dirtyComponents = [];
|
|
27
|
+
var updateBatchNumber = 0;
|
|
26
28
|
var asapCallbackQueue = CallbackQueue.getPooled();
|
|
27
29
|
var asapEnqueued = false;
|
|
28
30
|
|
|
29
31
|
var batchingStrategy = null;
|
|
30
32
|
|
|
31
33
|
function ensureInjected() {
|
|
32
|
-
!(ReactUpdates.ReactReconcileTransaction && batchingStrategy) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must inject a reconcile transaction class and batching
|
|
34
|
+
!(ReactUpdates.ReactReconcileTransaction && batchingStrategy) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must inject a reconcile transaction class and batching strategy') : _prodInvariant('123') : void 0;
|
|
33
35
|
}
|
|
34
36
|
|
|
35
37
|
var NESTED_UPDATES = {
|
|
@@ -110,13 +112,20 @@ function mountOrderComparator(c1, c2) {
|
|
|
110
112
|
|
|
111
113
|
function runBatchedUpdates(transaction) {
|
|
112
114
|
var len = transaction.dirtyComponentsLength;
|
|
113
|
-
!(len === dirtyComponents.length) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'Expected flush transaction\'s stored dirty-components length (%s) to
|
|
115
|
+
!(len === dirtyComponents.length) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'Expected flush transaction\'s stored dirty-components length (%s) to match dirty-components array length (%s).', len, dirtyComponents.length) : _prodInvariant('124', len, dirtyComponents.length) : void 0;
|
|
114
116
|
|
|
115
117
|
// Since reconciling a component higher in the owner hierarchy usually (not
|
|
116
118
|
// always -- see shouldComponentUpdate()) will reconcile children, reconcile
|
|
117
119
|
// them before their children by sorting the array.
|
|
118
120
|
dirtyComponents.sort(mountOrderComparator);
|
|
119
121
|
|
|
122
|
+
// Any updates enqueued while reconciling must be performed after this entire
|
|
123
|
+
// batch. Otherwise, if dirtyComponents is [A, B] where A has children B and
|
|
124
|
+
// C, B could update twice in a single batch if C's render enqueues an update
|
|
125
|
+
// to B (since B would have already updated, we should skip it, and the only
|
|
126
|
+
// way we can know to do so is by checking the batch counter).
|
|
127
|
+
updateBatchNumber++;
|
|
128
|
+
|
|
120
129
|
for (var i = 0; i < len; i++) {
|
|
121
130
|
// If a component is unmounted before pending changes apply, it will still
|
|
122
131
|
// be here, but we assume that it has cleared its _pendingCallbacks and
|
|
@@ -140,7 +149,7 @@ function runBatchedUpdates(transaction) {
|
|
|
140
149
|
console.time(markerName);
|
|
141
150
|
}
|
|
142
151
|
|
|
143
|
-
ReactReconciler.performUpdateIfNecessary(component, transaction.reconcileTransaction);
|
|
152
|
+
ReactReconciler.performUpdateIfNecessary(component, transaction.reconcileTransaction, updateBatchNumber);
|
|
144
153
|
|
|
145
154
|
if (markerName) {
|
|
146
155
|
console.timeEnd(markerName);
|
|
@@ -155,6 +164,10 @@ function runBatchedUpdates(transaction) {
|
|
|
155
164
|
}
|
|
156
165
|
|
|
157
166
|
var flushBatchedUpdates = function () {
|
|
167
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
168
|
+
ReactInstrumentation.debugTool.onBeginFlush();
|
|
169
|
+
}
|
|
170
|
+
|
|
158
171
|
// ReactUpdatesFlushTransaction's wrappers will clear the dirtyComponents
|
|
159
172
|
// array and perform any updates enqueued by mount-ready handlers (i.e.,
|
|
160
173
|
// componentDidUpdate) but we need to check here too in order to catch
|
|
@@ -174,8 +187,11 @@ var flushBatchedUpdates = function () {
|
|
|
174
187
|
CallbackQueue.release(queue);
|
|
175
188
|
}
|
|
176
189
|
}
|
|
190
|
+
|
|
191
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
192
|
+
ReactInstrumentation.debugTool.onEndFlush();
|
|
193
|
+
}
|
|
177
194
|
};
|
|
178
|
-
flushBatchedUpdates = ReactPerf.measure('ReactUpdates', 'flushBatchedUpdates', flushBatchedUpdates);
|
|
179
195
|
|
|
180
196
|
/**
|
|
181
197
|
* Mark a component as needing a rerender, adding an optional callback to a
|
|
@@ -196,6 +212,9 @@ function enqueueUpdate(component) {
|
|
|
196
212
|
}
|
|
197
213
|
|
|
198
214
|
dirtyComponents.push(component);
|
|
215
|
+
if (component._updateBatchNumber == null) {
|
|
216
|
+
component._updateBatchNumber = updateBatchNumber + 1;
|
|
217
|
+
}
|
|
199
218
|
}
|
|
200
219
|
|
|
201
220
|
/**
|
|
@@ -203,21 +222,21 @@ function enqueueUpdate(component) {
|
|
|
203
222
|
* if no updates are currently being performed.
|
|
204
223
|
*/
|
|
205
224
|
function asap(callback, context) {
|
|
206
|
-
!batchingStrategy.isBatchingUpdates ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates.asap: Can\'t enqueue an asap callback in a context
|
|
225
|
+
!batchingStrategy.isBatchingUpdates ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates.asap: Can\'t enqueue an asap callback in a context whereupdates are not being batched.') : _prodInvariant('125') : void 0;
|
|
207
226
|
asapCallbackQueue.enqueue(callback, context);
|
|
208
227
|
asapEnqueued = true;
|
|
209
228
|
}
|
|
210
229
|
|
|
211
230
|
var ReactUpdatesInjection = {
|
|
212
231
|
injectReconcileTransaction: function (ReconcileTransaction) {
|
|
213
|
-
!ReconcileTransaction ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide a reconcile transaction class') :
|
|
232
|
+
!ReconcileTransaction ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide a reconcile transaction class') : _prodInvariant('126') : void 0;
|
|
214
233
|
ReactUpdates.ReactReconcileTransaction = ReconcileTransaction;
|
|
215
234
|
},
|
|
216
235
|
|
|
217
236
|
injectBatchingStrategy: function (_batchingStrategy) {
|
|
218
|
-
!_batchingStrategy ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide a batching strategy') :
|
|
219
|
-
!(typeof _batchingStrategy.batchedUpdates === 'function') ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide a batchedUpdates() function') :
|
|
220
|
-
!(typeof _batchingStrategy.isBatchingUpdates === 'boolean') ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide an isBatchingUpdates boolean attribute') :
|
|
237
|
+
!_batchingStrategy ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide a batching strategy') : _prodInvariant('127') : void 0;
|
|
238
|
+
!(typeof _batchingStrategy.batchedUpdates === 'function') ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide a batchedUpdates() function') : _prodInvariant('128') : void 0;
|
|
239
|
+
!(typeof _batchingStrategy.isBatchingUpdates === 'boolean') ? process.env.NODE_ENV !== 'production' ? invariant(false, 'ReactUpdates: must provide an isBatchingUpdates boolean attribute') : _prodInvariant('129') : void 0;
|
|
221
240
|
batchingStrategy = _batchingStrategy;
|
|
222
241
|
}
|
|
223
242
|
};
|