reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2025-07-27 00:19:55 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into master

Browse Source
This commit is contained in:
Nathan Bierema 2021-06-10 20:55:06 -04:00 committed by GitHub
commit 92e9adf5ba
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
24 changed files with 822 additions and 603 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/Walkthrough.md
View File

@ -2,7 +2,7 @@
## Browser Extension
If you don’t want to bother with installing Redux DevTools and integrating it into your project, consider using [Redux DevTools Extension](https://github.com/zalmoxisus/redux-devtools-extension) for Chrome and Firefox. It provides access to the most popular monitors, is easy to configure to filter actions, and doesn’t require installing any packages.
If you don’t want to bother with installing Redux DevTools and integrating it into your project, consider using [Redux DevTools Extension](https://github.com/reduxjs/redux-devtools/tree/master/extension) for Chrome and Firefox. It provides access to the most popular monitors, is easy to configure to filter actions, and doesn’t require installing any packages.
## Manual Integration

15
extension/package.json
View File

@ -1,5 +1,5 @@
{
"version": "2.17.1",
"version": "2.17.2",
"name": "remotedev-redux-devtools-extension",
"description": "Redux Developer Tools for debugging application state changes.",
"scripts": {
@ -9,8 +9,8 @@
"build:examples": "babel-node examples/buildAll.js",
"precompress:extension": "npm run lint && npm run test:app && npm run build:extension && npm run test:chrome && npm run test:electron",
"precompress:firefox": "npm run lint && npm run build:firefox && npm run test:app",
"compress:extension": "cd build/extension && bestzip ../extension.zip",
"compress:firefox": "cd build/firefox && bestzip ../firefox.zip",
"compress:extension": "bestzip build/extension.zip build/extension",
"compress:firefox": "bestzip build/extension.zip build/extension",
"docs:clean": "rimraf _book",
"docs:prepare": "gitbook install",
"docs:build": "npm run docs:prepare && gitbook build",
@ -20,7 +20,7 @@
"lint": "eslint .",
"test:app": "cross-env BABEL_ENV=test jest test/app",
"test:chrome": "jest test/chrome",
"test:electron": "jest test/electron && rimraf test/electron/tmp",
"test:electron": "jest test/electron",
"test": "npm run test:app && npm run build:extension && npm run test:chrome && npm run test:electron"
},
"repository": {
@ -42,10 +42,10 @@
"babel-eslint": "^10.1.0",
"babel-loader": "^8.1.0",
"bestzip": "^2.1.7",
"chromedriver": "^2.35.0",
"chromedriver": "^91.0.0",
"copy-webpack-plugin": "^6.3.1",
"cross-env": "^7.0.2",
"electron": "^2.0.2",
"electron": "^13.1.1",
"enzyme": "^3.11.0",
"enzyme-adapter-react-15.4": "^1.4.2",
"eslint": "^7.6.0",
@ -63,10 +63,9 @@
"react-transform-catch-errors": "^1.0.0",
"react-transform-hmr": "^1.0.1",
"rimraf": "^3.0.2",
"selenium-webdriver": "^3.0.1",
"selenium-webdriver": "^3.6.0",
"sinon-chrome": "^1.1.2",
"style-loader": "^1.2.1",
"terser-webpack-plugin": "^1.1.0",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12"
},

2
extension/src/browser/extension/chromeAPIMock.js
View File

@ -87,6 +87,6 @@ if (window.isElectron) {
};
}
if (isFirefox) {
if (isFirefox || window.isElectron) {
chrome.storage.sync = chrome.storage.local;
}

3
extension/src/browser/extension/manifest.json
View File

@ -1,5 +1,5 @@
{
"version": "2.17.1",
"version": "2.17.2",
"name": "Redux DevTools",
"short_name": "Redux DevTools",
"description": "Redux DevTools for debugging application's state changes.",
@ -63,7 +63,6 @@
"permissions": [
"notifications",
"contextMenus",
"tabs",
"storage",
"file:///*",
"http://*/*",

33
extension/test/electron/devpanel.spec.js
View File

@ -5,7 +5,8 @@ import chromedriver from 'chromedriver';
import { switchMonitorTests, delay } from '../utils/e2e';
const port = 9515;
const devPanelPath = 'chrome-extension://redux-devtools/devpanel.html';
const devPanelPath =
'chrome-extension://lmhkpmbekcpmknklioeibfkpmmfibljd/window.html';
describe('DevTools panel for Electron', function () {
beforeAll(async () => {
@ -30,8 +31,19 @@ describe('DevTools panel for Electron', function () {
});
it('should open Redux DevTools tab', async () => {
if (!(await this.driver.getCurrentUrl()).startsWith('devtools')) {
const originalWindow = await this.driver.getWindowHandle();
const windows = await this.driver.getAllWindowHandles();
for (const window of windows) {
if (window === originalWindow) continue;
await this.driver.switchTo().window(window);
if ((await this.driver.getCurrentUrl()).startsWith('devtools')) {
break;
}
}
}
expect(await this.driver.getCurrentUrl()).toMatch(
/chrome-devtools:\/\/devtools\/bundled\/inspector.html/
/devtools:\/\/devtools\/bundled\/devtools_app.html/
);
await this.driver.manage().timeouts().pageLoadTimeout(5000);
@ -42,19 +54,22 @@ describe('DevTools panel for Electron', function () {
if (attempts === 0) {
return callback('Redux panel not found');
}
const tabs = UI.inspectorView._tabbedPane._tabs;
const idList = tabs.map((tab) => tab.id);
const reduxPanelId = 'chrome-extension://redux-devtoolsRedux';
if (idList.indexOf(reduxPanelId) !== -1) {
UI.inspectorView.showPanel(reduxPanelId);
return callback(reduxPanelId);
if (UI.inspectorView) {
const tabs = UI.inspectorView._tabbedPane._tabs;
const idList = tabs.map((tab) => tab.id);
const reduxPanelId =
'chrome-extension://lmhkpmbekcpmknklioeibfkpmmfibljdRedux';
if (idList.indexOf(reduxPanelId) !== -1) {
UI.inspectorView.showPanel(reduxPanelId);
return callback(reduxPanelId);
}
}
attempts--;
setTimeout(showReduxPanel, 500);
}
showReduxPanel();
});
expect(id).toBe('chrome-extension://redux-devtoolsRedux');
expect(id).toBe('chrome-extension://lmhkpmbekcpmknklioeibfkpmmfibljdRedux');
const className = await this.driver
.findElement(webdriver.By.className(id))

19
extension/test/electron/fixture/main.js
View File

@ -1,18 +1,21 @@
const path = require('path');
const { app, BrowserWindow } = require('electron');
app.setPath('userData', path.join(__dirname, '../tmp'));
const { app, BrowserWindow, session } = require('electron');
app.on('window-all-closed', app.quit);
app.on('ready', () => {
BrowserWindow.addDevToolsExtension(
path.join(__dirname, '../../../build/extension')
app.whenReady().then(async () => {
await session.defaultSession.loadExtension(
path.join(__dirname, '../../../build/extension'),
{ allowFileAccess: true }
);
const mainWindow = new BrowserWindow({
width: 150,
height: 100,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
},
});
mainWindow.loadURL(`file://${__dirname}/index.html`);
mainWindow.openDevTools({ detach: true });
mainWindow.loadFile('index.html');
mainWindow.webContents.openDevTools({ mode: 'detach' });
});

14
extension/webpack/base.config.js
View File

@ -1,6 +1,5 @@
import path from 'path';
import webpack from 'webpack';
import TerserPlugin from 'terser-webpack-plugin';
import CopyPlugin from 'copy-webpack-plugin';
const extpath = path.join(__dirname, '../src/browser/extension/');
@ -55,18 +54,7 @@ const baseConfig = (params) => ({
: []
),
optimization: {
minimizer: [
new TerserPlugin({
terserOptions: {
output: {
comments: false,
},
},
// sourceMap: true,
cache: true,
parallel: true,
}),
],
minimize: false,
},
performance: {
hints: false,

917
extension/yarn.lock
View File

File diff suppressed because it is too large Load Diff

2
package.json
View File

@ -27,6 +27,7 @@
"eslint-plugin-react": "^7.20.5",
"file-loader": "^6.0.0",
"fork-ts-checker-webpack-plugin": "^5.1.0",
"html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0",
"jest": "^26.2.2",
"lerna": "^3.22.1",
@ -42,6 +43,7 @@
"ts-jest": "^26.2.0",
"ts-node": "^9.0.0",
"typescript": "^3.9.7",
"url-loader": "^4.1.0",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"

2
packages/devui/package.json
View File

@ -40,7 +40,7 @@
"@types/base16": "^1.0.2",
"@types/codemirror": "^0.0.97",
"@types/prop-types": "^15.7.3",
"@types/react-select": "^3.0.19",
"@types/react-select": "^3.1.2",
"@types/redux-devtools-themes": "^1.0.0",
"@types/simple-element-resize-detector": "^1.3.0",
"@types/styled-components": "^5.1.2",

22
packages/devui/src/Form/widgets.tsx
View File

@ -4,8 +4,26 @@ import Select from '../Select';
import Slider from '../Slider';
/* eslint-disable react/prop-types */
const SelectWidget: Widget = ({ options, ...rest }) => (
<Select options={options.enumOptions} {...rest} />
const SelectWidget: Widget = ({
options,
onChange,
value,
onBlur,
defaultValue,
tabIndex,
onFocus,
...rest
}) => (
<Select<{ label: string; value: string }>
options={options.enumOptions as { label: string; value: string }[]}
onChange={(option) => {
onChange(option?.value);
}}
value={(options.enumOptions as { label: string; value: string }[]).find(
(option) => option.value === value
)}
{...rest}
/>
);
const RangeWidget: Widget = (({

5
packages/devui/src/Select/Select.stories.tsx
View File

@ -22,7 +22,10 @@ export default {
component: Select,
};
type TemplateArgs = Omit<SelectProps, 'value'> & { value: string };
type TemplateArgs = Omit<
SelectProps<{ value: string; label: string }, boolean>,
'value'
> & { value: string };
// eslint-disable-next-line react/prop-types
const Template: Story<TemplateArgs> = ({ value, ...args }) => (

47
packages/devui/src/Select/Select.tsx
View File

@ -1,17 +1,26 @@
import React, { PureComponent, Component } from 'react';
import React, { PureComponent, Component, ReactElement } from 'react';
import PropTypes from 'prop-types';
import ReactSelect, { Props as ReactSelectProps } from 'react-select';
import ReactSelect, {
NamedProps as ReactSelectProps,
OptionTypeBase,
} from 'react-select';
import createThemedComponent from '../utils/createThemedComponent';
import { Theme } from '../themes/default';
export interface SelectProps extends Omit<ReactSelectProps, 'theme'> {
export interface SelectProps<
Option extends OptionTypeBase = OptionTypeBase,
IsMulti extends boolean = false
> extends Omit<ReactSelectProps<Option, IsMulti>, 'theme'> {
theme: Theme;
}
/**
* Wrapper around [React Select](https://github.com/JedWatson/react-select).
*/
export class Select extends (PureComponent || Component)<SelectProps> {
export class Select<
Option extends OptionTypeBase = OptionTypeBase,
IsMulti extends boolean = false
> extends (PureComponent || Component)<SelectProps<Option, IsMulti>> {
render() {
return (
<ReactSelect
@ -44,6 +53,18 @@ export class Select extends (PureComponent || Component)<SelectProps> {
controlHeight: this.props.theme.inputHeight,
},
})}
styles={{
container: (base) => ({
...base,
flexGrow: 1,
}),
control: (base, props) => ({
...base,
backgroundColor: props.isDisabled
? props.theme.colors.neutral10
: props.theme.colors.neutral5,
}),
}}
/>
);
}
@ -60,4 +81,20 @@ export class Select extends (PureComponent || Component)<SelectProps> {
};
}
export default createThemedComponent(Select);
export interface ExternalSelectProps<
Option extends OptionTypeBase = OptionTypeBase,
IsMulti extends boolean = false
> extends Omit<ReactSelectProps<Option, IsMulti>, 'theme'> {
theme?: Theme;
}
type SelectComponent = <
Option extends OptionTypeBase = OptionTypeBase,
IsMulti extends boolean = false
>(
props: ExternalSelectProps<Option, IsMulti>
) => ReactElement;
export default createThemedComponent(Select) as SelectComponent & {
theme?: Theme;
};

14
packages/devui/tests/Select.test.tsx
View File

@ -24,14 +24,14 @@ describe('Select', function () {
onChange={() => {
// noop
}}
value="one"
menuMaxHeight={20}
clearable
disabled
value={options.filter((option) => option.value === 'one')}
maxMenuHeight={20}
isClearable
isDisabled
isLoading
multi
searchable={false}
openOuterUp
isMulti
isSearchable={false}
menuPlacement="top"
/>
);
expect(renderToJson(wrapper)).toMatchSnapshot();

197
packages/devui/tests/__snapshots__/Select.test.tsx.snap
View File

@ -2,7 +2,7 @@
exports[`Select renders correctly 1`] = `
<div
class=" css-2b097c-container"
class=" css-butsr4-container"
>
<div
class=" css-vmgz7k-control"
@ -70,7 +70,7 @@ exports[`Select renders correctly 1`] = `
exports[`Select renders with props 1`] = `
<div
class=" css-2b097c-container"
class=" css-ie73ge-container"
>
<div
class=" css-vmgz7k-control"
@ -79,34 +79,39 @@ exports[`Select renders with props 1`] = `
class=" css-be27w2-ValueContainer"
>
<div
class=" css-1osw1h9-placeholder"
>
Select...
</div>
<div
class="css-187dxxn-Input"
class="css-syqu13-multiValue"
>
<div
class=""
style="display:inline-block"
class="css-1lxn4sj"
>
<input
aria-autocomplete="list"
autocapitalize="none"
autocomplete="off"
autocorrect="off"
id="react-select-3-input"
spellcheck="false"
style="box-sizing:content-box;width:1px;label:input;background:0;border:0;font-size:inherit;opacity:1;outline:0;padding:0;color:inherit"
tabindex="0"
type="text"
value=""
/>
<div
style="position:absolute;top:0;left:0;visibility:hidden;height:0;overflow:scroll;white-space:pre"
/>
One
</div>
<div
class="css-19nhond"
>
<svg
aria-hidden="true"
class="css-6q0nyr-Svg"
focusable="false"
height="14"
viewBox="0 0 20 20"
width="14"
>
<path
d="M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z"
/>
</svg>
</div>
</div>
<input
aria-autocomplete="list"
class="css-62g3xt-dummyInput"
disabled=""
id="react-select-3-input"
readonly=""
tabindex="0"
value=""
/>
</div>
<div
class=" css-1hb7zxy-IndicatorsContainer"
@ -312,6 +317,12 @@ exports[`Select should select another option 1`] = `
},
]
}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
theme={[Function]}
>
<Select
@ -368,7 +379,12 @@ exports[`Select should select another option 1`] = `
pageSize={5}
placeholder="Select..."
screenReaderStatus={[Function]}
styles={Object {}}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
tabIndex="0"
tabSelectsValue={true}
theme={[Function]}
@ -460,7 +476,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -506,6 +525,7 @@ exports[`Select should select another option 1`] = `
Object {
"boxSizing": "border-box",
"direction": null,
"flexGrow": 1,
"label": "container",
"pointerEvents": null,
"position": "relative",
@ -514,7 +534,7 @@ exports[`Select should select another option 1`] = `
onKeyDown={[Function]}
>
<div
className=" css-2b097c-container"
className=" css-butsr4-container"
onKeyDown={[Function]}
>
<Control
@ -605,7 +625,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -758,7 +781,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -884,7 +910,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1112,7 +1141,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1247,7 +1279,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1393,7 +1428,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1585,7 +1623,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1715,7 +1756,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1867,7 +1911,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2023,7 +2070,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2216,6 +2266,12 @@ exports[`Select shouldn't find any results 1`] = `
},
]
}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
theme={[Function]}
>
<Select
@ -2272,7 +2328,12 @@ exports[`Select shouldn't find any results 1`] = `
pageSize={5}
placeholder="Select..."
screenReaderStatus={[Function]}
styles={Object {}}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
tabIndex="0"
tabSelectsValue={true}
theme={[Function]}
@ -2364,7 +2425,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2410,6 +2474,7 @@ exports[`Select shouldn't find any results 1`] = `
Object {
"boxSizing": "border-box",
"direction": null,
"flexGrow": 1,
"label": "container",
"pointerEvents": null,
"position": "relative",
@ -2418,7 +2483,7 @@ exports[`Select shouldn't find any results 1`] = `
onKeyDown={[Function]}
>
<div
className=" css-2b097c-container"
className=" css-butsr4-container"
onKeyDown={[Function]}
>
<Control
@ -2509,7 +2574,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2662,7 +2730,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2788,7 +2859,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3016,7 +3090,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3151,7 +3228,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3297,7 +3377,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3489,7 +3572,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3619,7 +3705,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3771,7 +3860,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3906,7 +3998,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],

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

@ -61,32 +61,14 @@
"styled-components": "^5.1.1"
},
"devDependencies": {
"@babel/cli": "^7.10.5",
"@babel/core": "^7.11.1",
"@babel/plugin-proposal-class-properties": "^7.10.4",
"@babel/preset-env": "^7.11.0",
"@babel/preset-react": "^7.10.4",
"@rjsf/core": "^2.4.0",
"@types/json-schema": "^7.0.6",
"@types/socketcluster-client": "^13.0.3",
"babel-loader": "^8.1.0",
"css-loader": "^4.2.1",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.3",
"enzyme-to-json": "^3.5.0",
"file-loader": "^6.0.0",
"html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0",
"jest": "^26.2.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"rimraf": "^3.0.2",
"style-loader": "^1.2.1",
"url-loader": "^4.1.0",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0",
"webpack-hot-middleware": "^2.25.0"
"react-dom": "^16.13.1"
},
"peerDependencies": {
"react": "^16.3.0 || ^17.0.0"

7
packages/redux-devtools-app/src/components/InstanceSelector.tsx
View File

@ -23,9 +23,10 @@ class InstanceSelector extends Component<Props> {
return (
<Select
options={this.select}
// TODO Where's the type-checking?
onChange={this.props.onSelect}
value={this.props.selected || ''}
onChange={(option) => this.props.onSelect(option!.value)}
value={this.select.find(
(option) => option.value === this.props.selected
)}
/>
);
}

16
packages/redux-devtools-app/src/containers/monitors/Dispatcher.tsx
View File

@ -182,9 +182,10 @@ class Dispatcher extends Component<Props, State> {
);
}
let options: { value: string | number; label: string }[] = [
{ value: 'default', label: 'Custom action' },
];
let options: {
value: 'default' | 'actions-help' | number;
label: string;
}[] = [{ value: 'default', label: 'Custom action' }];
if (actionCreators && actionCreators.length > 0) {
options = options.concat(
actionCreators.map(({ name, args }, i) => ({
@ -204,9 +205,12 @@ class Dispatcher extends Component<Props, State> {
{actionElement}
<Toolbar>
<Select
openOuterUp
onChange={this.selectActionCreator}
value={this.state.selected || 'default'}
menuPlacement="top"
onChange={(option) => this.selectActionCreator(option!.value)}
value={
options.find((option) => option.value === this.state.selected) ||
options.find((option) => option.value === 'default')
}
options={options}
/>
<Button onClick={this.dispatchAction} primary={this.state.changed}>

43
packages/redux-devtools-cli/app/electron.js
View File

@ -3,48 +3,23 @@
const { app, BrowserWindow } = require('electron');
const argv = require('minimist')(process.argv.slice(2));
let mainWindow;
function createWindow() {
mainWindow = new BrowserWindow({
const mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: false,
contextIsolation: true,
sandbox: true,
webSecurity: true,
},
});
// mainWindow.loadFile('index.html')
mainWindow.loadURL('http://localhost:' + (argv.port ? argv.port : 8000));
// Open the DevTools.
// mainWindow.webContents.openDevTools()
mainWindow.on('closed', function () {
// Dereference the window object, usually you would store windows
// in an array if your app supports multi windows, this is the time
// when you should delete the corresponding element.
mainWindow = null;
});
}
app.on('ready', createWindow);
app.whenReady().then(() => {
createWindow();
app.on('activate', function () {
if (BrowserWindow.getAllWindows().length === 0) createWindow();
});
});
app.on('window-all-closed', function () {
// On macOS it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', function () {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (mainWindow === null) {
createWindow();
}
if (process.platform !== 'darwin') app.quit();
});

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

@ -50,7 +50,7 @@
"chalk": "^4.1.0",
"cors": "^2.8.5",
"cross-spawn": "^7.0.3",
"electron": "^9.2.0",
"electron": "^13.1.1",
"express": "^4.17.1",
"getport": "^0.1.0",
"graphql": "^14.7.0",

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

@ -52,9 +52,9 @@ export default class TestTab<S, A extends Action<unknown>> extends Component<
(this.props.monitorState as { testGenerator?: TestGeneratorMonitorState })
.testGenerator || {};
handleSelectTemplate = (selectedTemplate: Template) => {
handleSelectTemplate = (selectedTemplate: Template | null | undefined) => {
const { templates = getDefaultTemplates() } = this.getPersistedState();
this.updateState({ selected: templates.indexOf(selectedTemplate) });
this.updateState({ selected: templates.indexOf(selectedTemplate!) });
};
handleCloseTip = () => {
@ -133,9 +133,9 @@ export default class TestTab<S, A extends Action<unknown>> extends Component<
<div style={{ flexGrow: 1, zIndex: 100 }}>
<Select
options={templates}
getOptionValue={(template: Template) => template.name}
getOptionLabel={(template: Template) => template.name}
value={templates.filter((template) => template.name === name)}
getOptionValue={(template: Template) => template.name!}
getOptionLabel={(template: Template) => template.name!}
value={templates.find((template) => template.name === name)}
onChange={this.handleSelectTemplate}
/>
</div>

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

@ -41,6 +41,7 @@
"@types/prop-types": "^15.7.3",
"dateformat": "^3.0.3",
"hex-rgba": "^1.0.2",
"immutable": "^4.0.0-rc.12",
"javascript-stringify": "^2.0.1",
"jsondiffpatch": "^0.4.1",
"jss": "^10.3.0",
@ -66,7 +67,6 @@
"base16": "^1.0.0",
"connected-react-router": "^6.8.0",
"history": "^4.10.1",
"immutable": "^4.0.0-rc.12",
"lodash.shuffle": "^4.2.0",
"react": "^16.13.1",
"react-bootstrap": "^1.3.0",

1
packages/redux-devtools-inspector-monitor/src/utils/createStylingFromTheme.ts
View File

@ -289,7 +289,6 @@ const getSheetFromColorMap = (map: ColorMap) => ({
tabSelector: {
position: 'relative',
'z-index': 1,
display: 'inline-flex',
float: 'right',
},

30
yarn.lock
View File

@ -1162,7 +1162,7 @@
"@babel/types" "^7.4.4"
esutils "^2.0.2"
"@babel/preset-react@^7.0.0", "@babel/preset-react@^7.10.4", "@babel/preset-react@^7.8.3", "@babel/preset-react@^7.9.4":
"@babel/preset-react@^7.0.0", "@babel/preset-react@^7.8.3", "@babel/preset-react@^7.9.4":
version "7.10.4"
resolved "https://registry.yarnpkg.com/@babel/preset-react/-/preset-react-7.10.4.tgz#92e8a66d816f9911d11d4cc935be67adfc82dbcf"
integrity sha512-BrHp4TgOIy4M19JAfO1LhycVXOPWdDbTRep7eVyatf174Hff+6Uk53sDyajqZPu8W1qXRBiYOfIamek6jA7YVw==
@ -3903,16 +3903,16 @@
resolved "https://registry.yarnpkg.com/@types/node/-/node-10.17.39.tgz#ce1122758d0608de8303667cebf171f44192629b"
integrity sha512-dJLCxrpQmgyxYGcl0Ae9MTsQgI22qHHcGFj/8VKu7McJA5zQpnuGjoksnxbo1JxSjW/Nahnl13W8MYZf01CZHA==
"@types/node@^12.0.12":
version "12.12.54"
resolved "https://registry.yarnpkg.com/@types/node/-/node-12.12.54.tgz#a4b58d8df3a4677b6c08bfbc94b7ad7a7a5f82d1"
integrity sha512-ge4xZ3vSBornVYlDnk7yZ0gK6ChHf/CHB7Gl1I0Jhah8DDnEQqBzgohYG4FX4p81TNirSETOiSyn+y1r9/IR6w==
"@types/node@^14.6.0":
version "14.6.0"
resolved "https://registry.yarnpkg.com/@types/node/-/node-14.6.0.tgz#7d4411bf5157339337d7cff864d9ff45f177b499"
integrity sha512-mikldZQitV94akrc4sCcSjtJfsTKt4p+e/s0AGscVA6XArQ9kFclP+ZiYUMnq987rc6QlYxXv/EivqlfSLxpKA==
"@types/node@^14.6.2":
version "14.17.2"
resolved "https://registry.yarnpkg.com/@types/node/-/node-14.17.2.tgz#1e94476db57ec93a372c7f7d29aa5707cfb92339"
integrity sha512-sld7b/xmFum66AAKuz/rp/CUO8+98fMpyQ3SBfzzBNGMd/1iHBTAg9oyAvcYlAj46bpc74r91jSw2iFdnx29nw==
"@types/normalize-package-data@^2.4.0":
version "2.4.0"
resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.0.tgz#e486d0d97396d79beedd0a6e33f4534ff6b4973e"
@ -4035,10 +4035,10 @@
"@types/history" "*"
"@types/react" "*"
"@types/react-select@^3.0.19":
version "3.0.19"
resolved "https://registry.yarnpkg.com/@types/react-select/-/react-select-3.0.19.tgz#f73b04b8113451b0597df8a8315f9bf8ce03eb44"
integrity sha512-d+6qtfFXZeIOAABlVL1e50RZn8ctOABE4tFDxM6KW4lKuXgTTgLVrSik5AX9XjBjV7N80FtS6GTN/WeoXL9Jww==
"@types/react-select@^3.1.2":
version "3.1.2"
resolved "https://registry.yarnpkg.com/@types/react-select/-/react-select-3.1.2.tgz#38627df4b49be9b28f800ed72b35d830369a624b"
integrity sha512-ygvR/2FL87R2OLObEWFootYzkvm67LRA+URYEAcBuvKk7IXmdsnIwSGm60cVXGaqkJQHozb2Cy1t94tCYb6rJA==
dependencies:
"@types/react" "*"
"@types/react-dom" "*"
@ -7937,13 +7937,13 @@ electron-to-chromium@^1.3.523:
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.526.tgz#0e004899edf75afc172cce1b8189aac5dca646aa"
integrity sha512-HiroW5ZbGwgT8kCnoEO8qnGjoTPzJxduvV/Vv/wH63eo2N6Zj3xT5fmmaSPAPUM05iN9/5fIEkIg3owTtV6QZg==
electron@^9.2.0:
version "9.2.0"
resolved "https://registry.yarnpkg.com/electron/-/electron-9.2.0.tgz#d9fc8c8c9e5109669c366bd7b9ba83b06095d7a4"
integrity sha512-4ecZ3rcGg//Gk4fAK3Jo61T+uh36JhU6HHR/PTujQqQiBw1g4tNPd4R2hGGth2d+7FkRIs5GdRNef7h64fQEMw==
electron@^13.1.1:
version "13.1.1"
resolved "https://registry.yarnpkg.com/electron/-/electron-13.1.1.tgz#de1ea908bcac2197d7a5a373fb68c0c66043e10e"
integrity sha512-kySSb5CbIkWU2Kd9mf2rpGZC9p1nWhVVNl+CJjuOUGeVPXHbojHvTkDU1iC8AvV28eik3gqHisSJss40Caprog==
dependencies:
"@electron/get" "^1.0.1"
"@types/node" "^12.0.12"
"@types/node" "^14.6.2"
extract-zip "^1.0.3"
element-resize-detector@^1.2.1: