update react-dom version

jest.config.js

@@ -62,6 +62,8 @@ module.exports = {
   //   "node_modules"
   // ],
 
+  modulePaths: ["node_modules", "<rootDir>/src"],
+
   // An array of file extensions your modules use
   moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "html", "svg"],
 

package.json

@@ -67,8 +67,8 @@
     "iframe-resizer-react": "1.1.0",
     "immutable": "4.0.0-rc.12",
     "is-ci": "2.0.0",
-    "jquery": "3.5.1",
-    "jquery-typeahead": "2.10.6",
+    "jquery": "3.6.0",
+    "jquery-typeahead": "2.11.1",
     "jquery-ui-dist": "1.12.1",
     "knockout": "3.5.1",
     "mkdirp": "1.0.4",
@@ -84,7 +84,7 @@
     "react-animate-height": "2.0.8",
     "react-dnd": "14.0.2",
     "react-dnd-html5-backend": "14.0.0",
-    "react-dom": "16.13.1",
+    "react-dom": "17.0.2",
     "react-hotkeys": "2.0.0",
     "react-i18next": "11.8.5",
     "react-notification-system": "0.2.17",
@@ -109,8 +109,7 @@
     "@types/codemirror": "0.0.56",
     "@types/crossroads": "0.0.30",
     "@types/d3": "5.9.2",
-    "@types/enzyme": "3.10.7",
-    "@types/enzyme-adapter-react-16": "1.0.6",
+    "@types/enzyme": "3.10.8",
     "@types/expect-puppeteer": "4.4.5",
     "@types/hasher": "0.0.31",
     "@types/jest": "26.0.20",
@@ -131,6 +130,7 @@
     "@types/underscore": "1.7.36",
     "@typescript-eslint/eslint-plugin": "4.0.1",
     "@typescript-eslint/parser": "4.0.1",
+    "@wojtekmaj/enzyme-adapter-react-17": "0.6.1",
     "babel-jest": "24.9.0",
     "babel-loader": "8.1.0",
     "buffer": "5.1.0",
@@ -140,14 +140,13 @@
     "create-file-webpack": "1.0.2",
     "css-loader": "1.0.0",
     "enzyme": "3.11.0",
-    "enzyme-adapter-react-16": "1.15.5",
-    "enzyme-to-json": "3.6.1",
+    "enzyme-to-json": "3.6.2",
     "eslint": "7.8.1",
     "eslint-cli": "1.1.1",
     "eslint-plugin-no-null": "1.0.2",
     "eslint-plugin-prefer-arrow": "1.2.2",
     "eslint-plugin-react-hooks": "4.2.0",
-    "expect-playwright": "0.3.3",
+    "expect-playwright": "0.3.4",
     "expose-loader": "0.7.5",
     "fast-glob": "3.2.5",
     "file-loader": "6.2.0",
@@ -158,7 +157,7 @@
     "html-webpack-plugin": "5.3.1",
     "jest": "25.5.4",
     "jest-canvas-mock": "2.1.0",
-    "jest-playwright-preset": "1.5.1",
+    "jest-playwright-preset": "1.5.2",
     "jest-trx-results-processor": "0.0.7",
     "less": "3.8.1",
     "less-loader": "4.1.0",

src/Explorer/Panes/SettingsPane/SettingsPane.test.tsx

@@ -1,7 +1,7 @@
+import { DatabaseAccount } from "Contracts/DataModels";
 import { shallow } from "enzyme";
 import React from "react";
-import { DatabaseAccount } from "../../../Contracts/DataModels";
-import { updateUserContext } from "../../../UserContext";
+import { updateUserContext } from "UserContext";
 import Explorer from "../../Explorer";
 import { SettingsPane } from "./SettingsPane";
 const props = {

src/Explorer/Panes/SettingsPane/SettingsPane.tsx

@@ -1,12 +1,12 @@
+import * as Constants from "Common/Constants";
+import { Tooltip } from "Common/Tooltip/Tooltip";
+import { configContext } from "ConfigContext";
 import { Checkbox, ChoiceGroup, IChoiceGroupOption, SpinButton } from "office-ui-fabric-react";
 import React, { FunctionComponent, MouseEvent, useState } from "react";
-import * as Constants from "../../../Common/Constants";
-import { Tooltip } from "../../../Common/Tooltip/Tooltip";
-import { configContext } from "../../../ConfigContext";
-import { LocalStorageUtility, StorageKey } from "../../../Shared/StorageUtility";
-import * as StringUtility from "../../../Shared/StringUtility";
-import { userContext } from "../../../UserContext";
-import { logConsoleInfo } from "../../../Utils/NotificationConsoleUtils";
+import { LocalStorageUtility, StorageKey } from "Shared/StorageUtility";
+import * as StringUtility from "Shared/StringUtility";
+import { userContext } from "UserContext";
+import { logConsoleInfo } from "Utils/NotificationConsoleUtils";
 import Explorer from "../../Explorer";
 import {
   GenericRightPaneComponent,

src/Explorer/Panes/UploadFilePane/UploadFilePane.tsx

@@ -1,6 +1,6 @@
+import { Upload } from "Common/Upload/Upload";
 import React, { ChangeEvent, FunctionComponent, useState } from "react";
-import { Upload } from "../../../Common/Upload/Upload";
-import { logConsoleError, logConsoleInfo, logConsoleProgress } from "../../../Utils/NotificationConsoleUtils";
+import { logConsoleError, logConsoleInfo, logConsoleProgress } from "Utils/NotificationConsoleUtils";
 import Explorer from "../../Explorer";
 import { NotebookContentItem } from "../../Notebook/NotebookContentItem";
 import {

src/Explorer/Panes/UploadItemsPane/UploadItemsPane.tsx

@@ -1,9 +1,9 @@
+import { Upload } from "Common/Upload/Upload";
+import { UploadDetailsRecord } from "Contracts/ViewModels";
 import { DetailsList, DetailsListLayoutMode, IColumn, SelectionMode } from "office-ui-fabric-react";
 import React, { ChangeEvent, FunctionComponent, useState } from "react";
-import { Upload } from "../../../Common/Upload/Upload";
-import { UploadDetailsRecord } from "../../../Contracts/ViewModels";
-import { userContext } from "../../../UserContext";
-import { logConsoleError } from "../../../Utils/NotificationConsoleUtils";
+import { userContext } from "UserContext";
+import { logConsoleError } from "Utils/NotificationConsoleUtils";
 import Explorer from "../../Explorer";
 import { getErrorMessage } from "../../Tables/Utilities";
 import {

src/Explorer/Panes/UploadItemsPane/__snapshots__/UploadItemsPane.test.tsx.snap

@@ -517,7 +517,9 @@ exports[`Upload Items Pane should render Default properly 1`] = `
       multiple={true}
       onUpload={[Function]}
       tabIndex={0}
-      tooltip="Select one or more JSON files to upload. Each file can contain a single JSON document or an array of JSON documents. The combined size of all files in an individual upload operation must be less than 2 MB. You can perform multiple upload operations for larger data sets."
+      tooltip="Select one or more JSON files to upload. Each file can contain a single JSON document or an array of JSON
+ documents. The combined size of all files in an individual upload operation must be less than 2 MB. You
+ can perform multiple upload operations for larger data sets."
     />
   </div>
 </GenericRightPaneComponent>

src/setupTests.ts

@@ -1,5 +1,5 @@
+import Adapter from "@wojtekmaj/enzyme-adapter-react-17";
 import { configure } from "enzyme";
-import Adapter from "enzyme-adapter-react-16";
 import "jest-canvas-mock";
 import { initializeIcons } from "office-ui-fabric-react";
 import { TextDecoder, TextEncoder } from "util";
@@ -7,7 +7,7 @@ configure({ adapter: new Adapter() });
 initializeIcons();
 
 if (typeof window.URL.createObjectURL === "undefined") {
-  Object.defineProperty(window.URL, "createObjectURL", { value: () => {} });
+  Object.defineProperty(window.URL, "createObjectURL", { value: () => { } });
 }
 
 // TODO Remove when jquery and documentdbclient SDK are removed

webpack.config.js

@@ -119,6 +119,9 @@ module.exports = function (_env = {}, argv = {}) {
     // new CaseSensitivePathsPlugin(),
     new ProvidePlugin({
       process: "process/browser",
+      React: "react",
+      $: "jquery",
+      jQuery: "jquery",
     }),
     new MiniCssExtractPlugin({
       filename: "[name].[contenthash].css",