-
Notifications
You must be signed in to change notification settings - Fork 46.4k
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
injectEnvironment
called twice: react-test-renderer
and react-dom
#7386
Comments
@NicolasT, I see the same issue. Seems like related to the change made in react @ 15.3.0, I downgrade react to 15.2.1 and the problem got solved. injectEnvironment() was called in 15.3.0 but not in 15.2.1. |
This happens because the tool is assuming ReactDOM would be mocked out. jest.mock('react-dom'); to prevent this. Ideally this shouldn’t be happening in the first place but there is more work to be done before we can avoid this. |
any other solutions for this? Mocking react-dom is giving me another error. I believe bc enzyme uses it. |
Maybe @cpojer could offer some insight. I think it should be possible to mock |
I think it's always limited to one file. |
So I just looked into this a bit more. It seems that react-test-renderer and enzyme are not compatible due to this issue. In enzyme we do load react-dom and hook it up. Sure, jest could mock it, but other test frameworks might not be able to? Additionally, i would assume people would want their snapshot tests next to their other tests. Currently that is not possible due to the above mentioned. Both renderers try to inject. Here's a type of test I would expect someone would want to write and couldn't at the moment. import React from 'react';
import renderer from 'react-test-renderer';
import { mount } from 'enzyme';
class MyComponent extends React.Component {
state = { active: true };
render() {
return (
<div onClick={() => this.setState({active: !this.state.active}) }>
Component is {this.state.active}
</div>
);
}
}
describe('MyComponent', () => {
it('matches snapshot', () => {
const tree = renderer.create(<MyComponent />).toJSON();
expect(tree).toMatchSnapshot();
});
it('updates state on click', () => {
const wrapper = mount(<MyComponent />);
wrapper.find('[onClick]').simulate('click');
expect(wrapper).toHaveState('active', false);
});
}); Is there anything I can do to help make this compatible? I'm just not sure what the solution you guys are looking for is. |
Yes, this is a limitation right now; you can't use ReactDOM and ReactTestRenderer in the same file unfortunately. |
Are there any plans to resolve that conflict or is it just something the community needs to be aware of? It seems like |
I would like to change core modules to be instantiable instead of relying on a global injection, and then you could share two in the same environment. We might also switch to copying renderer files to react-test-renderer so that the modules are totally independent and don't have shared state. |
This bug also makes it difficult to write tests for components that use react-native-listener, which also relies on ReactDOM. Mocking out ReactDOM doesn't fix the problem and simply causes another error to be thrown. |
@spicyj The builds in master should support this since they copy so should we close this out? |
Sure. Doesn't look like your change is in 15.3.1 but when 15.4 is released, this should be fixed. |
When is 15.4 scheduled to be released? |
I would expect it to ship within two weeks but that is my guess. I'd like to see #7649 land before the release, and it looks like it will happen. It provides a way to work around another annoying issue with test renderer. Then #7482 needs to be fixed because it's a regression and we'll break a lot of projects if we ship without fixing it. I know @zpao planned to look into it. I think that when both are fixed/merged, 15.4.0 should be good to go. |
Thanks for the update! |
… 'react-dom' loaded by 'enzyme'. See facebook/react#7386 for more info
@gaearon look like the 2 issues from your last comment are now fixed. Do you plan a release ? This will help us a lot. Thanks for your time. |
@rande we have an open ticket for the next release #7770. A RC for 15.4.0 should be out soon based on #7840 (comment). |
You can try |
@gaearon thanks, the jest's tests are now green, which is a good news ;) The hot reload component does not seem to work anymore: I will check your documentation. |
React Hot Loader 1.x has been deprecated and unsupported for about a year by now. |
doesn't work in Any workarounds before it will be fixed?
|
This will be resolved in React 15.4. |
This was fixed in React 15.4.0 which is out today. |
See facebook/react#7386 for a discussion.
See facebook/react#7386 for a discussion.
See facebook/react#7386 for a discussion.
See facebook/react#7386 for a discussion.
Trying to test a very simple React component using Material-UI through Jest and
react-test-renderer
, I'm stuck becauseReactCompositeComponent: injectEnvironment() can only be called once
.It looks like
react-test-renderer
callsinjectEnvironment
, but so doesreact-dom
, which is (in my actual application) imported somewhere within a Material-UI module which is in turn imported by my component code.This may not really be a 'bug' in React or
react-test-renderer
per se, though one could imagine other dependencies somehow loadingreact-dom
as well, causing the same issue.I created a test-case at https://github.com/NicolasT/react-test-renderer-and-react-dom-incompatible which may provide some more context.
react
: 15.3.0react-dom
: 15.3.0react-test-renderer
: 15.3.0The text was updated successfully, but these errors were encountered: