[code-infra] Fix StrictMode effects not being called twice in React 19 tests
#45812
+96
−56
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
bernardobelchior
added
scope: code-infra
bernardobelchior
changed the title
reactStrictMode from @testing-library/reactStrictMode not being enabled for React 19 tests
bernardobelchior
changed the title
StrictMode not being enabled for React 19 testsStrictMode effects not being called twice in React 19 tests
Netlify deploy previewhttps://deploy-preview-45812--material-ui.netlify.app/ Bundle size report |
bernardobelchior
force-pushed
the
render-strict-mode
branch
from
6aa514f to
99bc517
Compare
bernardobelchior
commented
Apr 4, 2025
| @@ -20,4 +20,7 @@ module.exports = { | |||
| '**/build/**', | |||
| 'docs/.next/**', | |||
| ], | |||
| // detect-modules doesn't work with @babel/register | |||
| // https://github.com/babel/babel/issues/6737 | |||
| 'node-option': ['no-experimental-detect-module'], | |||
There was a problem hiding this comment.
Cherry-picked from 0f92cc3 (#45630)
There was a problem hiding this comment.
This breaks again in Node 23, but ok, let's worry about that later
bernardobelchior
force-pushed
the
render-strict-mode
branch
2 times, most recently
from
b474437 to
61128ac
Compare
github-actions
bot
added
the
PR: out-of-date
bernardobelchior
force-pushed
the
render-strict-mode
branch
from
3b6b562 to
615c6b7
Compare
github-actions
bot
removed
the
PR: out-of-date
bernardobelchior
force-pushed
the
render-strict-mode
branch
from
615c6b7 to
03b54bc
Compare
github-actions
bot
added
the
PR: out-of-date
bernardobelchior
force-pushed
the
render-strict-mode
branch
from
03b54bc to
fba032e
Compare
github-actions
bot
removed
the
PR: out-of-date
|
@bernardobelchior Should we merge #45828? |
github-actions
bot
added
the
PR: out-of-date
We can. I'll just rebase this PR. |
bernardobelchior
force-pushed
the
render-strict-mode
branch
from
fba032e to
2ac5088
Compare
github-actions
bot
removed
the
PR: out-of-date
Janpot
approved these changes
Apr 9, 2025
bernardobelchior
force-pushed
the
render-strict-mode
branch
from
2ac5088 to
a90ab11
Compare
github-actions
bot
added
the
PR: out-of-date
bernardobelchior
force-pushed
the
render-strict-mode
branch
from
a90ab11 to
9c66533
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Related to testing-library/react-testing-library#1390.
In React 19,
StrictModewon't double-call effects on initial mount unlessStrictModeis at the root of the app. Our previous way of enablingStrictModecreated aWrapper, meaning that theWrappercomponent was at the root of the app, resulting in the double calling of effects not happening in initial mount in React 19.This PR uses the new property
reactStrictModefrom@testing-library/reactto enable double-calling on initial mount in React 19 tests.This option was introduced in this PR, that's why I also upgraded the dependency.
This PR also changes some tests. In the ones I was most confident, I actually updated the assertions. For the ones I wasn't, I disabled strict mode for that particular test in React 19. If you know how to fix it, please let me know 😄