Error: Invariant Violation: findAllInRenderedTree(...): instance must be a composite component
See original GitHub issueI am writing a test case using Mocha and JSDom.
import React from 'react';
import TestUtils from 'react-addons-test-utils';
describe('ReactOutsideEvent', () => {
it('captures mousedown event', () => {
let detachedCoponent;
detachedCoponent = TestUtils.renderIntoDocument(<div>
<div className='foo'></div>
</div>);
TestUtils.scryRenderedDOMComponentsWithClass(detachedCoponent, 'foo');
});
});
I’d like to obtain a reference to the generated DOMNode with className
“foo”. scryRenderedDOMComponentsWithClass
produces:
Error: Invariant Violation: findAllInRenderedTree(...): instance must be a composite component
I have also tried scryRenderedDOMComponentsWithTag
and got the same error.
Using 0.14.0-beta3.
Issue Analytics
- State:
- Created 8 years ago
- Reactions:3
- Comments:15 (1 by maintainers)
Top Results From Across the Web
Error: Invariant Violation: findAllInRenderedTree(...): instance ...
A composite component is a component which contains React Component (not div, span, ...) The method 'findRenderedDOMComponentWithTag' takes ...
Read more >instance must be a composite component-Reactjs
Coding example for the question Error: Invariant Violation: findAllInRenderedTree(...): instance must be a composite component-Reactjs.
Read more >Troubleshooting common React Native bugs - LogRocket Blog
This troubleshooting guide shares how to easily find and address common React Native bugs. See common error examples.
Read more >Error React createElement type is invalid expected a string for ...
I should be able to export my App component file and import it into ... for built-in components or a class function for...
Read more >CHANGELOG.md - facebook/react - Sourcegraph
Provide a component stack as a second argument to onRecoverableError . ... New invariant providing actionable error in missing instance case.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Yes, this is a breaking change and you’ll need to change your tests to be different, sorry. See 4070c4ca20b1d08a00fe278d561642e87373c09f.
detachedCoponent
is actually a DOM node now so the test utils can’t look into it to find the React component tree any more. This rarely comes up because you’ll almost always be testing your own components (it’s our job to test that the DOM components work, not yours 😃).I have not tried https://github.com/airbnb/enzyme but it looks promising.