Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/react 19 #7476

Merged
merged 15 commits into from
May 25, 2024
Merged

Feature/react 19 #7476

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
cdd8ea7
feat: react19 deps
TkDodo May 24, 2024
7db09c5
fix: useRef usage
TkDodo May 24, 2024
93f1b57
fix: don't use global JSX namespace
TkDodo May 24, 2024
e8395fb
fix: overwrite react globally to v19
TkDodo May 24, 2024
558b419
fix test assertion
TkDodo May 24, 2024
83d0e8c
fix hydration tests
TkDodo May 24, 2024
11d73bf
console output is weird in 19
TkDodo May 24, 2024
7016b42
async is hard
TkDodo May 24, 2024
e728bfe
react really wants no side-effects during render
TkDodo May 24, 2024
f927611
fix: use react19 everywhere
TkDodo May 24, 2024
d5aeb75
Revert "fix: use react19 everywhere"
TkDodo May 24, 2024
121ff26
just ignore react in sherif as we can have examples with different ve…
TkDodo May 24, 2024
7f69588
feat: add the react-compiler linter
TkDodo May 25, 2024
2e88c8b
Merge branch 'main' into feature/react-19
TkDodo May 25, 2024
5f27404
chore: move examples to react 19, except nextJs ones
TkDodo May 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions examples/react/algolia/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"algoliasearch": "4.23.3",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@tanstack/eslint-plugin-query": "^5.35.6",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/basic-graphql-request/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@
"@tanstack/react-query-devtools": "^5.38.0",
"graphql": "^16.8.1",
"graphql-request": "^7.0.1",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@vitejs/plugin-react": "^4.2.1",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/basic-typescript/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
"@tanstack/react-query-devtools": "^5.38.0",
"@tanstack/react-query-persist-client": "^5.38.0",
"axios": "^1.6.8",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@tanstack/eslint-plugin-query": "^5.35.6",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/basic/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"axios": "^1.6.8",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@tanstack/eslint-plugin-query": "^5.35.6",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/default-query-function/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"axios": "^1.6.8",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@vitejs/plugin-react": "^4.2.1",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/offline/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,8 @@
"@tanstack/react-query-persist-client": "^5.38.0",
"ky": "^1.2.4",
"msw": "^2.3.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-hot-toast": "^2.4.1"
},
"devDependencies": {
Expand Down
4 changes: 2 additions & 2 deletions examples/react/playground/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@
"dependencies": {
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@vitejs/plugin-react": "^4.2.1",
Expand Down
2 changes: 1 addition & 1 deletion examples/react/react-native/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
"expo": "^51.0.8",
"expo-constants": "^16.0.1",
"expo-status-bar": "^1.12.1",
"react": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-native": "^0.74.1",
"react-native-gesture-handler": "^2.16.2",
"react-native-paper": "^5.8.0",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/react-router/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@
"@tanstack/react-query-devtools": "^5.38.0",
"localforage": "^1.10.0",
"match-sorter": "^6.3.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-router": "^6.23.1",
"react-router-dom": "^6.23.1",
"rooks": "^7.14.1",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/rick-morty/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
"@mui/styles": "^5.15.18",
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-router": "^6.23.1",
"react-router-dom": "^6.23.1"
},
Expand Down
4 changes: 2 additions & 2 deletions examples/react/shadow-dom/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@
"dependencies": {
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@types/react": "^18.2.79",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/simple/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"axios": "^1.6.8",
"react": "^18.2.0",
"react-dom": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522"
},
"devDependencies": {
"@vitejs/plugin-react": "^4.2.1",
Expand Down
4 changes: 2 additions & 2 deletions examples/react/star-wars/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
"@mui/styles": "^5.15.18",
"@tanstack/react-query": "^5.38.0",
"@tanstack/react-query-devtools": "^5.38.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-router": "^6.23.1",
"react-router-dom": "^6.23.1"
},
Expand Down
4 changes: 2 additions & 2 deletions examples/react/suspense/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
"@tanstack/react-query-devtools": "^5.38.0",
"axios": "^1.6.8",
"font-awesome": "^4.7.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-error-boundary": "^4.0.13"
},
"devDependencies": {
Expand Down
4 changes: 2 additions & 2 deletions integrations/react-cra4/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
"dependencies": {
"@tanstack/react-query": "workspace:*",
"@tanstack/react-query-devtools": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-scripts": "^4.0.3"
},
"devDependencies": {
Expand Down
4 changes: 2 additions & 2 deletions integrations/react-cra5/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
"dependencies": {
"@tanstack/react-query": "workspace:*",
"@tanstack/react-query-devtools": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-scripts": "^5.0.1"
},
"devDependencies": {
Expand Down
4 changes: 2 additions & 2 deletions integrations/react-vite/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@
"@tanstack/react-query": "workspace:*",
"@tanstack/react-query-devtools": "workspace:*",
"@vitejs/plugin-react": "^4.2.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"vite": "^5.2.11"
}
}
14 changes: 8 additions & 6 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
"test:ci": "nx run-many --targets=test:format,test:sherif,test:knip,test:eslint,test:lib,test:types,test:build,build,test:attw",
"test:eslint": "nx affected --target=test:eslint --exclude=examples/**",
"test:format": "pnpm run prettier --check",
"test:sherif": "sherif -i react-scripts",
"test:sherif": "sherif -i react-scripts -i react -i react-dom",
"test:lib": "nx affected --target=test:lib --exclude=examples/**",
"test:lib:dev": "pnpm run test:lib && nx watch --all -- pnpm run test:lib",
"test:build": "nx affected --target=test:build --exclude=examples/**",
Expand Down Expand Up @@ -50,8 +50,8 @@
"@testing-library/react": "^15.0.7",
"@types/eslint": "^8.56.10",
"@types/node": "^20.12.12",
"@types/react": "^18.2.79",
"@types/react-dom": "^18.2.25",
"@types/react": "npm:types-react@rc",
"@types/react-dom": "npm:types-react-dom@rc",
"@typescript-eslint/eslint-plugin": "^6.20.0",
"@typescript-eslint/parser": "^6.20.0",
"@vitest/coverage-istanbul": "^1.6.0",
Expand All @@ -71,8 +71,8 @@
"prettier": "^4.0.0-alpha.8",
"prettier-plugin-svelte": "^3.2.3",
"publint": "^0.2.7",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"rimraf": "^5.0.7",
"sherif": "^0.8.4",
"solid-js": "^1.8.17",
Expand All @@ -85,7 +85,9 @@
"overrides": {
"@typescript-eslint/eslint-plugin": "$@typescript-eslint/eslint-plugin",
"@typescript-eslint/parser": "$@typescript-eslint/parser",
"eslint": "$eslint"
"eslint": "$eslint",
"@types/react": "npm:types-react@rc",
"@types/react-dom": "npm:types-react-dom@rc"
}
}
}
6 changes: 3 additions & 3 deletions packages/react-query-devtools/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,12 +72,12 @@
},
"devDependencies": {
"@tanstack/react-query": "workspace:*",
"@types/react": "^18.2.79",
"@types/react": "npm:types-react@rc",
"@vitejs/plugin-react": "^4.2.1",
"react": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522"
},
"peerDependencies": {
"@tanstack/react-query": "workspace:^",
"react": "^18.0.0"
"react": "^18 || ^19"
}
}
8 changes: 4 additions & 4 deletions packages/react-query-next-experimental/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,14 +42,14 @@
},
"devDependencies": {
"@tanstack/react-query": "workspace:*",
"@types/react": "^18.2.79",
"@types/react": "npm:types-react@rc",
"@vitejs/plugin-react": "^4.2.1",
"next": "^14.0.0",
"react": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522"
},
"peerDependencies": {
"@tanstack/react-query": "workspace:^",
"next": "^13 || ^14",
"react": "^18.0.0"
"next": "^13 || ^14 || ^15",
"react": "^18 || ^19"
}
}
6 changes: 3 additions & 3 deletions packages/react-query-persist-client/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,12 +51,12 @@
},
"devDependencies": {
"@tanstack/react-query": "workspace:*",
"@types/react": "^18.2.79",
"@types/react": "npm:types-react@rc",
"@vitejs/plugin-react": "^4.2.1",
"react": "^18.2.0"
"react": "19.0.0-rc-4c2e457c7c-20240522"
},
"peerDependencies": {
"@tanstack/react-query": "workspace:^",
"react": "^18.0.0"
"react": "^18 || ^19"
}
}
2 changes: 1 addition & 1 deletion packages/react-query-persist-client/src/PersistQueryClientProvider.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export const PersistQueryClientProvider = ({
persistOptions,
onSuccess,
...props
}: PersistQueryClientProviderProps): JSX.Element => {
}: PersistQueryClientProviderProps): React.JSX.Element => {
const [isRestoring, setIsRestoring] = React.useState(true)
const refs = React.useRef({ persistOptions, onSuccess })
const didRestore = React.useRef(false)
Expand Down
10 changes: 10 additions & 0 deletions packages/react-query/.eslintrc.cjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,20 @@
/** @type {import('eslint').Linter.Config} */
const config = {
extends: ['plugin:react/jsx-runtime', 'plugin:react-hooks/recommended'],
plugins: ['react-compiler'],
rules: {
'react-compiler/react-compiler': 'error',
'react/jsx-key': ['error', { checkFragmentShorthand: true }],
'react-hooks/exhaustive-deps': 'error',
},
overrides: [
{
files: ['**/__tests__/**'],
rules: {
'react-compiler/react-compiler': 'off',
},
},
],
}

module.exports = config
9 changes: 5 additions & 4 deletions packages/react-query/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,11 +56,12 @@
"@tanstack/query-core": "workspace:*"
},
"devDependencies": {
"@types/react": "^18.2.79",
"@types/react-dom": "^18.2.25",
"@types/react": "npm:types-react@rc",
"@types/react-dom": "npm:types-react-dom@rc",
"@vitejs/plugin-react": "^4.2.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"eslint-plugin-react-compiler": "^0.0.0-experimental-c8b3f72-20240517",
"react": "19.0.0-rc-4c2e457c7c-20240522",
"react-dom": "19.0.0-rc-4c2e457c7c-20240522",
"react-error-boundary": "^4.0.13"
},
"peerDependencies": {
Expand Down
25 changes: 8 additions & 17 deletions packages/react-query/src/__tests__/ssr-hydration.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { afterAll, beforeAll, describe, expect, it, vi } from 'vitest'
import ReactDOM from 'react-dom'
import * as ReactDOMTestUtils from 'react-dom/test-utils'
import { hydrateRoot } from 'react-dom/client'
import { act } from 'react'
import * as ReactDOMServer from 'react-dom/server'

import {
Expand All @@ -14,9 +14,8 @@ import { createQueryClient, setIsServer, sleep } from './utils'

const ReactHydrate = (element: React.ReactElement, container: Element) => {
let root: any
ReactDOMTestUtils.act(() => {
// @ts-expect-error
root = ReactDOM.hydrateRoot(container, element)
act(() => {
root = hydrateRoot(container, element)
})
return () => {
root.unmount()
Expand Down Expand Up @@ -111,11 +110,8 @@ describe('Server side rendering with de/rehydration', () => {
)

// Check that we have no React hydration mismatches
// this should be zero calls and can be changed once we drop react17 support
expect(consoleMock).toHaveBeenNthCalledWith(
1,
'Warning: You are importing hydrateRoot from "react-dom" which is not supported. You should instead import it from "react-dom/client".',
)
expect(consoleMock).toHaveBeenCalledTimes(0)

expect(fetchDataSuccess).toHaveBeenCalledTimes(2)
expect(el.innerHTML).toBe(expectedMarkup)

Expand Down Expand Up @@ -189,8 +185,7 @@ describe('Server side rendering with de/rehydration', () => {
el,
)

// We expect exactly one console.error here, which is from the
expect(consoleMock).toHaveBeenCalledTimes(1)
expect(consoleMock).toHaveBeenCalledTimes(0)
expect(fetchDataError).toHaveBeenCalledTimes(2)
expect(el.innerHTML).toBe(expectedMarkup)
await sleep(50)
Expand Down Expand Up @@ -261,11 +256,7 @@ describe('Server side rendering with de/rehydration', () => {
)

// Check that we have no React hydration mismatches
// this should be zero calls and can be changed once we drop react17 support
expect(consoleMock).toHaveBeenNthCalledWith(
1,
'Warning: You are importing hydrateRoot from "react-dom" which is not supported. You should instead import it from "react-dom/client".',
)
expect(consoleMock).toHaveBeenCalledTimes(0)
expect(fetchDataSuccess).toHaveBeenCalledTimes(1)
expect(el.innerHTML).toBe(expectedMarkup)
await sleep(50)
Expand Down
Loading
Loading