First time posting a question :)
I have a React
application with:
// index.js
ReactDOM.render(
<React.StrictMode>
<Router>
<App />
</Router>
</React.StrictMode>,
document.getElementById('root'),
);
I have 24 jest
test suites, which, until now, were basically like:
act(() => {
render(
<Router>
<SomeComponentIWantToTest />
</Router>
);
});
It occurred to me that it would be more appropriate to wrap the tests in StrictMode
, to get closer to how the app is actually being rendered:
act(() => {
render(
<React.StrictMode>
<Router>
<SomeComponentIWantToTest />
</Router>
</React.StrictMode>
);
});
After trying this, here's what I noticed:
- One good thing was that it threw some console warnings where I hadn't wrapped some of my test code in
act
. I was able to fix these places. Hurray! - My tests slowed down significantly. I'm guessing this is because My React Component is rendering twice because of Strict Mode.
Also, in a quick glance at the docs, it seems that StrictMode
is a development-only thing. So, does it make sense to wrap tests (which are theoretically concerned with what's going to happen in production), in React.StrictMode
?