Migrate to React 19 #2172
Draft
Migrate to React 19 #2172
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
- We set the `@types/react` and `@types/react-dom` package resolutions to `npm:types-react` and `npm:types-react-dom` according to the React 19 migration guide.
- `ReactDOM.render` and `ReactDOM.unmountComponentAtNode` have been removed in React 19. This commit replaces their usage with `rtl.render` and `rtl.cleanup` as recommended in the React 19 migration guide.
- The `renderHook` method in `@testing-library/react-hooks` has now been moved to `@testing-library/react`. This commit updates imports and usages of the `renderHook` function to comply with the new syntax requirements in the [react-hooks-testing-library migration guide](https://github.com/testing-library/react-hooks-testing-library/blob/chore/migration-guide/MIGRATION_GUIDE.md#waitfornextupdate).
- `react-is` has changed the `REACT_ELEMENT_TYPE` symbol from `'react.element'` to `'react.transitional.element'`. We want our changes to be non-breaking and backwards-compatible so we conditionally set the `REACT_ELEMENT_TYPE` based on the detected version of React.
- According to `@testing-library/react` docs, the `cleanup` function is called automatically during the `afterEach` hook and there is no need to manually call it.
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. |
aryaemami59
force-pushed
the
migrate-to-react-19
branch
from
4467482
to
e726eeb
Compare
aryaemami59
force-pushed
the
migrate-to-react-19
branch
from
b7877bc
to
93b6f07
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.
This PR:
Updates
reactandreact-domto v19 beta.Sets the
@types/reactand@types/react-dompackage resolutions tonpm:types-reactandnpm:types-react-domaccording to the React 19 migration guide.Runs tests against different versions of React during CI. Not sure if we want to keep this addition but for now it serves as a way for us to make sure the changes we make are non-breaking and can work with both React 18 and 19.
Removes the now deprecated
react-test-rendererpackage as recommended in the React 19 migration guide.Updates
@testing-library/reactto latest version.Updates
@testing-library/jest-domto latest version.Replaces the now removed
ReactDOM.rendercalls with therenderfunction from@testing-library/reactas recommended in the React 19 migration guide.Replaces the now removed
ReactDOM.unmountComponentAtNodecalls with thecleanupfunction from@testing-library/reactas recommended in the React 19 migration guide.Updates the import path of the
renderHookfunction from@testing-library/react-hooksto@testing-library/reactas recommended by A Note about React 18 Support and react-hooks-testing-library React 18 Migration guide.Removes the now unneeded
@testing-library/react-hookspackage.Updates the new
renderHookcalls according to react-hooks-testing-library React 18 Migration guide.Updates the inlined
react-isimplementation.Click to expand
react-isrelated detailsIn PR#28813
react-ischanged theREACT_ELEMENT_TYPEsymbol from'react.element'to'react.transitional.element'. We want our changes to be non-breaking and backwards-compatible so we conditionally set theREACT_ELEMENT_TYPEbased on the detected version of React. While this is not ideal, thereact-ispackage isCJSand not very tree-shakable. So for now we want to inline it as to not add unnecessary weight to bundle sizes, not to mention the conditional React version check helps keep our changes backwards-compatible.Removes unnecessary
rtl.cleanupfunction calls insideafterEachhooks as per@testing-library/reactdocs, it is done automatically.Expands version ranges of
reactand@types/reactinpeerDependenciesto include version 19.