reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2024-11-22 01:26:48 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(deps): update react (major) (#1165)

Browse Source 
* fix(deps): update react

* Fix

* Use createRoot

* Update tests

* Format

* Fix test

Co-authored-by: Renovate Bot <bot@renovateapp.com>
Co-authored-by: Nathan Bierema <nbierema@gmail.com>
This commit is contained in:
renovate[bot] 2022-06-06 16:22:05 +00:00 committed by GitHub
parent e60c2d37dd
commit e9da5fc411
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
49 changed files with 1395 additions and 1428 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
extension/package.json
View File

@ -41,10 +41,10 @@
"jsan": "^3.1.14", "jsan": "^3.1.14",
"localforage": "^1.10.0", "localforage": "^1.10.0",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-icons": "^4.4.0", "react-icons": "^4.4.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"react-json-tree": "^0.17.0", "react-json-tree": "^0.17.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"redux": "^4.2.0", "redux": "^4.2.0",
@ -58,11 +58,11 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@babel/register": "^7.17.7", "@babel/register": "^7.17.7",
"@testing-library/jest-dom": "^5.16.4", "@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^12.1.5", "@testing-library/react": "^13.3.0",
"@types/chrome": "^0.0.188", "@types/chrome": "^0.0.188",
"@types/lodash": "^4.14.182", "@types/lodash": "^4.14.182",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/styled-components": "^5.1.25", "@types/styled-components": "^5.1.25",
"babel-loader": "^8.2.5", "babel-loader": "^8.2.5",
"bestzip": "^2.2.1", "bestzip": "^2.2.1",

31
extension/src/browser/extension/devpanel/index.tsx
View File

@ -1,5 +1,5 @@
import React, { CSSProperties } from 'react'; import React, { CSSProperties } from 'react';
import { render, unmountComponentAtNode } from 'react-dom'; import { createRoot, Root } from 'react-dom/client';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import { Persistor } from 'redux-persist'; import { Persistor } from 'redux-persist';
import { REMOVE_INSTANCE, StoreAction } from '@redux-devtools/app'; import { REMOVE_INSTANCE, StoreAction } from '@redux-devtools/app';
@ -27,23 +27,21 @@ let naTimeout: NodeJS.Timeout;
const isChrome = navigator.userAgent.indexOf('Firefox') === -1; const isChrome = navigator.userAgent.indexOf('Firefox') === -1;
function renderDevTools() { function renderDevTools(root: Root) {
const node = document.getElementById('root'); root.unmount();
unmountComponentAtNode(node!);
clearTimeout(naTimeout); clearTimeout(naTimeout);
({ store, persistor } = configureStore(position, bgConnection)); ({ store, persistor } = configureStore(position, bgConnection));
render( root.render(
<Provider store={store}> <Provider store={store}>
<PersistGate loading={null} persistor={persistor}> <PersistGate loading={null} persistor={persistor}>
<App position={position} /> <App position={position} />
</PersistGate> </PersistGate>
</Provider>, </Provider>
node
); );
rendered = true; rendered = true;
} }
function renderNA() { function renderNA(root: Root) {
if (rendered === false) return; if (rendered === false) return;
rendered = false; rendered = false;
naTimeout = setTimeout(() => { naTimeout = setTimeout(() => {
@ -76,32 +74,31 @@ function renderNA() {
); );
} }
const node = document.getElementById('root'); root.unmount();
unmountComponentAtNode(node!); root.render(message);
render(message, node);
store = undefined; store = undefined;
}); });
} else { } else {
const node = document.getElementById('root'); root.unmount();
unmountComponentAtNode(node!); root.render(message);
render(message, node);
store = undefined; store = undefined;
} }
}, 3500); }, 3500);
} }
function init(id: number) { function init(id: number) {
renderNA(); const root = createRoot(document.getElementById('root')!);
renderNA(root);
bgConnection = chrome.runtime.connect({ bgConnection = chrome.runtime.connect({
name: id ? id.toString() : undefined, name: id ? id.toString() : undefined,
}); });
bgConnection.onMessage.addListener( bgConnection.onMessage.addListener(
<S, A extends Action<unknown>>(message: PanelMessage<S, A>) => { <S, A extends Action<unknown>>(message: PanelMessage<S, A>) => {
if (message.type === 'NA') { if (message.type === 'NA') {
if (message.id === id) renderNA(); if (message.id === id) renderNA(root);
else store!.dispatch({ type: REMOVE_INSTANCE, id: message.id }); else store!.dispatch({ type: REMOVE_INSTANCE, id: message.id });
} else { } else {
if (!rendered) renderDevTools(); if (!rendered) renderDevTools(root);
store!.dispatch(message); store!.dispatch(message);
} }
} }

8
extension/src/browser/extension/options/index.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import OptionsComponent from './Options'; import OptionsComponent from './Options';
import { Options } from './syncOptions'; import { Options } from './syncOptions';
@ -13,10 +13,8 @@ chrome.runtime.getBackgroundPage((background) => {
}; };
const renderOptions = (options: Options) => { const renderOptions = (options: Options) => {
render( const root = createRoot(document.getElementById('root')!);
<OptionsComponent options={options} saveOption={saveOption} />, root.render(<OptionsComponent options={options} saveOption={saveOption} />);
document.getElementById('root')
);
}; };
syncOptions.subscribe(renderOptions); syncOptions.subscribe(renderOptions);

8
extension/src/browser/extension/window/index.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react'; import { PersistGate } from 'redux-persist/integration/react';
import { UPDATE_STATE } from '@redux-devtools/app'; import { UPDATE_STATE } from '@redux-devtools/app';
@ -25,13 +25,13 @@ chrome.runtime.getBackgroundPage((window) => {
bg.onMessage.addListener(update); bg.onMessage.addListener(update);
update(); update();
render( const root = createRoot(document.getElementById('root')!);
root.render(
<Provider store={localStore}> <Provider store={localStore}>
<PersistGate loading={null} persistor={persistor}> <PersistGate loading={null} persistor={persistor}>
<App position={position} /> <App position={position} />
</PersistGate> </PersistGate>
</Provider>, </Provider>
document.getElementById('root')
); );
}); });

8
extension/src/browser/extension/window/remote.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import { Root } from '@redux-devtools/app'; import { Root } from '@redux-devtools/app';
import '../../views/remote.pug'; import '../../views/remote.pug';
@ -15,7 +15,8 @@ chrome.storage.local.get(
}, },
(options) => { (options) => {
const AppAsAny = Root as any; const AppAsAny = Root as any;
render( const root = createRoot(document.getElementById('root')!);
root.render(
<AppAsAny <AppAsAny
selectMonitor={options['select-monitor']} selectMonitor={options['select-monitor']}
testTemplates={options['test-templates']} testTemplates={options['test-templates']}
@ -30,8 +31,7 @@ chrome.storage.local.get(
} }
: undefined : undefined
} }
/>, />
document.getElementById('root')
); );
} }
); );

6
package.json
View File

@ -42,6 +42,12 @@
"pnpm": { "pnpm": {
"overrides": { "overrides": {
"@babel/highlight>chalk": "Methuselah96/chalk#v2-without-process" "@babel/highlight>chalk": "Methuselah96/chalk#v2-without-process"
},
"peerDependencyRules": {
"allowedVersions": {
"react": "18",
"react-dom": "18"
}
} }
} }
} }

10
packages/react-dock/demo/package.json
View File

@ -10,12 +10,12 @@
"type-check": "tsc --noEmit" "type-check": "tsc --noEmit"
}, },
"dependencies": { "dependencies": {
"react": "^17.0.2", "react": "^18.1.0",
"react-bootstrap": "^2.4.0", "react-bootstrap": "^2.4.0",
"react-dock": "^0.6.0", "react-dock": "^0.6.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-icons": "^4.4.0", "react-icons": "^4.4.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"styled-components": "^5.3.5" "styled-components": "^5.3.5"
}, },
"devDependencies": { "devDependencies": {
@ -24,8 +24,8 @@
"@babel/preset-react": "^7.17.12", "@babel/preset-react": "^7.17.12",
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/styled-components": "^5.1.25", "@types/styled-components": "^5.1.25",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",

5
packages/react-dock/demo/src/index.tsx
View File

@ -1,5 +1,6 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom/client';
import App from './App'; import App from './App';
ReactDOM.render(<App />, document.getElementById('root')); const root = ReactDOM.createRoot(document.getElementById('root')!);
root.render(<App />);

8
packages/react-dock/package.json
View File

@ -55,8 +55,8 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/lodash.debounce": "^4.0.7", "@types/lodash.debounce": "^4.0.7",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-test-renderer": "^17.0.2", "@types/react-test-renderer": "^18.0.0",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
@ -65,8 +65,8 @@
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"jest": "^27.5.1", "jest": "^27.5.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-test-renderer": "^17.0.2", "react-test-renderer": "^18.1.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"ts-jest": "^27.1.5", "ts-jest": "^27.1.5",
"typescript": "~4.7.3" "typescript": "~4.7.3"

8
packages/react-json-tree/examples/package.json
View File

@ -20,9 +20,9 @@
}, },
"dependencies": { "dependencies": {
"immutable": "^4.1.0", "immutable": "^4.1.0",
"react": "^17.0.2", "react": "^18.1.0",
"react-base16-styling": "^0.9.1", "react-base16-styling": "^0.9.1",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-json-tree": "^0.17.0" "react-json-tree": "^0.17.0"
}, },
"devDependencies": { "devDependencies": {
@ -31,8 +31,8 @@
"@babel/preset-react": "^7.17.12", "@babel/preset-react": "^7.17.12",
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"babel-loader": "^8.2.5", "babel-loader": "^8.2.5",

5
packages/react-json-tree/examples/src/index.tsx
View File

@ -1,5 +1,6 @@
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import React from 'react'; import React from 'react';
import App from './App'; import App from './App';
render(<App />, document.getElementById('root')); const root = createRoot(document.getElementById('root')!);
root.render(<App />);

8
packages/react-json-tree/package.json
View File

@ -64,8 +64,8 @@
"@rollup/plugin-node-resolve": "^13.3.0", "@rollup/plugin-node-resolve": "^13.3.0",
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-test-renderer": "^17.0.2", "@types/react-test-renderer": "^18.0.0",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
@ -74,8 +74,8 @@
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"jest": "^27.5.1", "jest": "^27.5.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-test-renderer": "^17.0.2", "react-test-renderer": "^18.1.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"rollup": "^2.75.5", "rollup": "^2.75.5",
"rollup-plugin-terser": "^7.0.2", "rollup-plugin-terser": "^7.0.2",

5
packages/redux-devtools-app/README.md
View File

@ -16,10 +16,11 @@ Also it's a react component you can use to build amazing monitor applications li
```js ```js
import React from 'react'; import React from 'react';
import ReactDom from 'react-dom'; import ReactDOM from 'react-dom/client';
import { Root } from '@redux-devtools/app'; import { Root } from '@redux-devtools/app';
ReactDom.render(<Root />, document.getElementById('root')); const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<Root />);
``` ```
### Parameters ### Parameters

5
packages/redux-devtools-app/demo/index.tsx
View File

@ -1,8 +1,9 @@
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import { Root } from '../src'; import { Root } from '../src';
render(<Root />, document.getElementById('root')); const root = createRoot(document.getElementById('root')!);
root.render(<Root />);
if (module.hot) { if (module.hot) {
// https://github.com/webpack/webpack/issues/418#issuecomment-53398056 // https://github.com/webpack/webpack/issues/418#issuecomment-53398056

12
packages/redux-devtools-app/package.json
View File

@ -60,7 +60,7 @@
"lodash": "^4.17.21", "lodash": "^4.17.21",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react-icons": "^4.4.0", "react-icons": "^4.4.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"redux": "^4.2.0", "redux": "^4.2.0",
"redux-persist": "^6.0.0", "redux-persist": "^6.0.0",
@ -76,14 +76,14 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@rjsf/core": "^4.2.0", "@rjsf/core": "^4.2.0",
"@testing-library/jest-dom": "^5.16.4", "@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^12.1.5", "@testing-library/react": "^13.3.0",
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/jsan": "^3.1.2", "@types/jsan": "^3.1.2",
"@types/json-schema": "^7.0.11", "@types/json-schema": "^7.0.11",
"@types/lodash": "^4.14.182", "@types/lodash": "^4.14.182",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/socketcluster-client": "^13.0.5", "@types/socketcluster-client": "^13.0.5",
"@types/styled-components": "^5.1.25", "@types/styled-components": "^5.1.25",
"@types/testing-library__jest-dom": "^5.14.3", "@types/testing-library__jest-dom": "^5.14.3",
@ -103,8 +103,8 @@
"html-webpack-plugin": "^5.5.0", "html-webpack-plugin": "^5.5.0",
"jest": "^27.5.1", "jest": "^27.5.1",
"path-browserify": "^1.0.1", "path-browserify": "^1.0.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"style-loader": "^3.3.1", "style-loader": "^3.3.1",
"styled-components": "^5.3.5", "styled-components": "^5.3.5",

4
packages/redux-devtools-chart-monitor/package.json
View File

@ -56,14 +56,14 @@
"@babel/preset-react": "^7.17.12", "@babel/preset-react": "^7.17.12",
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@redux-devtools/core": "^3.13.1", "@redux-devtools/core": "^3.13.1",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
"eslint-config-prettier": "^8.5.0", "eslint-config-prettier": "^8.5.0",
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"react": "^17.0.2", "react": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"typescript": "~4.7.3" "typescript": "~4.7.3"

19
packages/redux-devtools-cli/app/index.html
View File

@ -31,16 +31,15 @@
<script src="/redux-devtools-app.min.js"></script> <script src="/redux-devtools-app.min.js"></script>
<script src="/port.js"></script> <script src="/port.js"></script>
<script> <script>
ReactDOM.render( const container = document.querySelector('#root');
React.createElement(ReduxDevToolsApp, { const element = React.createElement(ReduxDevToolsApp, {
socketOptions: { socketOptions: {
hostname: location.hostname, hostname: location.hostname,
port: reduxDevToolsPort, port: reduxDevToolsPort,
autoReconnect: true, autoReconnect: true,
}, },
}), });
document.querySelector('#root') ReactDOM.createRoot(container).render(element);
);
</script> </script>
</body> </body>
</html> </html>

8
packages/redux-devtools-cli/package.json
View File

@ -41,7 +41,7 @@
}, },
"dependencies": { "dependencies": {
"@redux-devtools/app": "^2.1.3", "@redux-devtools/app": "^2.1.3",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"apollo-server-express": "^3.8.2", "apollo-server-express": "^3.8.2",
"body-parser": "^1.20.0", "body-parser": "^1.20.0",
"chalk": "^4.1.2", "chalk": "^4.1.2",
@ -56,9 +56,9 @@
"minimist": "^1.2.6", "minimist": "^1.2.6",
"morgan": "^1.10.0", "morgan": "^1.10.0",
"open": "^8.4.0", "open": "^8.4.0",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"semver": "^7.3.7", "semver": "^7.3.7",
"socketcluster": "^14.4.2", "socketcluster": "^14.4.2",
"sqlite3": "^5.0.8", "sqlite3": "^5.0.8",

4
packages/redux-devtools-dock-monitor/package.json
View File

@ -57,14 +57,14 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@redux-devtools/core": "^3.13.1", "@redux-devtools/core": "^3.13.1",
"@types/parse-key": "^0.2.0", "@types/parse-key": "^0.2.0",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
"eslint-config-prettier": "^8.5.0", "eslint-config-prettier": "^8.5.0",
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"react": "^17.0.2", "react": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"typescript": "~4.7.3" "typescript": "~4.7.3"

10
packages/redux-devtools-inspector-monitor-test-tab/demo/package.json
View File

@ -17,9 +17,9 @@
"@redux-devtools/ui": "^1.3.0", "@redux-devtools/ui": "^1.3.0",
"immutable": "^4.1.0", "immutable": "^4.1.0",
"lodash.shuffle": "^4.2.0", "lodash.shuffle": "^4.2.0",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",
"redux": "^4.2.0", "redux": "^4.2.0",
@ -33,8 +33,8 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@types/lodash.shuffle": "^4.2.7", "@types/lodash.shuffle": "^4.2.7",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/redux-logger": "^3.0.9", "@types/redux-logger": "^3.0.9",
"@types/styled-components": "^5.1.25", "@types/styled-components": "^5.1.25",
"@types/webpack-env": "^1.17.0", "@types/webpack-env": "^1.17.0",

8
packages/redux-devtools-inspector-monitor-test-tab/demo/src/index.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import { Container } from '@redux-devtools/ui'; import { Container } from '@redux-devtools/ui';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import { import {
@ -50,7 +50,8 @@ const enhancer = compose(
const store = createStore(rootReducer, enhancer); const store = createStore(rootReducer, enhancer);
render( const root = createRoot(document.getElementById('root')!);
root.render(
<Provider store={store}> <Provider store={store}>
<BrowserRouter> <BrowserRouter>
<Container <Container
@ -66,6 +67,5 @@ render(
{!useDevtoolsExtension && <ConnectedDevTools />} {!useDevtoolsExtension && <ConnectedDevTools />}
</Container> </Container>
</BrowserRouter> </BrowserRouter>
</Provider>, </Provider>
document.getElementById('root')
); );

8
packages/redux-devtools-inspector-monitor-test-tab/package.json
View File

@ -64,12 +64,12 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@redux-devtools/core": "^3.13.0", "@redux-devtools/core": "^3.13.0",
"@redux-devtools/inspector-monitor": "^3.0.0", "@redux-devtools/inspector-monitor": "^3.0.0",
"@testing-library/react": "^12.1.5", "@testing-library/react": "^13.3.0",
"@types/es6template": "^1.0.0", "@types/es6template": "^1.0.0",
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/jsan": "^3.1.2", "@types/jsan": "^3.1.2",
"@types/object-path": "^0.11.1", "@types/object-path": "^0.11.1",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/simple-diff": "^1.6.1", "@types/simple-diff": "^1.6.1",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
@ -79,8 +79,8 @@
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"jest": "^27.5.1", "jest": "^27.5.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"ts-jest": "^27.1.5", "ts-jest": "^27.1.5",

10
packages/redux-devtools-inspector-monitor-trace-tab/package.json
View File

@ -49,13 +49,13 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@redux-devtools/core": "^3.13.0", "@redux-devtools/core": "^3.13.0",
"@redux-devtools/inspector-monitor": "^3.0.0", "@redux-devtools/inspector-monitor": "^3.0.0",
"@testing-library/react": "^12.1.5", "@testing-library/react": "^13.3.0",
"@types/babel__code-frame": "^7.0.3", "@types/babel__code-frame": "^7.0.3",
"@types/html-entities": "^1.3.4", "@types/html-entities": "^1.3.4",
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/path-browserify": "^1.0.0", "@types/path-browserify": "^1.0.0",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/redux-devtools-themes": "^1.0.0", "@types/redux-devtools-themes": "^1.0.0",
"@types/source-map": "0.5.2", "@types/source-map": "0.5.2",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
@ -66,9 +66,9 @@
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"jest": "^27.5.1", "jest": "^27.5.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-test-renderer": "^17.0.2", "react-test-renderer": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"ts-jest": "^27.1.5", "ts-jest": "^27.1.5",

7
packages/redux-devtools-inspector-monitor-trace-tab/test/StackTraceTab.spec.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { render, screen } from '@testing-library/react'; import { render, screen, waitFor } from '@testing-library/react';
import { TraceTab } from '../src/StackTraceTab'; import { TraceTab } from '../src/StackTraceTab';
const actions = { const actions = {
@ -42,7 +42,10 @@ describe('StackTraceTab component', () => {
const { container } = render( const { container } = render(
<TraceTabAsAny actions={actions} action={actions[2].action} /> <TraceTabAsAny actions={actions} action={actions[2].action} />
); );
await screen.findByTestId('stack-trace'); const stackTraceDiv = await screen.findByTestId('stack-trace');
await waitFor(() =>
expect(stackTraceDiv.querySelector('div')).toBeTruthy()
);
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
}); });

8
packages/redux-devtools-inspector-monitor/demo/package.json
View File

@ -16,9 +16,9 @@
"base16": "^1.0.0", "base16": "^1.0.0",
"immutable": "^4.1.0", "immutable": "^4.1.0",
"lodash.shuffle": "^4.2.0", "lodash.shuffle": "^4.2.0",
"react": "^17.0.2", "react": "^18.1.0",
"react-bootstrap": "^2.4.0", "react-bootstrap": "^2.4.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",
"redux": "^4.2.0", "redux": "^4.2.0",
@ -32,8 +32,8 @@
"@types/base16": "^1.0.2", "@types/base16": "^1.0.2",
"@types/lodash.shuffle": "^4.2.7", "@types/lodash.shuffle": "^4.2.7",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/redux-logger": "^3.0.9", "@types/redux-logger": "^3.0.9",
"@types/webpack-env": "^1.17.0", "@types/webpack-env": "^1.17.0",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",

8
packages/redux-devtools-inspector-monitor/demo/src/index.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import { import {
createStore, createStore,
@ -49,7 +49,8 @@ const enhancer = compose(
const store = createStore(rootReducer, enhancer); const store = createStore(rootReducer, enhancer);
render( const root = createRoot(document.getElementById('root')!);
root.render(
<Provider store={store}> <Provider store={store}>
<BrowserRouter> <BrowserRouter>
<Routes> <Routes>
@ -57,6 +58,5 @@ render(
</Routes> </Routes>
{!useDevtoolsExtension && <ConnectedDevTools />} {!useDevtoolsExtension && <ConnectedDevTools />}
</BrowserRouter> </BrowserRouter>
</Provider>, </Provider>
document.getElementById('root')
); );

4
packages/redux-devtools-inspector-monitor/package.json
View File

@ -66,7 +66,7 @@
"@types/hex-rgba": "^1.0.1", "@types/hex-rgba": "^1.0.1",
"@types/history": "^4.7.11", "@types/history": "^4.7.11",
"@types/lodash.debounce": "^4.0.7", "@types/lodash.debounce": "^4.0.7",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dragula": "^1.1.0", "@types/react-dragula": "^1.1.0",
"@types/redux-devtools-themes": "^1.0.0", "@types/redux-devtools-themes": "^1.0.0",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
@ -75,7 +75,7 @@
"eslint-config-prettier": "^8.5.0", "eslint-config-prettier": "^8.5.0",
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"react": "^17.0.2", "react": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"typescript": "~4.7.3" "typescript": "~4.7.3"

4
packages/redux-devtools-log-monitor/package.json
View File

@ -59,14 +59,14 @@
"@babel/preset-react": "^7.17.12", "@babel/preset-react": "^7.17.12",
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@redux-devtools/core": "^3.13.1", "@redux-devtools/core": "^3.13.1",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
"eslint-config-prettier": "^8.5.0", "eslint-config-prettier": "^8.5.0",
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"react": "^17.0.2", "react": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"typescript": "~4.7.3" "typescript": "~4.7.3"

12
packages/redux-devtools-rtk-query-monitor/demo/package.json
View File

@ -11,7 +11,7 @@
}, },
"dependencies": { "dependencies": {
"@babel/runtime": "^7.18.3", "@babel/runtime": "^7.18.3",
"@chakra-ui/react": "^1.8.8", "@chakra-ui/react": "^2.1.2",
"@emotion/react": "^11.9.0", "@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1", "@emotion/styled": "^11.8.1",
"@mswjs/data": "^0.10.1", "@mswjs/data": "^0.10.1",
@ -21,10 +21,10 @@
"@reduxjs/toolkit": "^1.8.2", "@reduxjs/toolkit": "^1.8.2",
"framer-motion": "^6.3.10", "framer-motion": "^6.3.10",
"msw": "^0.42.0", "msw": "^0.42.0",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-icons": "^4.4.0", "react-icons": "^4.4.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",
"styled-components": "^5.3.5" "styled-components": "^5.3.5"
@ -37,8 +37,8 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@types/copy-webpack-plugin": "^8.0.1", "@types/copy-webpack-plugin": "^8.0.1",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/styled-components": "^5.1.25", "@types/styled-components": "^5.1.25",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",

9
packages/redux-devtools-rtk-query-monitor/demo/src/index.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom/client';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import { ChakraProvider } from '@chakra-ui/react'; import { ChakraProvider } from '@chakra-ui/react';
import './index.css'; import './index.css';
@ -11,8 +11,8 @@ import { worker } from './mocks/browser';
function renderApp() { function renderApp() {
const rootElement = document.getElementById('root'); const rootElement = document.getElementById('root');
const root = ReactDOM.createRoot(rootElement!);
ReactDOM.render( root.render(
<Provider store={store}> <Provider store={store}>
<ChakraProvider> <ChakraProvider>
<BrowserRouter> <BrowserRouter>
@ -20,8 +20,7 @@ function renderApp() {
<DevTools /> <DevTools />
</BrowserRouter> </BrowserRouter>
</ChakraProvider> </ChakraProvider>
</Provider>, </Provider>
rootElement
); );
} }

4
packages/redux-devtools-rtk-query-monitor/package.json
View File

@ -70,14 +70,14 @@
"@reduxjs/toolkit": "^1.8.2", "@reduxjs/toolkit": "^1.8.2",
"@types/hex-rgba": "^1.0.1", "@types/hex-rgba": "^1.0.1",
"@types/lodash.debounce": "^4.0.7", "@types/lodash.debounce": "^4.0.7",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
"eslint-config-prettier": "^8.5.0", "eslint-config-prettier": "^8.5.0",
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"react": "^17.0.2", "react": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"typescript": "~4.7.3" "typescript": "~4.7.3"

10
packages/redux-devtools-slider-monitor/examples/todomvc/package.json
View File

@ -21,9 +21,9 @@
"@redux-devtools/slider-monitor": "^4.0.0", "@redux-devtools/slider-monitor": "^4.0.0",
"classnames": "^2.3.1", "classnames": "^2.3.1",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"redux": "^4.2.0", "redux": "^4.2.0",
"styled-components": "^5.3.5", "styled-components": "^5.3.5",
@ -37,8 +37,8 @@
"@types/classnames": "^2.3.1", "@types/classnames": "^2.3.1",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/prop-types": "^15.7.5", "@types/prop-types": "^15.7.5",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/styled-components": "^5.1.25", "@types/styled-components": "^5.1.25",
"@types/webpack-env": "^1.17.0", "@types/webpack-env": "^1.17.0",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",

5
packages/redux-devtools-slider-monitor/examples/todomvc/src/index.tsx
View File

@ -1,10 +1,11 @@
import 'todomvc-app-css/index.css'; import 'todomvc-app-css/index.css';
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom/client';
import configureStore from './store/configureStore'; import configureStore from './store/configureStore';
import Root from './containers/Root'; import Root from './containers/Root';
const store = configureStore(); const store = configureStore();
const rootEl = document.getElementById('root'); const rootEl = document.getElementById('root');
ReactDOM.render(<Root store={store} />, rootEl); const root = ReactDOM.createRoot(rootEl!);
root.render(<Root store={store} />);

4
packages/redux-devtools-slider-monitor/package.json
View File

@ -50,14 +50,14 @@
"@redux-devtools/core": "^3.13.1", "@redux-devtools/core": "^3.13.1",
"@rollup/plugin-babel": "^5.3.1", "@rollup/plugin-babel": "^5.3.1",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
"eslint-config-prettier": "^8.5.0", "eslint-config-prettier": "^8.5.0",
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"react": "^17.0.2", "react": "^18.1.0",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"rollup": "^2.75.5", "rollup": "^2.75.5",

12
packages/redux-devtools-ui/package.json
View File

@ -70,11 +70,11 @@
"@storybook/addon-essentials": "^6.5.7", "@storybook/addon-essentials": "^6.5.7",
"@storybook/react": "^6.5.7", "@storybook/react": "^6.5.7",
"@testing-library/dom": "^8.13.0", "@testing-library/dom": "^8.13.0",
"@testing-library/react": "^12.1.5", "@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^14.2.0",
"@types/color": "^3.0.3", "@types/color": "^3.0.3",
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/styled-components": "^5.1.25", "@types/styled-components": "^5.1.25",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
@ -87,9 +87,9 @@
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"jest": "^27.5.1", "jest": "^27.5.1",
"ncp": "^2.0.0", "ncp": "^2.0.0",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-is": "^17.0.2", "react-is": "^18.1.0",
"require-from-string": "^2.0.2", "require-from-string": "^2.0.2",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"styled-components": "^5.3.5", "styled-components": "^5.3.5",

4
packages/redux-devtools-ui/test/Button.test.tsx
View File

@ -9,11 +9,11 @@ describe('Button', function () {
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should handle the click event', () => { it('should handle the click event', async () => {
const onClick = jest.fn(); const onClick = jest.fn();
render(<Button onClick={onClick}>ClickMe</Button>); render(<Button onClick={onClick}>ClickMe</Button>);
userEvent.click(screen.getByRole('button')); await userEvent.click(screen.getByRole('button'));
expect(onClick).toHaveBeenCalled(); expect(onClick).toHaveBeenCalled();
}); });
}); });

4
packages/redux-devtools-ui/test/ContextMenu.test.tsx
View File

@ -18,13 +18,13 @@ describe('ContextMenu', function () {
); );
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should handle the click event', () => { it('should handle the click event', async () => {
const onClick = jest.fn(); const onClick = jest.fn();
render( render(
<ContextMenu items={items} onClick={onClick} x={100} y={100} visible /> <ContextMenu items={items} onClick={onClick} x={100} y={100} visible />
); );
userEvent.click(screen.getByRole('button', { name: 'Menu Item 1' })); await userEvent.click(screen.getByRole('button', { name: 'Menu Item 1' }));
expect(onClick).toHaveBeenCalled(); expect(onClick).toHaveBeenCalled();
}); });
}); });

8
packages/redux-devtools-ui/test/Dialog.test.tsx
View File

@ -52,7 +52,7 @@ describe('Dialog', function () {
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should handle dismiss event', () => { it('should handle dismiss event', async () => {
const onDismiss = jest.fn(); const onDismiss = jest.fn();
render( render(
<Dialog <Dialog
@ -64,11 +64,11 @@ describe('Dialog', function () {
/> />
); );
userEvent.click(screen.getByRole('button', { name: 'Cancel' })); await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
expect(onDismiss).toHaveBeenCalled(); expect(onDismiss).toHaveBeenCalled();
}); });
it('should handle submit event', () => { it('should handle submit event', async () => {
const onSubmit = jest.fn(); const onSubmit = jest.fn();
render( render(
<Dialog <Dialog
@ -80,7 +80,7 @@ describe('Dialog', function () {
/> />
); );
userEvent.click(screen.getByRole('button', { name: 'Submit' })); await userEvent.click(screen.getByRole('button', { name: 'Submit' }));
expect(onSubmit).toHaveBeenCalled(); expect(onSubmit).toHaveBeenCalled();
}); });
}); });

4
packages/redux-devtools-ui/test/Form.test.tsx
View File

@ -44,7 +44,7 @@ describe('Form', function () {
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should handle the submit event', () => { it('should handle the submit event', async () => {
const onSubmit = jest.fn(); const onSubmit = jest.fn();
render( render(
<Form <Form
@ -55,7 +55,7 @@ describe('Form', function () {
/> />
); );
userEvent.click(screen.getByRole('button', { name: 'Submit' })); await userEvent.click(screen.getByRole('button', { name: 'Submit' }));
expect(onSubmit).toHaveBeenCalled(); expect(onSubmit).toHaveBeenCalled();
}); });
}); });

4
packages/redux-devtools-ui/test/Notification.test.tsx
View File

@ -23,11 +23,11 @@ describe('Notification', function () {
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should handle the click event', () => { it('should handle the click event', async () => {
const onClose = jest.fn(); const onClose = jest.fn();
render(<Notification onClose={onClose}>Message</Notification>); render(<Notification onClose={onClose}>Message</Notification>);
userEvent.click(screen.getByRole('button')); await userEvent.click(screen.getByRole('button'));
expect(onClose).toHaveBeenCalled(); expect(onClose).toHaveBeenCalled();
}); });
}); });

4
packages/redux-devtools-ui/test/SegmentedControl.test.tsx
View File

@ -17,7 +17,7 @@ describe('SegmentedControl', function () {
); );
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should handle the click event', () => { it('should handle the click event', async () => {
const onClick = jest.fn(); const onClick = jest.fn();
render( render(
<SegmentedControl <SegmentedControl
@ -28,7 +28,7 @@ describe('SegmentedControl', function () {
/> />
); );
userEvent.click(screen.getByRole('button', { name: 'Button1' })); await userEvent.click(screen.getByRole('button', { name: 'Button1' }));
expect(onClick).toHaveBeenCalled(); expect(onClick).toHaveBeenCalled();
}); });
}); });

12
packages/redux-devtools-ui/test/Select.test.tsx
View File

@ -37,27 +37,27 @@ describe('Select', function () {
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should select another option', () => { it('should select another option', async () => {
const onChange = jest.fn(); const onChange = jest.fn();
const { container } = render( const { container } = render(
<Select options={options} onChange={onChange} /> <Select options={options} onChange={onChange} />
); );
userEvent.type(screen.getByRole('combobox'), 'two'); await userEvent.type(screen.getByRole('combobox'), 'two');
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
userEvent.type(screen.getByRole('combobox'), '{enter}'); await userEvent.type(screen.getByRole('combobox'), '{enter}');
expect(onChange).toHaveBeenCalled(); expect(onChange).toHaveBeenCalled();
}); });
it("shouldn't find any results", () => { it("shouldn't find any results", async () => {
const onChange = jest.fn(); const onChange = jest.fn();
const { container } = render( const { container } = render(
<Select options={options} onChange={onChange} /> <Select options={options} onChange={onChange} />
); );
userEvent.type(screen.getByRole('combobox'), 'text'); await userEvent.type(screen.getByRole('combobox'), 'text');
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
userEvent.type(screen.getByRole('combobox'), '{enter}'); await userEvent.type(screen.getByRole('combobox'), '{enter}');
expect(onChange).not.toHaveBeenCalled(); expect(onChange).not.toHaveBeenCalled();
}); });
}); });

4
packages/redux-devtools-ui/test/Tabs.test.tsx
View File

@ -43,11 +43,11 @@ describe('Tabs', function () {
expect(container.firstChild).toMatchSnapshot(); expect(container.firstChild).toMatchSnapshot();
}); });
it('should select tab', () => { it('should select tab', async () => {
const onClick = jest.fn(); const onClick = jest.fn();
render(<Tabs tabs={tabs} onClick={onClick} />); render(<Tabs tabs={tabs} onClick={onClick} />);
userEvent.click(screen.getByRole('button', { name: 'Tab1' })); await userEvent.click(screen.getByRole('button', { name: 'Tab1' }));
expect(onClick).toHaveBeenCalled(); expect(onClick).toHaveBeenCalled();
}); });
}); });

8
packages/redux-devtools/examples/counter/package.json
View File

@ -23,8 +23,8 @@
"@redux-devtools/dock-monitor": "^3.0.0", "@redux-devtools/dock-monitor": "^3.0.0",
"@redux-devtools/log-monitor": "^4.0.0", "@redux-devtools/log-monitor": "^4.0.0",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"redux": "^4.2.0", "redux": "^4.2.0",
"redux-thunk": "^2.4.1" "redux-thunk": "^2.4.1"
@ -36,8 +36,8 @@
"@babel/preset-typescript": "^7.17.12", "@babel/preset-typescript": "^7.17.12",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/prop-types": "^15.7.5", "@types/prop-types": "^15.7.5",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/webpack-env": "^1.17.0", "@types/webpack-env": "^1.17.0",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",

5
packages/redux-devtools/examples/counter/src/index.tsx
View File

@ -1,8 +1,9 @@
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import configureStore from './store/configureStore'; import configureStore from './store/configureStore';
import Root from './containers/Root'; import Root from './containers/Root';
const store = configureStore(); const store = configureStore();
render(<Root store={store} />, document.getElementById('root')); const root = createRoot(document.getElementById('root')!);
root.render(<Root store={store} />);

8
packages/redux-devtools/examples/todomvc/package.json
View File

@ -36,8 +36,8 @@
"@redux-devtools/log-monitor": "^4.0.0", "@redux-devtools/log-monitor": "^4.0.0",
"classnames": "^2.3.1", "classnames": "^2.3.1",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"redux": "^4.2.0", "redux": "^4.2.0",
"todomvc-app-css": "^2.4.2" "todomvc-app-css": "^2.4.2"
@ -50,8 +50,8 @@
"@types/classnames": "^2.3.1", "@types/classnames": "^2.3.1",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/prop-types": "^15.7.5", "@types/prop-types": "^15.7.5",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@types/react-dom": "^17.0.17", "@types/react-dom": "^18.0.5",
"@types/webpack-env": "^1.17.0", "@types/webpack-env": "^1.17.0",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",

5
packages/redux-devtools/examples/todomvc/src/index.tsx
View File

@ -1,9 +1,10 @@
import 'todomvc-app-css/index.css'; import 'todomvc-app-css/index.css';
import React from 'react'; import React from 'react';
import { render } from 'react-dom'; import { createRoot } from 'react-dom/client';
import configureStore from './store/configureStore'; import configureStore from './store/configureStore';
import Root from './containers/Root'; import Root from './containers/Root';
const store = configureStore(); const store = configureStore();
render(<Root store={store} />, document.getElementById('root')); const root = createRoot(document.getElementById('root')!);
root.render(<Root store={store} />);

6
packages/redux-devtools/package.json
View File

@ -58,7 +58,7 @@
"@types/jest": "^27.5.2", "@types/jest": "^27.5.2",
"@types/lodash": "^4.14.182", "@types/lodash": "^4.14.182",
"@types/node": "^16.11.38", "@types/node": "^16.11.38",
"@types/react": "^17.0.45", "@types/react": "^18.0.12",
"@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0", "@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.17.0", "eslint": "^8.17.0",
@ -67,8 +67,8 @@
"eslint-plugin-react": "^7.30.0", "eslint-plugin-react": "^7.30.0",
"eslint-plugin-react-hooks": "^4.5.0", "eslint-plugin-react-hooks": "^4.5.0",
"jest": "^27.5.1", "jest": "^27.5.1",
"react": "^17.0.2", "react": "^18.1.0",
"react-dom": "^17.0.2", "react-dom": "^18.1.0",
"react-redux": "^8.0.2", "react-redux": "^8.0.2",
"redux": "^4.2.0", "redux": "^4.2.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",

2450
pnpm-lock.yaml
View File

File diff suppressed because it is too large Load Diff