Need a test for setState in shallow render #4019
Comments
zpao
added
Component: Test Utils
Component: Shallow Renderer
and removed
Component: Test Utils
labels
|
cc @graue |
This curcumvents a bug ir React. You can see a manifestation of it [here](facebook/react#4019). This existence of a `document` is required by React, when using `setState`. While `shallowRenderer` is inteded for use without a document, all tests that use `setState` will fail with a `documentis not defined`reference error. Fortunately, React doesn't need anything more than the existance of the global. So, we can define it in our test environment. This is where a more robust environment could be setup, using [jsdom](https://www.npmjs.com/package/jsdom) if needed.
|
I think I don't have this problem in 0.14, can somebody else verify? |
|
40b7c19 may have fixed this. Not sure it actually rerenders though? |
|
Just tried this on > node -e 'console.log(process.versions)'
{ http_parser: '2.3',
node: '0.12.7',
v8: '3.28.71.19',
uv: '1.6.1',
zlib: '1.2.8',
modules: '14',
openssl: '1.0.1p' }var React = require('react');
var TestUtils;
if (React.version.substring(4) == '0.13') {
TestUtils = require('react/addons').addons.TestUtils;
} else {
TestUtils = require('react-addons-test-utils');
}
if (process.env.document) {
global.document = {};
}
var renderer = TestUtils.createRenderer();
var Node = React.createClass({
getInitialState: function() {
return { foo: 'bar' };
},
clicked: function() {
this.setState({foo: 'baz'});
},
render: function() {
return (
React.createElement('div', {
onClick: this.clicked
}, this.state.foo)
);
}
});
renderer.render(
React.createElement(Node)
);
renderer.getRenderOutput().props.onClick();
console.log(renderer.getRenderOutput().props.children);0.13 0.13 with document hack 0.14.0-beta4 0.14.0-beta3 with document hack There's no git tags for the 0.14 series, but from a grep around it looks like that commit is present in beta3. |
This curcumvents a bug ir React. You can see a manifestation of it [here](facebook/react#4019). This existence of a `document` is required by React, when using `setState`. While `shallowRenderer` is inteded for use without a document, all tests that use `setState` will fail with a `documentis not defined`reference error. Fortunately, React doesn't need anything more than the existance of the global. So, we can define it in our test environment. This is where a more robust environment could be setup, using [jsdom](https://www.npmjs.com/package/jsdom) if needed.
This curcumvents a bug ir React. You can see a manifestation of it [here](facebook/react#4019). This existence of a `document` is required by React, when using `setState`. While `shallowRenderer` is inteded for use without a document, all tests that use `setState` will fail with a `documentis not defined`reference error. Fortunately, React doesn't need anything more than the existance of the global. So, we can define it in our test environment. This is where a more robust environment could be setup, using [jsdom](https://www.npmjs.com/package/jsdom) if needed.
|
@spicyj Should we have a custom transaction for shallow rendering? (Eventually we should get rid of transactions completely.) |
|
Yeah maybe. |
|
For reference for future readers of this bug, the simplest current workaround I'm aware of is to do something like chantastic/react-media-object@3361126 Basically, create a global document object to silence the warning before any tests are run. global.document = {} |
|
|
|
Good call, @robertknight. Looks like this was fixed in 0.14.0 (not RCs), broken in 0.14.4 (the fix was accidentally reverted upstream in fbjs), and fixed again in 0.14.6. I just tried @glenjamin's example with 0.14.6 and it's working (prints baz). |
|
@graue - I don't think we should close this until there is a regression test for it. I might be able to have a look at that. |
|
Yeah, let's at least have a test. |
graue
changed the title
document
Updating docs regarding React updates on Shallow Rendering: facebook/react#4019 (comment)
Updating docs regarding React updates on Shallow Rendering: facebook/react#4019 (comment)
|
FYI: I found this issue while investigating why I was getting warnings about setState even though shallow rendering was working perfectly fine. Could you look into removing the warnings about using setState during shallow rendering.
Thanks! |
|
this decided to happen for me today. not fun :( .... even though worked fine till now narrowed it down to the same setState when shallow rendering. |
|
@stefman1 That was a bug in a fbjs release. You can update to the new version. https://twitter.com/intelligibabble/status/844238291335458816 |
|
We have a bunch of tests using |
Related to #2393
Rendering a component like this:
rendering via shallow render, then calling handler
Produces the following:
Ideally, this module should realise it's running on the server, and skip this behaviour check
The text was updated successfully, but these errors were encountered: