fix(project): replace jsdom with react-test-renderer (#4789)

Author: Pavel910

packages/cli/files/references.json

@@ -33,14 +33,13 @@
     "find-up": "^5.0.0",
     "graphql-request": "^7.3.3",
     "humanize-duration": "3.33.1",
-    "jsdom": "^25.0.1",
     "lodash": "^4.17.21",
     "minimatch": "^5.1.6",
     "mqtt": "^5.14.1",
     "neverthrow": "^8.2.0",
     "p-retry": "^7.0.0",
     "react": "18.2.0",
-    "react-dom": "18.2.0",
+    "react-test-renderer": "18.3.1",
     "read-json-sync": "2.0.1",
     "replace-in-path": "^1.1.0",
     "serialize-error": "^12.0.0",
@@ -53,6 +52,7 @@
     "@types/humanize-duration": "^3.27.4",
     "@types/jsdom": "^21.1.7",
     "@types/lodash": "4.17.20",
+    "@types/react-test-renderer": "18.3.1",
     "@types/read-json-sync": "^2.0.3",
     "rimraf": "^6.0.1",
     "type-fest": "^5.2.0",

packages/project/package.json

@@ -2,11 +2,8 @@ import "tsx/esm";
 import { Properties, toObject } from "@webiny/react-properties";
 import debounce from "debounce";
 import React from "react";
-import { createRoot } from "react-dom/client";
+import Renderer from "react-test-renderer";
 import { serializeError } from "serialize-error";
-
-// @ts-expect-error jsdom types are messing up with the repo, so they're disabled in the root package.json.
-import { JSDOM } from "jsdom";
 import type { RenderConfigWorkerMessageDto, RenderConfigParamsDto } from "./renderConfig.js";
 import { ProjectModel } from "~/models/ProjectModel.js";
 
@@ -51,16 +48,7 @@ const onChange = debounce((value: any) => {
     process.exit(0);
 });
 
-const { window } = new JSDOM(`<div id="root"/>`);
-
-global.window = window;
-global.document = window.document;
-
-const root = window.document.getElementById("root");
-
-const reactRoot = createRoot(root);
-
-reactRoot.render(
+Renderer.create(
     <Properties onChange={onChange}>
         <Extensions />
     </Properties>

packages/project/src/services/GetProjectConfigService/renderConfigWorker.tsx

@@ -12740,6 +12740,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/react-test-renderer@npm:18.3.1":
+  version: 18.3.1
+  resolution: "@types/react-test-renderer@npm:18.3.1"
+  dependencies:
+    "@types/react": "npm:^18"
+  checksum: 10/f8cc23cc8decdb6068cdc8f8c306e189eab8e569443ce97b216e757ee42eb20b18d2280ef41e2955668413f14be92765a3ba86cfcfeeae6b20c965acd9674786
+  languageName: node
+  linkType: hard
+
 "@types/react-transition-group@npm:^4.4.12":
   version: 4.4.12
   resolution: "@types/react-transition-group@npm:4.4.12"
@@ -16349,6 +16358,7 @@ __metadata:
     "@types/humanize-duration": "npm:^3.27.4"
     "@types/jsdom": "npm:^21.1.7"
     "@types/lodash": "npm:4.17.20"
+    "@types/react-test-renderer": "npm:18.3.1"
     "@types/read-json-sync": "npm:^2.0.3"
     "@webiny/aws-sdk": "npm:0.0.0"
     "@webiny/build-tools": "npm:0.0.0"
@@ -16373,14 +16383,13 @@ __metadata:
     find-up: "npm:^5.0.0"
     graphql-request: "npm:^7.3.3"
     humanize-duration: "npm:3.33.1"
-    jsdom: "npm:^25.0.1"
     lodash: "npm:^4.17.21"
     minimatch: "npm:^5.1.6"
     mqtt: "npm:^5.14.1"
     neverthrow: "npm:^8.2.0"
     p-retry: "npm:^7.0.0"
     react: "npm:18.2.0"
-    react-dom: "npm:18.2.0"
+    react-test-renderer: "npm:18.3.1"
     read-json-sync: "npm:2.0.1"
     replace-in-path: "npm:^1.1.0"
     rimraf: "npm:^6.0.1"
@@ -30308,6 +30317,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-is@npm:^16.12.0 || ^17.0.0 || ^18.0.0, react-is@npm:^18.0.0, react-is@npm:^18.3.1":
+  version: 18.3.1
+  resolution: "react-is@npm:18.3.1"
+  checksum: 10/d5f60c87d285af24b1e1e7eaeb123ec256c3c8bdea7061ab3932e3e14685708221bf234ec50b21e10dd07f008f1b966a2730a0ce4ff67905b3872ff2042aec22
+  languageName: node
+  linkType: hard
+
 "react-is@npm:^16.13.1, react-is@npm:^16.7.0":
   version: 16.13.1
   resolution: "react-is@npm:16.13.1"
@@ -30322,13 +30338,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-is@npm:^18.0.0":
-  version: 18.3.1
-  resolution: "react-is@npm:18.3.1"
-  checksum: 10/d5f60c87d285af24b1e1e7eaeb123ec256c3c8bdea7061ab3932e3e14685708221bf234ec50b21e10dd07f008f1b966a2730a0ce4ff67905b3872ff2042aec22
-  languageName: node
-  linkType: hard
-
 "react-lazy-load@npm:^3.1.14":
   version: 3.1.14
   resolution: "react-lazy-load@npm:3.1.14"
@@ -30472,6 +30481,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-shallow-renderer@npm:^16.15.0":
+  version: 16.15.0
+  resolution: "react-shallow-renderer@npm:16.15.0"
+  dependencies:
+    object-assign: "npm:^4.1.1"
+    react-is: "npm:^16.12.0 || ^17.0.0 || ^18.0.0"
+  peerDependencies:
+    react: ^16.0.0 || ^17.0.0 || ^18.0.0
+  checksum: 10/06457fe5bcaa44aeca998905b6849304742ea1cc2d3841e4a0964c745ff392bc4dec07f8c779f317faacce3a0bf6f84e15020ac0fa81adb931067dbb0baf707b
+  languageName: node
+  linkType: hard
+
 "react-side-effect@npm:^2.1.0":
   version: 2.1.2
   resolution: "react-side-effect@npm:2.1.2"
@@ -30504,6 +30525,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-test-renderer@npm:18.3.1":
+  version: 18.3.1
+  resolution: "react-test-renderer@npm:18.3.1"
+  dependencies:
+    react-is: "npm:^18.3.1"
+    react-shallow-renderer: "npm:^16.15.0"
+    scheduler: "npm:^0.23.2"
+  peerDependencies:
+    react: ^18.3.1
+  checksum: 10/d53137315c677bdfba702a7179a69828233fc7635ae1e0c03b203923d643400ace72b343cb3dd3dafba8911c20bef53f55bff7aa2e4ddff3ccc423fdd9deeee2
+  languageName: node
+  linkType: hard
+
 "react-transition-group@npm:^4.4.5":
   version: 4.4.5
   resolution: "react-transition-group@npm:4.4.5"
@@ -31840,7 +31874,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"scheduler@npm:^0.23.0":
+"scheduler@npm:^0.23.0, scheduler@npm:^0.23.2":
   version: 0.23.2
   resolution: "scheduler@npm:0.23.2"
   dependencies: