react-redux icon indicating copy to clipboard operation
react-redux copied to clipboard

Migrate to React 19

Open aryaemami59 opened this issue 9 months ago • 2 comments

This PR:

  • [x] Updates react and react-dom to v19 beta.

  • [x] Sets 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.

  • [x] 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.

  • [x] Removes the now deprecated react-test-renderer package as recommended in the React 19 migration guide.

  • [x] Updates @testing-library/react to latest version.

  • [x] Updates @testing-library/jest-dom to latest version.

  • [x] Replaces the now removed ReactDOM.render calls with the render function from @testing-library/react as recommended in the React 19 migration guide.

  • [x] Replaces the now removed ReactDOM.unmountComponentAtNode calls with the cleanup function from @testing-library/react as recommended in the React 19 migration guide.

  • [x] Updates the import path of the renderHook function from @testing-library/react-hooks to @testing-library/react as recommended by A Note about React 18 Support and react-hooks-testing-library React 18 Migration guide.

  • [x] Removes the now unneeded @testing-library/react-hooks package.

  • [x] Updates the new renderHook calls according to react-hooks-testing-library React 18 Migration guide.

  • [x] Updates the inlined react-is implementation.

    Click to expand react-is related details

    In PR#28813 react-is 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. While this is not ideal, the react-is package is CJS and 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.

  • [x] Removes unnecessary rtl.cleanup function calls inside afterEach hooks as per @testing-library/react docs, it is done automatically.

  • [x] Expands version ranges of react and @types/react in peerDependencies to include version 19.

aryaemami59 avatar May 10 '24 23:05 aryaemami59