Use returned native node for composite type-change
With this change, all unmounted components should be properly purged from ReactMount's cache.
Ben Alpert committed
Sep 26, 2015 at 14:07 UTC
60491d89f88a04a6be29a52b652090ba276ba7a9
6 files changed
+27
-30
src/renderers/dom/client/ReactDOMIDOperations.js
-14
@@ -63,19 +63,6 @@ var ReactDOMIDOperations = {
63
}
64
},
65
66
- /**
67
- * Replaces a DOM node that exists in the document with markup.
68
- *
69
- * @param {string} id ID of child to be replaced.
70
- * @param {string} markup Dangerous markup to inject in place of child.
71
- * @internal
72
- * @see {Danger.dangerouslyReplaceNodeWithMarkup}
73
- */
74
- dangerouslyReplaceNodeWithMarkupByID: function(id, markup) {
75
- var node = ReactMount.getNode(id);
76
- DOMChildrenOperations.dangerouslyReplaceNodeWithMarkup(node, markup);
77
- },
78
-
66
/**
67
* Updates a component's children by processing a series of updates.
68
*
@@ -92,7 +79,6 @@ var ReactDOMIDOperations = {
79
};
80
81
ReactPerf.measureMethods(ReactDOMIDOperations, 'ReactDOMIDOperations', {
95
- dangerouslyReplaceNodeWithMarkupByID: 'dangerouslyReplaceNodeWithMarkupByID',
82
dangerouslyProcessChildrenUpdates: 'dangerouslyProcessChildrenUpdates',
83
});
84
src/renderers/dom/shared/ReactComponentBrowserEnvironment.js
+12
-2
@@ -11,8 +11,10 @@
11
12
'use strict';
13
14
+var DOMChildrenOperations = require('DOMChildrenOperations');
15
var ReactDOMIDOperations = require('ReactDOMIDOperations');
16
var ReactMount = require('ReactMount');
17
+var ReactPerf = require('ReactPerf');
18
19
/**
20
* Abstracts away all functionality of the reconciler that requires knowledge of
@@ -24,8 +26,8 @@ var ReactComponentBrowserEnvironment = {
26
processChildrenUpdates:
27
ReactDOMIDOperations.dangerouslyProcessChildrenUpdates,
28
27
- replaceNodeWithMarkupByID:
28
- ReactDOMIDOperations.dangerouslyReplaceNodeWithMarkupByID,
29
+ replaceNodeWithMarkup:
30
+ DOMChildrenOperations.dangerouslyReplaceNodeWithMarkup,
31
32
/**
33
* If a particular environment requires that some resources be cleaned up,
@@ -40,4 +42,12 @@ var ReactComponentBrowserEnvironment = {
42
43
};
44
45
+ReactPerf.measureMethods(
46
+ ReactComponentBrowserEnvironment,
47
+ 'ReactComponentBrowserEnvironment',
48
+ {
49
+ replaceNodeWithMarkup: 'replaceNodeWithMarkup',
50
+ }
51
+);
52
+
53
module.exports = ReactComponentBrowserEnvironment;
src/renderers/shared/reconciler/ReactComponentEnvironment.js
+3
-3
@@ -28,7 +28,7 @@ var ReactComponentEnvironment = {
28
* Optionally injectable hook for swapping out mount images in the middle of
29
* the tree.
30
*/
31
- replaceNodeWithMarkupByID: null,
31
+ replaceNodeWithMarkup: null,
32
33
/**
34
* Optionally injectable hook for processing a queue of child updates. Will
@@ -44,8 +44,8 @@ var ReactComponentEnvironment = {
44
);
45
ReactComponentEnvironment.unmountIDFromEnvironment =
46
environment.unmountIDFromEnvironment;
47
- ReactComponentEnvironment.replaceNodeWithMarkupByID =
48
- environment.replaceNodeWithMarkupByID;
47
+ ReactComponentEnvironment.replaceNodeWithMarkup =
48
+ environment.replaceNodeWithMarkup;
49
ReactComponentEnvironment.processChildrenUpdates =
50
environment.processChildrenUpdates;
51
injected = true;
src/renderers/shared/reconciler/ReactCompositeComponent.js
+9
-9
@@ -729,30 +729,30 @@ var ReactCompositeComponentMixin = {
729
this._processChildContext(context)
730
);
731
} else {
732
- // These two IDs are actually the same! But nothing should rely on that.
733
- var thisID = this._rootNodeID;
734
- var prevComponentID = prevComponentInstance._rootNodeID;
735
- ReactReconciler.unmountComponent(prevComponentInstance);
732
+ var oldNativeNode =
733
+ ReactReconciler.unmountComponent(prevComponentInstance);
734
735
this._renderedComponent = this._instantiateReactComponent(
736
nextRenderedElement
737
);
738
var nextMarkup = ReactReconciler.mountComponent(
739
this._renderedComponent,
742
- thisID,
740
+ this._rootNodeID,
741
transaction,
742
this._processChildContext(context)
743
);
746
- this._replaceNodeWithMarkupByID(prevComponentID, nextMarkup);
744
+ this._replaceNodeWithMarkup(oldNativeNode, nextMarkup);
745
}
746
},
747
748
/**
749
+ * Overridden in shallow rendering.
750
+ *
751
* @protected
752
*/
753
- _replaceNodeWithMarkupByID: function(prevComponentID, nextMarkup) {
754
- ReactComponentEnvironment.replaceNodeWithMarkupByID(
755
- prevComponentID,
753
+ _replaceNodeWithMarkup: function(oldNativeNode, nextMarkup) {
754
+ ReactComponentEnvironment.replaceNodeWithMarkup(
755
+ oldNativeNode,
756
nextMarkup
757
);
758
},
src/test/ReactDefaultPerf.js
+2
-1
@@ -169,7 +169,8 @@ var ReactDefaultPerf = {
169
moduleName === 'ReactDOMIDOperations' ||
170
moduleName === 'CSSPropertyOperations' ||
171
moduleName === 'DOMChildrenOperations' ||
172
- moduleName === 'DOMPropertyOperations') {
172
+ moduleName === 'DOMPropertyOperations' ||
173
+ moduleName === 'ReactComponentBrowserEnvironment') {
174
start = performanceNow();
175
rv = func.apply(this, args);
176
totalTime = performanceNow() - start;
src/test/ReactTestUtils.js
+1
-1
@@ -395,7 +395,7 @@ assign(
395
_instantiateReactComponent: function(element) {
396
return new NoopInternalComponent(element);
397
},
398
- _replaceNodeWithMarkupByID: function() {},
398
+ _replaceNodeWithMarkup: function() {},
399
_renderValidatedComponent:
400
ReactCompositeComponent.Mixin
401
._renderValidatedComponentWithoutOwnerOrContext,