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

More

Browse Source
This commit is contained in:
Nathan Bierema 2020-08-08 14:40:29 -04:00
parent 72029d8046
commit 9d26e6595b
15 changed files with 1183 additions and 807 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -8,7 +8,7 @@
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-react": "^7.20.5",
"husky": "^4.2.5",
"jest": "^24.9.0",
"jest": "^26.2.2",
"lerna": "^3.22.1",
"lint-staged": "^8.2.1",
"prettier": "^1.19.1"

2
packages/devui/package.json
View File

@ -46,7 +46,7 @@
"enzyme-adapter-react-16": "^1.15.3",
"enzyme-to-json": "^3.5.0",
"git-url-parse": "^11.1.2",
"jest": "^24.9.0",
"jest": "^26.2.2",
"jsdom": "^11.12.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",

26
packages/devui/tests/Editor.test.js
View File

@ -7,17 +7,23 @@ import 'codemirror/mode/javascript/javascript';
describe('Editor', function() {
const getBoundingClientRect = jest.fn();
const getClientRects = jest.fn();
document.body.createTextRange = function() {
return {
getBoundingClientRect() {
getBoundingClientRect();
return {};
},
getClientRects() {
getClientRects();
return {};
}
// See https://github.com/jsdom/jsdom/issues/3002
document.createRange = () => {
const range = new Range();
range.getBoundingClientRect = getBoundingClientRect;
range.getClientRects = () => {
getClientRects();
return {
item: () => null,
length: 0,
[Symbol.iterator]: jest.fn()
};
};
return range;
};
const wrapper = mount(<Editor value="var a = 1;" />);

2
packages/map2tree/package.json
View File

@ -35,7 +35,7 @@
"@babel/preset-env": "^7.11.0",
"babel-loader": "^8.1.0",
"immutable": "^3.8.2",
"jest": "^24.9.0",
"jest": "^26.2.2",
"rimraf": "^2.7.1",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12"

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

@ -45,7 +45,7 @@
"@babel/preset-env": "^7.11.0",
"@babel/preset-react": "^7.10.4",
"babel-loader": "^8.1.0",
"jest": "^24.9.0",
"jest": "^26.2.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-test-renderer": "^16.13.1",

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

@ -57,7 +57,7 @@
"uuid": "^3.4.0"
},
"devDependencies": {
"jest": "^24.9.0",
"jest": "^26.2.2",
"socketcluster-client": "^14.3.1",
"supertest": "^3.4.2"
}

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

@ -51,7 +51,7 @@
"file-loader": "^6.0.0",
"html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0",
"jest": "^24.9.0",
"jest": "^26.2.2",
"raw-loader": "^1.0.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",

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

@ -38,7 +38,7 @@
"@babel/preset-env": "^7.11.0",
"babel-loader": "^8.1.0",
"expect": "^26.2.0",
"jest": "^24.9.0",
"jest": "^26.2.2",
"redux": "^4.0.5",
"rimraf": "^2.7.1",
"rxjs": "^6.6.2"

139
packages/redux-devtools-test-generator/demo/src/js/DemoApp.jsx
View File

@ -24,61 +24,37 @@ const styles = {
const ROOT = '/'; // process.env.NODE_ENV === 'production' ? '/' : '/';
function buildUrl(options) {
return `${ROOT}?` + [
options.useExtension ? 'ext' : '',
options.theme ? 'theme=' + options.theme : '',
options.dark ? 'dark' : ''
].filter(s => s).join('&');
}
class DemoApp extends React.Component {
render() {
const options = getOptions();
return (
<div style={styles.wrapper}>
<h3>
{pkg.name || <span style={styles.muted}>Package Name</span>}
</h3>
<h5>{pkg.description || <span style={styles.muted}>Package Description</span>}</h5>
<h3>{pkg.name || <span style={styles.muted}>Package Name</span>}</h3>
<h5>
{pkg.description || (
<span style={styles.muted}>Package Description</span>
)}
</h5>
<Toolbar>
<Spacer />
<Button onClick={this.props.increment}>
Increment
</Button>
<Button onClick={this.props.push}>
Push
</Button>
<Button onClick={this.props.pop}>
Pop
</Button>
<Button onClick={this.props.replace}>
Replace
</Button>
<Button onClick={this.props.changeNested}>
Change Nested
</Button>
<Button onClick={this.props.increment}>Increment</Button>
<Button onClick={this.props.push}>Push</Button>
<Button onClick={this.props.pop}>Pop</Button>
<Button onClick={this.props.replace}>Replace</Button>
<Button onClick={this.props.changeNested}>Change Nested</Button>
<Spacer />
</Toolbar>
<Toolbar>
<Spacer />
<Button onClick={this.props.pushHugeArray}>
Push Huge Array
</Button>
<Button onClick={this.props.addHugeObect}>
Add Huge Object
</Button>
<Button onClick={this.props.hugePayload}>
Huge Payload
</Button>
<Button onClick={this.props.pushHugeArray}>Push Huge Array</Button>
<Button onClick={this.props.addHugeObect}>Add Huge Object</Button>
<Button onClick={this.props.hugePayload}>Huge Payload</Button>
<Spacer />
</Toolbar>
<Toolbar>
<Spacer />
<Button onClick={this.props.addIterator}>
Add Iterator
</Button>
<Button onClick={this.props.addIterator}>Add Iterator</Button>
<Button onClick={this.props.addImmutableMap}>
Add Immutable Map
</Button>
@ -89,15 +65,9 @@ class DemoApp extends React.Component {
</Toolbar>
<Toolbar>
<Spacer />
<Button onClick={this.props.addRecursive}>
Add Recursive
</Button>
<Button onClick={this.props.addFunction}>
Add Function
</Button>
<Button onClick={this.props.addSymbol}>
Add Symbol
</Button>
<Button onClick={this.props.addRecursive}>Add Recursive</Button>
<Button onClick={this.props.addFunction}>Add Function</Button>
<Button onClick={this.props.addSymbol}>Add Symbol</Button>
<Spacer />
</Toolbar>
<Toolbar>
@ -105,16 +75,19 @@ class DemoApp extends React.Component {
<Button onClick={this.toggleTimeoutUpdate}>
Timeout Update {this.props.timeoutUpdateEnabled ? 'On' : 'Off'}
</Button>
<Button onClick={this.props.shuffleArray}>
Shuffle Array
</Button>
<Button onClick={this.props.shuffleArray}>Shuffle Array</Button>
<Spacer />
</Toolbar>
<div>
{options.useExtension ?
<a href={`${ROOT}`} style={styles.link}>Disable browser extension</a> :
<a href={`${ROOT}?ext`} style={styles.link}>Use browser extension</a>
}
{options.useExtension ? (
<a href={`${ROOT}`} style={styles.link}>
Disable browser extension
</a>
) : (
<a href={`${ROOT}?ext`} style={styles.link}>
Use browser extension
</a>
)}
</div>
</div>
);
@ -129,34 +102,32 @@ class DemoApp extends React.Component {
} else {
clearTimeout(this.timeout);
}
}
};
}
export default connect(
state => state,
{
toggleTimeoutUpdate: timeoutUpdateEnabled => ({
type: 'TOGGLE_TIMEOUT_UPDATE', timeoutUpdateEnabled
}),
timeoutUpdate: () => ({ type: 'TIMEOUT_UPDATE' }),
increment: () => ({ type: 'INCREMENT' }),
push: () => ({ type: 'PUSH' }),
pop: () => ({ type: 'POP' }),
replace: () => ({ type: 'REPLACE' }),
changeNested: () => ({ type: 'CHANGE_NESTED' }),
pushHugeArray: () => ({ type: 'PUSH_HUGE_ARRAY' }),
addIterator: () => ({ type: 'ADD_ITERATOR' }),
addHugeObect: () => ({ type: 'ADD_HUGE_OBJECT' }),
addRecursive: () => ({ type: 'ADD_RECURSIVE' }),
addImmutableMap: () => ({ type: 'ADD_IMMUTABLE_MAP' }),
changeImmutableNested: () => ({ type: 'CHANGE_IMMUTABLE_NESTED' }),
hugePayload: () => ({
type: 'HUGE_PAYLOAD',
payload: Array.from({ length: 10000 }).map((_, i) => i)
}),
addFunction: () => ({ type: 'ADD_FUNCTION' }),
addSymbol: () => ({ type: 'ADD_SYMBOL' }),
shuffleArray: () => ({ type: 'SHUFFLE_ARRAY' }),
pushRoute
}
)(DemoApp);
export default connect(state => state, {
toggleTimeoutUpdate: timeoutUpdateEnabled => ({
type: 'TOGGLE_TIMEOUT_UPDATE',
timeoutUpdateEnabled
}),
timeoutUpdate: () => ({ type: 'TIMEOUT_UPDATE' }),
increment: () => ({ type: 'INCREMENT' }),
push: () => ({ type: 'PUSH' }),
pop: () => ({ type: 'POP' }),
replace: () => ({ type: 'REPLACE' }),
changeNested: () => ({ type: 'CHANGE_NESTED' }),
pushHugeArray: () => ({ type: 'PUSH_HUGE_ARRAY' }),
addIterator: () => ({ type: 'ADD_ITERATOR' }),
addHugeObect: () => ({ type: 'ADD_HUGE_OBJECT' }),
addRecursive: () => ({ type: 'ADD_RECURSIVE' }),
addImmutableMap: () => ({ type: 'ADD_IMMUTABLE_MAP' }),
changeImmutableNested: () => ({ type: 'CHANGE_IMMUTABLE_NESTED' }),
hugePayload: () => ({
type: 'HUGE_PAYLOAD',
payload: Array.from({ length: 10000 }).map((_, i) => i)
}),
addFunction: () => ({ type: 'ADD_FUNCTION' }),
addSymbol: () => ({ type: 'ADD_SYMBOL' }),
shuffleArray: () => ({ type: 'SHUFFLE_ARRAY' }),
pushRoute
})(DemoApp);

2
packages/redux-devtools-test-generator/demo/src/js/getOptions.js
View File

@ -4,7 +4,7 @@ export default function getOptions() {
supportImmutable: window.location.search.indexOf('immutable') !== -1,
theme: do {
const match = window.location.search.match(/theme=([^&]+)/);
match ? match[1] : 'inspector'
match ? match[1] : 'inspector';
},
dark: window.location.search.indexOf('dark') !== -1
};

134
packages/redux-devtools-test-generator/demo/src/js/reducers.js
View File

@ -3,13 +3,15 @@ import shuffle from 'lodash.shuffle';
const NESTED = {
long: {
nested: [{
path: {
to: {
a: 'key'
nested: [
{
path: {
to: {
a: 'key'
}
}
}
}]
]
}
};
@ -18,7 +20,7 @@ const IMMUTABLE_NESTED = Immutable.fromJS(NESTED);
/* eslint-disable babel/new-cap */
const IMMUTABLE_MAP = Immutable.Map({
map: Immutable.Map({ a:1, b: 2, c: 3 }),
map: Immutable.Map({ a: 1, b: 2, c: 3 }),
list: Immutable.List(['a', 'b', 'c']),
set: Immutable.Set(['a', 'b', 'c']),
stack: Immutable.Stack(['a', 'b', 'c']),
@ -27,24 +29,29 @@ const IMMUTABLE_MAP = Immutable.Map({
/* eslint-enable babel/new-cap */
const HUGE_ARRAY = Array.from({ length: 5000 })
.map((_, key) => ({ str: 'key ' + key }));
const HUGE_ARRAY = Array.from({ length: 5000 }).map((_, key) => ({
str: 'key ' + key
}));
const HUGE_OBJECT = Array.from({ length: 5000 })
.reduce((o, _, key) => (o['key ' + key] = 'item ' + key, o), {});
const HUGE_OBJECT = Array.from({ length: 5000 }).reduce(
(o, _, key) => ((o['key ' + key] = 'item ' + key), o),
{}
);
const FUNC = function (a, b, c) { return a + b + c; };
const FUNC = function(a, b, c) {
return a + b + c;
};
const RECURSIVE = {};
RECURSIVE.obj = RECURSIVE;
function createIterator() {
const iterable = {};
iterable[window.Symbol.iterator] = function *iterator() {
iterable[window.Symbol.iterator] = function* iterator() {
for (var i = 0; i < 333; i++) {
yield 'item ' + i;
}
}
};
return iterable;
}
@ -52,52 +59,61 @@ function createIterator() {
const DEFAULT_SHUFFLE_ARRAY = [0, 1, null, { id: 1 }, { id: 2 }, 'string'];
export default {
timeoutUpdateEnabled: (state=false, action) => action.type === 'TOGGLE_TIMEOUT_UPDATE' ?
action.timeoutUpdateEnabled : state,
store: (state=0, action) => action.type === 'INCREMENT' ? state + 1 : state,
undefined: (state={ val: undefined }) => state,
null: (state=null) => state,
func: (state=() => {}) => state,
array: (state=[], action) => action.type === 'PUSH' ?
[...state, Math.random()] : (
action.type === 'POP' ? state.slice(0, state.length - 1) : (
action.type === 'REPLACE' ? [Math.random(), ...state.slice(1)] : state
)
),
hugeArrays: (state=[], action) => action.type === 'PUSH_HUGE_ARRAY' ?
[ ...state, ...HUGE_ARRAY ] : state,
hugeObjects: (state=[], action) => action.type === 'ADD_HUGE_OBJECT' ?
[ ...state, HUGE_OBJECT ] : state,
iterators: (state=[], action) => action.type === 'ADD_ITERATOR' ?
[...state, createIterator()] : state,
nested: (state=NESTED, action) =>
action.type === 'CHANGE_NESTED' ?
{
...state,
long: {
nested: [{
path: {
to: {
a: state.long.nested[0].path.to.a + '!'
timeoutUpdateEnabled: (state = false, action) =>
action.type === 'TOGGLE_TIMEOUT_UPDATE'
? action.timeoutUpdateEnabled
: state,
store: (state = 0, action) =>
action.type === 'INCREMENT' ? state + 1 : state,
undefined: (state = { val: undefined }) => state,
null: (state = null) => state,
func: (state = () => {}) => state,
array: (state = [], action) =>
action.type === 'PUSH'
? [...state, Math.random()]
: action.type === 'POP'
? state.slice(0, state.length - 1)
: action.type === 'REPLACE'
? [Math.random(), ...state.slice(1)]
: state,
hugeArrays: (state = [], action) =>
action.type === 'PUSH_HUGE_ARRAY' ? [...state, ...HUGE_ARRAY] : state,
hugeObjects: (state = [], action) =>
action.type === 'ADD_HUGE_OBJECT' ? [...state, HUGE_OBJECT] : state,
iterators: (state = [], action) =>
action.type === 'ADD_ITERATOR' ? [...state, createIterator()] : state,
nested: (state = NESTED, action) =>
action.type === 'CHANGE_NESTED'
? {
...state,
long: {
nested: [
{
path: {
to: {
a: state.long.nested[0].path.to.a + '!'
}
}
}
}
}]
]
}
}
} : state,
recursive: (state=[], action) => action.type === 'ADD_RECURSIVE' ?
[...state, { ...RECURSIVE }] : state,
immutables: (state=[], action) => action.type === 'ADD_IMMUTABLE_MAP' ?
[...state, IMMUTABLE_MAP] : state,
immutableNested: (state=IMMUTABLE_NESTED, action) => action.type === 'CHANGE_IMMUTABLE_NESTED' ?
state.updateIn(
['long', 'nested', 0, 'path', 'to', 'a'],
str => str + '!'
) : state,
addFunction: (state=null, action) => action.type === 'ADD_FUNCTION' ?
{ f: FUNC } : state,
addSymbol: (state=null, action) => action.type === 'ADD_SYMBOL' ?
{ s: window.Symbol('symbol') } : state,
shuffleArray: (state=DEFAULT_SHUFFLE_ARRAY, action) =>
action.type === 'SHUFFLE_ARRAY' ?
shuffle(state) : state
: state,
recursive: (state = [], action) =>
action.type === 'ADD_RECURSIVE' ? [...state, { ...RECURSIVE }] : state,
immutables: (state = [], action) =>
action.type === 'ADD_IMMUTABLE_MAP' ? [...state, IMMUTABLE_MAP] : state,
immutableNested: (state = IMMUTABLE_NESTED, action) =>
action.type === 'CHANGE_IMMUTABLE_NESTED'
? state.updateIn(
['long', 'nested', 0, 'path', 'to', 'a'],
str => str + '!'
)
: state,
addFunction: (state = null, action) =>
action.type === 'ADD_FUNCTION' ? { f: FUNC } : state,
addSymbol: (state = null, action) =>
action.type === 'ADD_SYMBOL' ? { s: window.Symbol('symbol') } : state,
shuffleArray: (state = DEFAULT_SHUFFLE_ARRAY, action) =>
action.type === 'SHUFFLE_ARRAY' ? shuffle(state) : state
};

2
packages/redux-devtools-test-generator/package.json
View File

@ -52,7 +52,7 @@
"export-files-webpack-plugin": "^0.0.1",
"file-loader": "^6.0.0",
"html-webpack-plugin": "^4.3.0",
"jest": "^24.9.0",
"jest": "^26.2.2",
"lodash.shuffle": "^4.2.0",
"react-dom": "^16.13.1",
"react-redux": "^6.0.1",

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

@ -32,7 +32,7 @@
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.3",
"enzyme-to-json": "^3.5.0",
"jest": "^24.9.0",
"jest": "^26.2.2",
"react-dom": "^16.13.1",
"react-test-renderer": "^16.13.1",
"rimraf": "^2.7.1"

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

@ -39,7 +39,7 @@
"@babel/preset-env": "^7.11.0",
"@babel/preset-react": "^7.10.4",
"babel-loader": "^8.1.0",
"jest": "^24.9.0",
"jest": "^26.2.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-redux": "^6.0.1",

1669
yarn.lock
View File

File diff suppressed because it is too large Load Diff