Warn when element is missing in devtool (#6869)
Ben Alpert committed
May 25, 2016 at 17:11 UTC
21d271f6d0ec971d6c5a0231b55086c65e941ebf
2 files changed
+35
-2
src/renderers/shared/devtools/ReactComponentTreeDevtool.js
+8
-1
@@ -14,6 +14,7 @@
14
var ReactCurrentOwner = require('ReactCurrentOwner');
15
16
var invariant = require('invariant');
17
+var warning = require('warning');
18
19
var tree = {};
20
var unmountedIDs = {};
@@ -67,7 +68,13 @@ function describeID(id) {
68
if (ownerID) {
69
ownerName = ReactComponentTreeDevtool.getDisplayName(ownerID);
70
}
70
- return describeComponentFrame(name, element._source, ownerName);
71
+ warning(
72
+ element,
73
+ 'ReactComponentTreeDevtool: Missing React element for debugID %s when ' +
74
+ 'building stack',
75
+ id
76
+ );
77
+ return describeComponentFrame(name, element && element._source, ownerName);
78
}
79
80
var ReactComponentTreeDevtool = {
src/renderers/shared/devtools/__tests__/ReactComponentTreeDevtool-test.js
+27
-1
@@ -1716,7 +1716,7 @@ describe('ReactComponentTreeDevtool', () => {
1716
expect(ReactComponentTreeTestUtils.getRegisteredDisplayNames()).toEqual([]);
1717
});
1718
1719
- it('creates stack addenda', () => {
1719
+ it('creates current stack addenda', () => {
1720
function getAddendum(element) {
1721
var addendum = ReactComponentTreeDevtool.getCurrentStackAddendum(element);
1722
return addendum.replace(/\(at .+?:\d+\)/g, '(at **)');
@@ -1789,4 +1789,30 @@ describe('ReactComponentTreeDevtool', () => {
1789
'\n in R (created by Q)'
1790
);
1791
});
1792
+
1793
+ it('creates stack addenda by ID', () => {
1794
+ function getAddendum(id) {
1795
+ var addendum = ReactComponentTreeDevtool.getStackAddendumByID(id);
1796
+ return addendum.replace(/\(at .+?:\d+\)/g, '(at **)');
1797
+ }
1798
+
1799
+ class Q extends React.Component {
1800
+ render() {
1801
+ return null;
1802
+ }
1803
+ }
1804
+
1805
+ var q = ReactDOM.render(<Q />, document.createElement('div'));
1806
+ expect(getAddendum(ReactInstanceMap.get(q)._debugID)).toBe(
1807
+ '\n in Q (at **)'
1808
+ );
1809
+
1810
+ spyOn(console, 'error');
1811
+ getAddendum(-17);
1812
+ expect(console.error.calls.count()).toBe(1);
1813
+ expect(console.error.calls.argsFor(0)[0]).toBe(
1814
+ 'Warning: ReactComponentTreeDevtool: Missing React element for debugID ' +
1815
+ '-17 when building stack'
1816
+ );
1817
+ });
1818
});