Update dependencies

* Migrate to @reduxjs/toolkit * Migrate tests to msw 2.x * Switch suggested node version to lts/iron
zotero · Dec 5, 2023 · 94aa43f · 94aa43f
1 parent 632f160
commit 94aa43f
Show file tree

Hide file tree

Showing 28 changed files with 2,125 additions and 1,268 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -10,6 +10,6 @@ jobs:
       - name: Install Node
         uses: actions/setup-node@v3
         with:
-          node-version: 'lts/hydrogen'
+          node-version: 'lts/iron'
       - run: npm install
       - run: npm test
diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-lts/hydrogen
+lts/iron
diff --git a/jest.config.mjs b/jest.config.mjs
@@ -65,7 +65,7 @@ export default {
   // globalTeardown: undefined,
 
   // A set of global variables that need to be available in all test environments
-  // globals: {},
+// globals: {},
 
   // The maximum amount of workers used to run your tests. Can be specified as % or a number. E.g. maxWorkers: 10% will use 10% of your CPU amount + 1 as the maximum worker number. maxWorkers: 2 will use a maximum of 2 workers.
   maxWorkers: "50%",
@@ -138,7 +138,7 @@ export default {
   // runner: "jest-runner",
 
   // The paths to modules that run some code to configure or set up the testing environment before each test
-  // setupFiles: [],
+  setupFiles: ['./test/utils/jest-setup.js'],
 
   // A list of paths to modules that run some code to configure or set up the testing framework before each test
   // setupFilesAfterEnv: [],
@@ -150,7 +150,7 @@ export default {
   // snapshotSerializers: [],
 
   // The test environment that will be used for testing
-  testEnvironment: "jsdom",
+  testEnvironment: "./test/utils/env-with-fetch.js",
 
   // Options that will be passed to the testEnvironment
   testEnvironmentOptions: {

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -62,17 +62,17 @@
   ],
   "license": "AGPL-3.0",
   "dependencies": {
-    "@babel/runtime": "^7.23.1",
-    "@babel/runtime-corejs3": "^7.23.1",
-    "@floating-ui/react-dom": "^2.0.2",
-    "@reduxjs/toolkit": "^1.9.6",
+    "@babel/runtime": "^7.23.5",
+    "@babel/runtime-corejs3": "^7.23.5",
+    "@floating-ui/react-dom": "^2.0.4",
+    "@reduxjs/toolkit": "^2.0.1",
     "bootstrap-sass": "^3.4.3",
     "classnames": "^2.3.2",
     "combine-section-reducers": "^1.0.6",
     "connected-react-router": "^6.9.3",
     "copy-to-clipboard": "^3.3.3",
-    "core-js": "^3.32.2",
-    "deep-equal": "^2.2.2",
+    "core-js": "^3.34.0",
+    "deep-equal": "^2.2.3",
     "file-saver": "^2.0.5",
     "history": "<5.0.0",
     "memoize-one": "^6.0.0",
@@ -85,45 +85,45 @@
     "react-dnd-touch-backend": "^16.0.1",
     "react-dom": "^18.2.0",
     "react-modal": "^3.16.1",
-    "react-redux": "^8.1.2",
+    "react-redux": "^9.0.2",
     "react-router": "<6.0.0",
     "react-router-dom": "<6.0.0",
     "react-transition-group": "^4.4.5",
     "react-virtualized-auto-sizer": "^1.0.20",
-    "react-window": "^1.8.9",
+    "react-window": "^1.8.10",
     "react-window-infinite-loader": "^1.0.9",
-    "redux": "^4.2.1",
+    "redux": "^5.0.0",
     "redux-async-queue": "^1.0.0",
-    "redux-thunk": "^2.4.2",
-    "use-debounce": "^9.0.4",
+    "redux-thunk": "^3.1.0",
+    "use-debounce": "^10.0.0",
     "zotero-api-client": "^0.43.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.0",
-    "@babel/eslint-parser": "^7.22.15",
+    "@babel/core": "^7.23.5",
+    "@babel/eslint-parser": "^7.23.3",
     "@babel/plugin-proposal-class-properties": "^7.18.6",
-    "@babel/plugin-transform-async-to-generator": "^7.22.5",
-    "@babel/plugin-transform-runtime": "^7.22.15",
-    "@babel/preset-env": "^7.22.20",
-    "@babel/preset-react": "^7.22.15",
-    "@rollup/plugin-alias": "^5.0.0",
-    "@rollup/plugin-babel": "^6.0.3",
-    "@rollup/plugin-commonjs": "^25.0.4",
-    "@rollup/plugin-json": "^6.0.0",
-    "@rollup/plugin-node-resolve": "^15.2.1",
-    "@rollup/plugin-replace": "^5.0.2",
-    "@rollup/plugin-terser": "^0.4.3",
-    "@rollup/plugin-virtual": "^3.0.1",
-    "@rollup/plugin-wasm": "^6.2.1",
-    "@testing-library/jest-dom": "^6.1.3",
-    "@testing-library/react": "^14.0.0",
+    "@babel/plugin-transform-async-to-generator": "^7.23.3",
+    "@babel/plugin-transform-runtime": "^7.23.4",
+    "@babel/preset-env": "^7.23.5",
+    "@babel/preset-react": "^7.23.3",
+    "@rollup/plugin-alias": "^5.1.0",
+    "@rollup/plugin-babel": "^6.0.4",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-json": "^6.0.1",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-replace": "^5.0.5",
+    "@rollup/plugin-terser": "^0.4.4",
+    "@rollup/plugin-virtual": "^3.0.2",
+    "@rollup/plugin-wasm": "^6.2.2",
+    "@testing-library/jest-dom": "^6.1.5",
+    "@testing-library/react": "^14.1.2",
     "@testing-library/user-event": "^14.5.1",
     "@welldone-software/why-did-you-render": "^7.0.1",
     "autoprefixer": "^10.4.16",
     "babel-jest": "^29.7.0",
     "babel-plugin-add-module-exports": "^1.0.4",
     "chai": "^4.3.10",
-    "eslint": "^8.50.0",
+    "eslint": "^8.55.0",
     "eslint-plugin-jest-dom": "^5.1.0",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
@@ -132,31 +132,31 @@
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "mocha": "^10.2.0",
-    "msw": "^0.0.0-fetch.rc-20",
+    "msw": "^2.0.10",
     "node-fetch": "<3.0.0",
-    "nodemon": "^3.0.1",
+    "nodemon": "^3.0.2",
     "npm-run-all": "^4.1.5",
     "nyc": "^15.1.0",
-    "postcss": "^8.4.31",
-    "postcss-cli": "^10.1.0",
+    "postcss": "^8.4.32",
+    "postcss-cli": "^11.0.0",
     "react-test-renderer": "^18.2.0",
     "redux-mock-store": "^1.5.4",
     "rimraf": "^5.0.5",
-    "rollup": "^3.29.4",
+    "rollup": "^4.6.1",
     "rollup-plugin-filesize": "^10.0.0",
-    "rollup-plugin-sizes": "^1.0.5",
+    "rollup-plugin-sizes": "^1.0.6",
     "rollup-plugin-typescript2": "^0.36.0",
-    "rollup-plugin-visualizer": "^5.9.2",
+    "rollup-plugin-visualizer": "^5.10.0",
     "rollup-plugin-web-worker-loader": "^1.6.1",
     "run-sequence": "^2.2.1",
-    "sass": "^1.68.0",
+    "sass": "^1.69.5",
     "serve-static": "^1.15.0",
-    "stylelint": "^15.10.3",
-    "stylelint-config-recommended-scss": "^13.0.0",
+    "stylelint": "^15.11.0",
+    "stylelint-config-recommended-scss": "^13.1.0",
     "stylelint-config-standard": "^34.0.0",
-    "stylelint-config-standard-scss": "^11.0.0",
-    "stylelint-scss": "^5.2.1",
+    "stylelint-config-standard-scss": "^11.1.0",
+    "stylelint-scss": "^5.3.1",
     "tslib": "^2.6.2",
-    "typescript": "^5.2.2"
+    "typescript": "^5.3.2"
   }
 }
diff --git a/src/js/embedded.jsx b/src/js/embedded.jsx
@@ -1,7 +1,7 @@
 import { createRoot } from 'react-dom/client';
 import { createStore, applyMiddleware, compose } from 'redux';
 import ReduxAsyncQueue from 'redux-async-queue';
-import ReduxThunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { Provider } from 'react-redux';
 
 import { LOCATION_CHANGE } from 'connected-react-router';
@@ -42,7 +42,7 @@ const init = (element, config = {}) => {
 		createReducers(),
 		composeEnhancers(
 			applyMiddleware(
-				ReduxThunk,
+				thunk,
 				ReduxAsyncQueue
 			)
 		)

diff --git a/src/js/store.js b/src/js/store.js
@@ -1,7 +1,7 @@
 import { configureStore } from '@reduxjs/toolkit'
 import { connectRouter, routerMiddleware } from 'connected-react-router';
 import ReduxAsyncQueue from 'redux-async-queue';
-import ReduxThunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { createBrowserHistory } from 'history';
 
 import createReducers from './reducers';
@@ -10,7 +10,7 @@ export const setupStore = preloadedState => {
 	const history = createBrowserHistory();
 	const store = configureStore({
 		reducer: createReducers({ router: connectRouter(history) }),
-		middleware: [routerMiddleware(history), ReduxThunk, ReduxAsyncQueue],
+		middleware: () => [routerMiddleware(history), thunk, ReduxAsyncQueue],
 		devTools: true,
 		preloadedState
 	});

diff --git a/test/attachments.test.jsx b/test/attachments.test.jsx
@@ -3,7 +3,7 @@
 */
 
 import '@testing-library/jest-dom';
-import { rest, HttpResponse, delay } from 'msw'
+import { http, HttpResponse, delay } from 'msw'
 import { setupServer } from 'msw/node';
 import { findByRole, getByRole, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event'
@@ -51,18 +51,18 @@ describe('Attachments', () => {
 		let hasBeenUploaded = false;
 
 		server.use(
-			rest.get('https://api.zotero.org/users/1/items/VR82JUX8/children', () => {
+			http.get('https://api.zotero.org/users/1/items/VR82JUX8/children', () => {
 				return HttpResponse.json([], {
 					headers: { 'Total-Results': '0' }
 				});
 			}),
-			rest.get('https://api.zotero.org/items/new', ({request}) => {
+			http.get('https://api.zotero.org/items/new', ({request}) => {
 				const url = new URL(request.url);
 				expect(url.searchParams.get('itemType')).toBe('attachment');
 				expect(url.searchParams.get('linkMode')).toBe('imported_file');
 				return HttpResponse.json(newItemFileAttachment);
 			}),
-			rest.post('https://api.zotero.org/users/1/items', async ({request}) => {
+			http.post('https://api.zotero.org/users/1/items', async ({request}) => {
 				const items = await request.json();
 				expect(items[0].itemType).toBe('attachment');
 				expect(items[0].linkMode).toBe('imported_file');
@@ -71,14 +71,14 @@ describe('Attachments', () => {
 				hasBeenPosted = true;
 				return HttpResponse.json(testUserAddNewAttachmentFile);
 			}),
-			rest.post('https://api.zotero.org/users/1/items/FFIILLEE/file', async ({request}) => {
+			http.post('https://api.zotero.org/users/1/items/FFIILLEE/file', async ({request}) => {
 				const body = await request.text();
 				expect(body).toMatch(/filename=hello.pdf/);
 				hasBeenUploaded = true;
 				await delay(100); // ensure "ongoing" state is shown
 				return HttpResponse.json({ exists: 1 });
 			}),
-			rest.get('https://api.zotero.org/users/1/items', ({request}) => {
+			http.get('https://api.zotero.org/users/1/items', ({request}) => {
 				const url = new URL(request.url);
 				expect(url.searchParams.get('itemKey')).toBe('VR82JUX8');
 				return HttpResponse.json(testUserAddAttachamentFileRefetchParent, {
@@ -118,18 +118,18 @@ describe('Attachments', () => {
 		let hasBeenPosted = false;
 
 		server.use(
-			rest.get('https://api.zotero.org/users/1/items/VR82JUX8/children', () => {
+			http.get('https://api.zotero.org/users/1/items/VR82JUX8/children', () => {
 				return HttpResponse.json([], {
 					headers: { 'Total-Results': '0' }
 				});
 			}),
-			rest.get('https://api.zotero.org/items/new', ({request}) => {
+			http.get('https://api.zotero.org/items/new', ({request}) => {
 				const url = new URL(request.url);
 				expect(url.searchParams.get('itemType')).toBe('attachment');
 				expect(url.searchParams.get('linkMode')).toBe('linked_url');
 				return HttpResponse.json(newItemLinkedAttachment);
 			}),
-			rest.post('https://api.zotero.org/users/1/items', async ({request}) => {
+			http.post('https://api.zotero.org/users/1/items', async ({request}) => {
 				const items = await request.json();
 				expect(items[0].itemType).toBe('attachment');
 				expect(items[0].linkMode).toBe('linked_url');
@@ -187,18 +187,18 @@ describe('Attachments', () => {
 		let hasBeenUploaded = false;
 
 		server.use(
-			rest.get('https://api.zotero.org/users/1/items/VR82JUX8/children', () => {
+			http.get('https://api.zotero.org/users/1/items/VR82JUX8/children', () => {
 				return HttpResponse.json([], {
 					headers: { 'Total-Results': '0' }
 				});
 			}),
-			rest.get('https://api.zotero.org/items/new', ({request}) => {
+			http.get('https://api.zotero.org/items/new', ({request}) => {
 				const url = new URL(request.url);
 				expect(url.searchParams.get('itemType')).toBe('attachment');
 				expect(url.searchParams.get('linkMode')).toBe('imported_file');
 				return HttpResponse.json(newItemFileAttachment);
 			}),
-			rest.post('https://api.zotero.org/users/1/items', async ({request}) => {
+			http.post('https://api.zotero.org/users/1/items', async ({request}) => {
 				const items = await request.json();
 				expect(items[0].itemType).toBe('attachment');
 				expect(items[0].linkMode).toBe('imported_file');
@@ -207,14 +207,14 @@ describe('Attachments', () => {
 				hasBeenPosted = true;
 				return HttpResponse.json(testUserAddNewAttachmentFile);
 			}),
-			rest.post('https://api.zotero.org/users/1/items/FFIILLEE/file', async ({request}) => {
+			http.post('https://api.zotero.org/users/1/items/FFIILLEE/file', async ({request}) => {
 				const body = await request.text();
 				expect(body).toMatch(/filename=hello.pdf/);
 				hasBeenUploaded = true;
 				await delay(100); // ensure "ongoing" state is shown
 				return HttpResponse.json({ exists: 1 });
 			}),
-			rest.get('https://api.zotero.org/users/1/items', ({request}) => {
+			http.get('https://api.zotero.org/users/1/items', ({request}) => {
 				const url = new URL(request.url);
 				expect(url.searchParams.get('itemKey')).toBe('VR82JUX8');
 				return HttpResponse.json(testUserAddAttachamentFileRefetchParent, {