update react to the latest version

[alexander-akait]

We need to update react to the latest version, related dependencies should be updated too, like react-tiny-popover and maybe other, also need to check all pages on warnings from react side and fix them (but I don't think we will have many of them)

[Rudra2637]

Hi @alexander-akait 👋
I'm interested in working on this issue. I’d like to upgrade React and the related dependencies and check the site for any warnings after the upgrade.
Please let me know if someone is already working on it or if there are any specific constraints I should keep in mind. Also, is there any preferred timeline for this task?

[alexander-akait]

You can go to https://github.com/webpack/webpack.js.org/pulls and see we have zero PRs related to this problem, it means this issue is free to work

[Rudra2637]

Yeah,i do know that fact.Is there any preferred timeline for this task ?
If not would love to raise a pr for this task

[rahul-kr-rai]

Hi @alexander-akait,

I want to work on issue #7920. Currently, the repo is using react@17.0.2 and react-dom@17.0.2, while the latest stable versions are react@19.2.4 and react-dom@19.2.4.

I plan to:

1. Upgrade React and React‑DOM to the latest versions.
2. Update related dependencies such as react-tiny-popover (and others if required).
3. Run the site locally to check for any warnings or breaking changes introduced by React 19.
4. Fix any issues that arise during the upgrade.

Please let me know if you’d like me to proceed with this approach or if there are any specific guidelines I should follow.

[theEquinoxDev]

Saw this open a few hours ago, so decided to work on this. Took me longer than I expected. react 19 really had some breaking changes. As a result, I ended up touching more files than I anticipated but I tested everything and everything builds and ofc all the tests pass. raised the PR - #7925

[rahul-kr-rai]

📝 update react to the latest version #7920

Approach Applied

Dependency Updates

• Upgraded React, React-DOM, and React-test-renderer to v19.2.4.
• Updated related libraries:
  • react-tiny-popover
  • react-router-dom
  • react-helmet-async
  • @docsearch/react

Codebase Refactoring

• Replaced deprecated ReactDOM.render / ReactDOM.hydrate with createRoot and hydrateRoot in index.jsx.
• Updated App.jsx to pass loadContent instead of import.
• Verified Site.jsx routing setup with React Router v7 (Routes, Route, Outlet).
• Corrected JSX attributes (charSet in Helmet).
• Adjusted PropTypes to match new prop naming (loadContent).

---

Test Results

1. yarn start

• Initial error: render is not a function → fixed by migrating to createRoot/hydrateRoot.
• New runtime error: findDOMNode is not a function → caused by react-visibility-sensor.
• Resolution: replace with react-intersection-observer or fork/patch.

2. yarn test

• Pipeline failed at lint:prettier stage.
• Error: "lint:prettier" exited with 1 → formatting issues across multiple files.
• Jest tests did not run because linting stopped execution.
• Resolution: run yarn prettier --write . to auto-fix formatting, then re-run tests.

3. yarn build

• Failed during clean-printable step.
• Error: Illegal characters in path from rimraf on Windows when globbing src/content/**/printable.mdx.

---

Outcomes

• ✅ React core and major dependencies successfully upgraded.
• ✅ Entry point modernized for React 19.
• ✅ Routing verified and compatible with React Router v7.
• ⚠️ Runtime incompatibility found in react-visibility-sensor (uses findDOMNode).

---