Add safeguards to ReactComponentTreeDevtool
Dan Abramov committed
Apr 23, 2016 at 02:23 UTC
900a588f6309ce1c8ab1670df95f7981ccf04277
2 files changed
+30
-19
src/isomorphic/devtools/ReactComponentTreeDevtool.js
+26
-14
@@ -13,19 +13,19 @@
13
14
var invariant = require('invariant');
15
16
-var isTopLevelWrapperByID = {};
16
var unmountedContainerIDs = [];
17
var allChildIDsByContainerID = {};
18
var tree = {};
19
20
function updateTree(id, update) {
22
- if (isTopLevelWrapperByID[id]) {
23
- return;
24
- }
21
if (!tree[id]) {
22
tree[id] = {
23
parentID: null,
24
+ ownerID: null,
25
+ text: null,
26
childIDs: [],
27
+ displayName: 'Unknown',
28
+ isTopLevelWrapper: false,
29
};
30
}
31
update(tree[id]);
@@ -49,10 +49,7 @@ function purgeTree(id) {
49
50
var ReactComponentTreeDevtool = {
51
onSetIsTopLevelWrapper(id, isTopLevelWrapper) {
52
- if (isTopLevelWrapper) {
53
- delete tree[id];
54
- isTopLevelWrapperByID[id] = true;
55
- }
52
+ updateTree(id, item => item.isTopLevelWrapper = isTopLevelWrapper);
53
},
54
55
onSetIsComposite(id, isComposite) {
@@ -64,6 +61,10 @@ var ReactComponentTreeDevtool = {
61
},
62
63
onSetChildren(id, nextChildIDs) {
64
+ if (ReactComponentTreeDevtool.isTopLevelWrapper(id)) {
65
+ return;
66
+ }
67
+
68
updateTree(id, item => {
69
var prevChildIDs = item.childIDs;
70
item.childIDs = nextChildIDs;
@@ -137,27 +138,38 @@ var ReactComponentTreeDevtool = {
138
},
139
140
isComposite(id) {
140
- return tree[id].isComposite;
141
+ var item = tree[id];
142
+ return item ? item.isComposite : false;
143
+ },
144
+
145
+ isTopLevelWrapper(id) {
146
+ var item = tree[id];
147
+ return item ? item.isTopLevelWrapper : false;
148
},
149
150
getChildIDs(id) {
144
- return tree[id].childIDs;
151
+ var item = tree[id];
152
+ return item ? item.childIDs : [];
153
},
154
155
getDisplayName(id) {
148
- return tree[id].displayName;
156
+ var item = tree[id];
157
+ return item ? item.displayName : 'Unknown';
158
},
159
160
getOwnerID(id) {
152
- return tree[id].ownerID;
161
+ var item = tree[id];
162
+ return item ? item.ownerID : null;
163
},
164
165
getParentID(id) {
156
- return tree[id].parentID;
166
+ var item = tree[id];
167
+ return item ? item.parentID : null;
168
},
169
170
getText(id) {
160
- return tree[id].text;
171
+ var item = tree[id];
172
+ return item ? item.text : null;
173
},
174
175
getRegisteredIDs() {
src/isomorphic/devtools/__tests__/ReactComponentTreeDevtool-test.js
+4
-5
@@ -38,6 +38,7 @@ describe('ReactComponentTreeDevtool', () => {
38
39
function getRegisteredDisplayNames() {
40
return ReactComponentTreeDevtool.getRegisteredIDs()
41
+ .filter(id => !ReactComponentTreeDevtool.isTopLevelWrapper(id))
42
.map(ReactComponentTreeDevtool.getDisplayName);
43
}
44
@@ -48,9 +49,7 @@ describe('ReactComponentTreeDevtool', () => {
49
};
50
51
var parentID = ReactComponentTreeDevtool.getParentID(rootID);
51
- if (expectedParentID) {
52
- expect(parentID).toBe(expectedParentID);
53
- }
52
+ expect(parentID).toBe(expectedParentID);
53
54
var childIDs = ReactComponentTreeDevtool.getChildIDs(rootID);
55
var text = ReactComponentTreeDevtool.getText(rootID);
@@ -90,7 +89,7 @@ describe('ReactComponentTreeDevtool', () => {
89
currentElement = element;
90
ReactDOM.render(<Wrapper />, node);
91
expect(
93
- getTree(rootInstance._renderedComponent._debugID, includeOwner)
92
+ getTree(rootInstance._debugID, includeOwner).children[0]
93
).toEqual(expectedTree);
94
});
95
ReactDOM.unmountComponentAtNode(node);
@@ -100,7 +99,7 @@ describe('ReactComponentTreeDevtool', () => {
99
currentElement = element;
100
ReactDOMServer.renderToString(<Wrapper />);
101
expect(
103
- getTree(rootInstance._renderedComponent._debugID, includeOwner)
102
+ getTree(rootInstance._debugID, includeOwner).children[0]
103
).toEqual(expectedTree);
104
ReactComponentTreeDevtool.purgeUnmountedContainers();
105
expect(getRegisteredDisplayNames()).toEqual([]);