Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Warn when element is missing in devtool #6869

Merged
merged 1 commit into from May 26, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 8 additions & 1 deletion src/renderers/shared/devtools/ReactComponentTreeDevtool.js
Expand Up @@ -14,6 +14,7 @@
var ReactCurrentOwner = require('ReactCurrentOwner');

var invariant = require('invariant');
var warning = require('warning');

var tree = {};
var unmountedIDs = {};
Expand Down Expand Up @@ -67,7 +68,13 @@ function describeID(id) {
if (ownerID) {
ownerName = ReactComponentTreeDevtool.getDisplayName(ownerID);
}
return describeComponentFrame(name, element._source, ownerName);
warning(
element,
'ReactComponentTreeDevtool: Missing React element for debugID %s when ' +
'building stack',
id
);
return describeComponentFrame(name, element && element._source, ownerName);
}

var ReactComponentTreeDevtool = {
Expand Down
Expand Up @@ -1716,7 +1716,7 @@ describe('ReactComponentTreeDevtool', () => {
expect(ReactComponentTreeTestUtils.getRegisteredDisplayNames()).toEqual([]);
});

it('creates stack addenda', () => {
it('creates current stack addenda', () => {
function getAddendum(element) {
var addendum = ReactComponentTreeDevtool.getCurrentStackAddendum(element);
return addendum.replace(/\(at .+?:\d+\)/g, '(at **)');
Expand Down Expand Up @@ -1789,4 +1789,30 @@ describe('ReactComponentTreeDevtool', () => {
'\n in R (created by Q)'
);
});

it('creates stack addenda by ID', () => {
function getAddendum(id) {
var addendum = ReactComponentTreeDevtool.getStackAddendumByID(id);
return addendum.replace(/\(at .+?:\d+\)/g, '(at **)');
}

class Q extends React.Component {
render() {
return null;
}
}

var q = ReactDOM.render(<Q />, document.createElement('div'));
expect(getAddendum(ReactInstanceMap.get(q)._debugID)).toBe(
'\n in Q (at **)'
);

spyOn(console, 'error');
getAddendum(-17);
expect(console.error.calls.count()).toBe(1);
expect(console.error.calls.argsFor(0)[0]).toBe(
'Warning: ReactComponentTreeDevtool: Missing React element for debugID ' +
'-17 when building stack'
);
});
});