chore(react-query): add support for react19 in v4

[gwansikk]

Hello! I am the maintainer of the Suspensive (react-query community project)

With the release of React 19 Stable, we are working to make Suspensive compatible with React 19 as well. However, we are encountering an issue because react-query v4 does not yet support React 19. To address this, I propose that react-query v4 should also include React 19 in its package dependencies.

• Community project libraries using react-query v4 may face similar issues, especially if those libraries aim to support React 19.
• I still believe that React Query v4 should support React 19. React 19 has similar browser compatibility to its predecessor, React 18, and I think v4 can be sufficiently used instead of v5 to support more browsers and be utilized in environments using React 19.

[nx-cloud]

View your CI Pipeline Execution ↗ for commit 2c1cc86.

Command	Status	Duration	Result
nx affected --targets=test:eslint,test:lib,test...	❌ Failed	1m 8s	View ↗
nx affected --targets=test:lib --base=92e5672f5...	✅ Succeeded	8s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-01-28 10:42:21 UTC

[manudeli]

query/packages/react-query-devtools/package.json

Line 56 in 92e5672

"react": "^18.2.0",

@gwansikk Cool! PeerDep of other packages depending on react should be updated!

[chukwumaokere]

Using v4 and would love this addition

[gwansikk]

The task was delayed due to a busy schedule, but it will be completed soon.

[codesandbox-ci]

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.

Latest deployment of this branch, based on commit 2c1cc86:

Sandbox	Source
@tanstack/query-example-react-basic-typescript	Configuration
@tanstack/query-example-solid-basic-typescript	Configuration
@tanstack/query-example-svelte-basic	Configuration
@tanstack/query-example-vue-basic	Configuration

[gwansikk]

I’ve been working on making react-query compatible with React 19 but encountered a few issues:

• After upgrading to React 19, the number of query calls in the test code changes, causing test failures. I couldn’t identify the root cause since the version upgrade was the only change. Strangely, the tests sometimes pass when run multiple times locally.

• To keep tests running for versions other than React 19, I had to specify React 18 in pnpm using overrides. Without this, dependencies are locked to React 19, breaking test code for React 17 and 18 due to changes in JSX and act. Even forcing dependency injection via .pnpmfile.cjs didn’t fix it.

I’ve tested compatibility with React 19 using pnpm pack and local file linking, and it seems to work. However, the issues above make it feel incomplete. Any suggestions for a better approach? Your guidance would be greatly appreciated. Thank you!

@TkDodo

[gwansikk]

To test React 17 and 18, I had to use overrides.
Currently, react-query executes the test environment for each React version through PR-CI. However, since the version of @testing-library/react is fixed at React 19, errors occur due to breaking changes related to JSX and React.act.

'@testing-library/react-17':
  specifier: npm:@testing-library/[email protected]
  version: /@testing-library/[email protected]([email protected])([email protected]) # <<-- Fixed: React19
'@testing-library/react-18':
  specifier: npm:@testing-library/[email protected]
  version: /@testing-library/[email protected]([email protected])([email protected]) # <<-- Fixed: React19