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

👷 Update react monorepo to v19 (major) #3201

Open
wants to merge 6 commits into
base: main
Choose a base branch
from
Open

👷 Update react monorepo to v19 (major) #3201

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
ff022b0
👷 Update react monorepo to v19
renovate[bot] Jan 7, 2025
9501171
fix typing issue in tests
BenoitZugmeyer Jan 7, 2025
8d40eff
Merge remote-tracking branch 'origin/main' into renovate/major-react-…
BenoitZugmeyer Jan 14, 2025
60d26e1
🏷️ fix tyipe issues in the developer extension
BenoitZugmeyer Jan 14, 2025
8022b91
⬆️ upgrade typings
BenoitZugmeyer Jan 14, 2025
448d472
🏷️🔧 skip lib check in the developer extension
BenoitZugmeyer Jan 14, 2025
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
8 changes: 4 additions & 4 deletions developer-extension/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@
"devDependencies": {
"@tabler/icons-react": "3.28.1",
"@types/chrome": "0.0.294",
"@types/react": "18.3.18",
"@types/react-dom": "18.3.5",
"@types/react": "19.0.7",
"@types/react-dom": "19.0.3",
"@webextension-toolbox/webpack-webextension-plugin": "3.3.1",
"copy-webpack-plugin": "12.0.2",
"css-loader": "7.1.2",
Expand All @@ -25,8 +25,8 @@
"@mantine/core": "7.16.0",
"@mantine/hooks": "7.16.0",
"clsx": "2.1.1",
"react": "18.3.1",
"react-dom": "18.3.1"
"react": "19.0.0",
"react-dom": "19.0.0"
},
"volta": {
"extends": "../package.json"
Expand Down
2 changes: 1 addition & 1 deletion developer-extension/src/panel/components/tabs/eventsTab/columnDrag.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export function ColumnDrag({
columns,
onColumnsChange,
}: {
headerRowRef: RefObject<HTMLDivElement>
headerRowRef: RefObject<HTMLDivElement | null>
columns: EventListColumn[]
onColumnsChange: (columns: EventListColumn[]) => void
}) {
Expand Down
2 changes: 1 addition & 1 deletion developer-extension/src/panel/hooks/useEvents/useEvents.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export function useEvents({
const [events, setEvents] = useState<SdkEvent[]>([])
const [filters, setFilters] = useState<EventFilters>(DEFAULT_FILTERS)

const eventCollectionRef = useRef<EventCollection>()
const eventCollectionRef = useRef<EventCollection>(null)

function clearEvents() {
eventCollectionRef.current?.clear()
Expand Down
3 changes: 2 additions & 1 deletion developer-extension/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
"target": "esnext",
"jsx": "react",
"lib": ["ES2022", "DOM"],
"types": ["chrome", "react", "react-dom", "jasmine"]
"types": ["chrome", "react", "react-dom", "jasmine"],
"skipLibCheck": true
}
}
10 changes: 5 additions & 5 deletions packages/rum-react/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
"@datadog/browser-rum-core": "6.0.0"
},
"peerDependencies": {
"react": "18",
"react": "18 || 19",
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

❓ question: ‏Can you explain why 18 || 19? My guess is not break customer integrations using v18? Does it means we have to do it for every new major version of React?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

(discussed IRL, but for the record:)

  • Renovate did this change automatically
  • It indicates that the react plugin supports both react 18 and 19. It probably support anterior versions but I didn't test it.
  • We'll need to add a new version for every major version of react, which should not be a big deal.
  • It will also allow us to drop support for old react versions when it proves to be unmaintainable.
  • Ideally we should run the unit tests for each version of react, or at least the oldest we support, to make sure we don't inadvertently break old versions support... but it would be a challenge to implement with our current unit test setup, so let's keep it in mind when we drop karma.

"react-router-dom": "6"
},
"peerDependenciesMeta": {
Expand All @@ -34,10 +34,10 @@
}
},
"devDependencies": {
"@types/react": "18.3.18",
"@types/react-dom": "18.3.5",
"react": "18.3.1",
"react-dom": "18.3.1",
"@types/react": "19.0.7",
"@types/react-dom": "19.0.3",
"react": "19.0.0",
"react-dom": "19.0.0",
"react-router-dom": "6.28.1"
},
"repository": {
Expand Down
9 changes: 8 additions & 1 deletion packages/rum-react/src/domain/error/errorBoundary.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,14 @@ describe('ErrorBoundary', () => {
<ComponentSpy />
</ErrorBoundary>
)
expect(fallbackSpy).toHaveBeenCalledWith({ error: new Error('error'), resetError: jasmine.any(Function) }, {})
expect(fallbackSpy).toHaveBeenCalled()
// React calls the component multiple times while rendering
fallbackSpy.calls.all().forEach(({ args }) => {
expect(args[0]).toEqual({
error: new Error('error'),
resetError: jasmine.any(Function),
})
})
expect(container.innerHTML).toBe('fallback')
})

Expand Down
125 changes: 63 additions & 62 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -351,13 +351,13 @@ __metadata:
dependencies:
"@datadog/browser-core": "npm:6.0.0"
"@datadog/browser-rum-core": "npm:6.0.0"
"@types/react": "npm:18.3.18"
"@types/react-dom": "npm:18.3.5"
react: "npm:18.3.1"
react-dom: "npm:18.3.1"
"@types/react": "npm:19.0.7"
"@types/react-dom": "npm:19.0.3"
react: "npm:19.0.0"
react-dom: "npm:19.0.0"
react-router-dom: "npm:6.28.1"
peerDependencies:
react: 18
react: 18 || 19
react-router-dom: 6
peerDependenciesMeta:
"@datadog/browser-rum":
Expand Down Expand Up @@ -412,15 +412,15 @@ __metadata:
"@mantine/hooks": "npm:7.16.0"
"@tabler/icons-react": "npm:3.28.1"
"@types/chrome": "npm:0.0.294"
"@types/react": "npm:18.3.18"
"@types/react-dom": "npm:18.3.5"
"@types/react": "npm:19.0.7"
"@types/react-dom": "npm:19.0.3"
"@webextension-toolbox/webpack-webextension-plugin": "npm:3.3.1"
clsx: "npm:2.1.1"
copy-webpack-plugin: "npm:12.0.2"
css-loader: "npm:7.1.2"
html-webpack-plugin: "npm:5.6.3"
react: "npm:18.3.1"
react-dom: "npm:18.3.1"
react: "npm:19.0.0"
react-dom: "npm:19.0.0"
style-loader: "npm:4.0.0"
webpack: "npm:5.97.1"
languageName: unknown
Expand Down Expand Up @@ -492,7 +492,14 @@ __metadata:
languageName: node
linkType: hard

"@eslint-community/regexpp@npm:^4.10.0, @eslint-community/regexpp@npm:^4.12.1":
"@eslint-community/regexpp@npm:^4.10.0":
version: 4.10.0
resolution: "@eslint-community/regexpp@npm:4.10.0"
checksum: 10c0/c5f60ef1f1ea7649fa7af0e80a5a79f64b55a8a8fa5086de4727eb4c86c652aedee407a9c143b8995d2c0b2d75c1222bec9ba5d73dbfc1f314550554f0979ef4
languageName: node
linkType: hard

"@eslint-community/regexpp@npm:^4.12.1":
version: 4.12.1
resolution: "@eslint-community/regexpp@npm:4.12.1"
checksum: 10c0/a03d98c246bcb9109aec2c08e4d10c8d010256538dcb3f56610191607214523d4fb1b00aa81df830b6dffb74c5fa0be03642513a289c567949d3e550ca11cdf6
Expand Down Expand Up @@ -2017,13 +2024,6 @@ __metadata:
languageName: node
linkType: hard

"@types/prop-types@npm:*":
version: 15.7.3
resolution: "@types/prop-types@npm:15.7.3"
checksum: 10c0/511aac811bfdba9dd1c463d6e502d852bb2196048cf861fbf48a97d883dd32c1c44ad2127a18dbb49733d9ad0aafd445d673eb50d5547ca843106835f67b5877
languageName: node
linkType: hard

"@types/qs@npm:*":
version: 6.9.5
resolution: "@types/qs@npm:6.9.5"
Expand All @@ -2038,22 +2038,21 @@ __metadata:
languageName: node
linkType: hard

"@types/react-dom@npm:18.3.5":
version: 18.3.5
resolution: "@types/react-dom@npm:18.3.5"
"@types/react-dom@npm:19.0.3":
version: 19.0.3
resolution: "@types/react-dom@npm:19.0.3"
peerDependencies:
"@types/react": ^18.0.0
checksum: 10c0/b163d35a6b32a79f5782574a7aeb12a31a647e248792bf437e6d596e2676961c394c5e3c6e91d1ce44ae90441dbaf93158efb4f051c0d61e2612f1cb04ce4faa
"@types/react": ^19.0.0
checksum: 10c0/3867427b333cbe8cbba496d7cc20ec9676d32c25ae44f4d1263a4129d42e57cf4adf0039ad263432f1215b88075c27d326e7eb4ed646128235d01a76e661d48f
languageName: node
linkType: hard

"@types/react@npm:18.3.18":
version: 18.3.18
resolution: "@types/react@npm:18.3.18"
"@types/react@npm:19.0.7":
version: 19.0.7
resolution: "@types/react@npm:19.0.7"
dependencies:
"@types/prop-types": "npm:*"
csstype: "npm:^3.0.2"
checksum: 10c0/8fb2b00672072135d0858dc9db07873ea107cc238b6228aaa2a9afd1ef7a64a7074078250db38afbeb19064be8ea6af5eac32d404efdd5f45e093cc4829d87f8
checksum: 10c0/818e546fa03a2a65ac2652fc472891ac96684211e8967bc25e1da6a8a09e2301ad972b1b038d128f8b4cbbd7691f6f57fee274db568169e9b6b01556abbb5bee
languageName: node
linkType: hard

Expand Down Expand Up @@ -2814,7 +2813,7 @@ __metadata:
languageName: node
linkType: hard

"acorn@npm:^8.14.0, acorn@npm:^8.4.1, acorn@npm:^8.8.2":
"acorn@npm:^8.12.0, acorn@npm:^8.14.0, acorn@npm:^8.4.1, acorn@npm:^8.8.2":
version: 8.14.0
resolution: "acorn@npm:8.14.0"
bin:
Expand Down Expand Up @@ -5690,7 +5689,7 @@ __metadata:
languageName: node
linkType: hard

"eslint-visitor-keys@npm:^4.2.0":
"eslint-visitor-keys@npm:^4.0.0, eslint-visitor-keys@npm:^4.2.0":
version: 4.2.0
resolution: "eslint-visitor-keys@npm:4.2.0"
checksum: 10c0/2ed81c663b147ca6f578312919483eb040295bbab759e5a371953456c636c5b49a559883e2677112453728d66293c0a4c90ab11cab3428cf02a0236d2e738269
Expand Down Expand Up @@ -5758,7 +5757,7 @@ __metadata:
languageName: node
linkType: hard

"espree@npm:^10.0.1, espree@npm:^10.1.0, espree@npm:^10.3.0":
"espree@npm:^10.0.1, espree@npm:^10.3.0":
version: 10.3.0
resolution: "espree@npm:10.3.0"
dependencies:
Expand All @@ -5769,6 +5768,17 @@ __metadata:
languageName: node
linkType: hard

"espree@npm:^10.1.0":
version: 10.1.0
resolution: "espree@npm:10.1.0"
dependencies:
acorn: "npm:^8.12.0"
acorn-jsx: "npm:^5.3.2"
eslint-visitor-keys: "npm:^4.0.0"
checksum: 10c0/52e6feaa77a31a6038f0c0e3fce93010a4625701925b0715cd54a2ae190b3275053a0717db698697b32653788ac04845e489d6773b508d6c2e8752f3c57470a0
languageName: node
linkType: hard

"esprima@npm:^4.0.0, esprima@npm:^4.0.1":
version: 4.0.1
resolution: "esprima@npm:4.0.1"
Expand Down Expand Up @@ -6851,7 +6861,7 @@ __metadata:
languageName: node
linkType: hard

"globals@npm:15.14.0, globals@npm:^15.9.0":
"globals@npm:15.14.0":
version: 15.14.0
resolution: "globals@npm:15.14.0"
checksum: 10c0/039deb8648bd373b7940c15df9f96ab7508fe92b31bbd39cbd1c1a740bd26db12457aa3e5d211553b234f30e9b1db2fee3683012f543a01a6942c9062857facb
Expand All @@ -6872,6 +6882,13 @@ __metadata:
languageName: node
linkType: hard

"globals@npm:^15.9.0":
version: 15.11.0
resolution: "globals@npm:15.11.0"
checksum: 10c0/861e39bb6bd9bd1b9f355c25c962e5eb4b3f0e1567cf60fa6c06e8c502b0ec8706b1cce055d69d84d0b7b8e028bec5418cf629a54e7047e116538d1c1c1a375c
languageName: node
linkType: hard

"globalthis@npm:^1.0.3":
version: 1.0.3
resolution: "globalthis@npm:1.0.3"
Expand Down Expand Up @@ -8101,7 +8118,7 @@ __metadata:
languageName: node
linkType: hard

"js-tokens@npm:^3.0.0 || ^4.0.0, js-tokens@npm:^4.0.0":
"js-tokens@npm:^4.0.0":
version: 4.0.0
resolution: "js-tokens@npm:4.0.0"
checksum: 10c0/e248708d377aa058eacf2037b07ded847790e6de892bbad3dac0abba2e759cb9f121b00099a65195616badcb6eca8d14d975cb3e89eb1cfda644756402c8aeed
Expand Down Expand Up @@ -8896,17 +8913,6 @@ __metadata:
languageName: node
linkType: hard

"loose-envify@npm:^1.1.0":
version: 1.4.0
resolution: "loose-envify@npm:1.4.0"
dependencies:
js-tokens: "npm:^3.0.0 || ^4.0.0"
bin:
loose-envify: cli.js
checksum: 10c0/655d110220983c1a4b9c0c679a2e8016d4b67f6e9c7b5435ff5979ecdb20d0813f4dec0a08674fcbdd4846a3f07edbb50a36811fd37930b94aaa0d9daceb017e
languageName: node
linkType: hard

"lower-case@npm:^2.0.2":
version: 2.0.2
resolution: "lower-case@npm:2.0.2"
Expand Down Expand Up @@ -11223,15 +11229,14 @@ __metadata:
languageName: node
linkType: hard

"react-dom@npm:18.3.1":
version: 18.3.1
resolution: "react-dom@npm:18.3.1"
"react-dom@npm:19.0.0":
version: 19.0.0
resolution: "react-dom@npm:19.0.0"
dependencies:
loose-envify: "npm:^1.1.0"
scheduler: "npm:^0.23.2"
scheduler: "npm:^0.25.0"
peerDependencies:
react: ^18.3.1
checksum: 10c0/a752496c1941f958f2e8ac56239172296fcddce1365ce45222d04a1947e0cc5547df3e8447f855a81d6d39f008d7c32eab43db3712077f09e3f67c4874973e85
react: ^19.0.0
checksum: 10c0/a36ce7ab507b237ae2759c984cdaad4af4096d8199fb65b3815c16825e5cfeb7293da790a3fc2184b52bfba7ba3ff31c058c01947aff6fd1a3701632aabaa6a9
languageName: node
linkType: hard

Expand Down Expand Up @@ -11340,12 +11345,10 @@ __metadata:
languageName: node
linkType: hard

"react@npm:18.3.1":
version: 18.3.1
resolution: "react@npm:18.3.1"
dependencies:
loose-envify: "npm:^1.1.0"
checksum: 10c0/283e8c5efcf37802c9d1ce767f302dd569dd97a70d9bb8c7be79a789b9902451e0d16334b05d73299b20f048cbc3c7d288bbbde10b701fa194e2089c237dbea3
"react@npm:19.0.0":
version: 19.0.0
resolution: "react@npm:19.0.0"
checksum: 10c0/9cad8f103e8e3a16d15cb18a0d8115d8bd9f9e1ce3420310aea381eb42aa0a4f812cf047bb5441349257a05fba8a291515691e3cb51267279b2d2c3253f38471
languageName: node
linkType: hard

Expand Down Expand Up @@ -11867,12 +11870,10 @@ __metadata:
languageName: node
linkType: hard

"scheduler@npm:^0.23.2":
version: 0.23.2
resolution: "scheduler@npm:0.23.2"
dependencies:
loose-envify: "npm:^1.1.0"
checksum: 10c0/26383305e249651d4c58e6705d5f8425f153211aef95f15161c151f7b8de885f24751b377e4a0b3dd42cce09aad3f87a61dab7636859c0d89b7daf1a1e2a5c78
"scheduler@npm:^0.25.0":
version: 0.25.0
resolution: "scheduler@npm:0.25.0"
checksum: 10c0/a4bb1da406b613ce72c1299db43759526058fdcc413999c3c3e0db8956df7633acf395cb20eb2303b6a65d658d66b6585d344460abaee8080b4aa931f10eaafe
languageName: node
linkType: hard

Expand Down
Loading