mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2025-10-25 05:01:03 +03:00
* dock-monitor * log-monitor * serialize * slider-monitor * inspector-monitor * chart-monitor * test-tab * trace-tab * Fix
4.3 KiB
4.3 KiB
Redux DevTools Test Generator
Installation
yarn add @redux-devtools/inspector-monitor-test-tab
Usage
If you use Redux DevTools Extension, Remote Redux DevTools or RemoteDev, it's already there, and no additional actions required.
With redux-devtools and redux-devtools-inspector-monitor:
containers/DevTools.js
import React from 'react';
import { createDevTools } from '@redux-devtools/core';
import InspectorMonitor from '@redux-devtools/inspector-monitor';
import TestGenerator from '@redux-devtools/inspector-monitor-test-tab';
import mochaTemplate from '@redux-devtools/inspector-monitor-test-tab/lib/redux/mocha'; // If using default tests.
const testComponent = (props) => (
<TestGenerator
expect={mochaTemplate.expect} wrap={mochaTemplate.wrap} useCodemirror
{...props}
/>
);
export default createDevTools(
<InspectorMonitor
tabs: defaultTabs => [...defaultTabs, { name: 'Test', component: testComponent }]
/>
);
Instead of mochaTemplate.expect and mochaTemplate.wrap you can use your function templates.
If useCodemirror specified, include codemirror/lib/codemirror.css style and optionally themes from codemirror/theme/.
Props
| Name | Description |
|---|---|
assertion |
String template or function with an object argument containing action, prevState, curState keys, which returns a string representing the assertion (see the function or template). |
[wrap] |
Optional string template or function which gets assertions argument and returns a string (see the example function or template). |
[useCodemirror] |
Boolean. If specified will use codemirror styles. |
[theme] |
String. Name of the codemirror theme. |
License
MIT