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

Replace enzyme with React testing library in test-tab (#915)

Browse Source
This commit is contained in:
Nathan Bierema 2021-10-21 17:55:21 -04:00 committed by GitHub
parent 492aa362fb
commit f1514f7e4a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 84 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/redux-devtools-inspector-monitor-test-tab/jest.config.js
View File

@ -1,6 +1,5 @@
module.exports = {
preset: 'ts-jest',
setupFilesAfterEnv: ['<rootDir>/test/setup.ts'],
testEnvironment: 'jsdom',
moduleNameMapper: {
'\\.css$': '<rootDir>/test/__mocks__/styleMock.ts',

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

@ -60,8 +60,7 @@
"@babel/preset-typescript": "^7.15.0",
"@redux-devtools/core": "^3.9.0",
"@redux-devtools/inspector-monitor": "^1.0.0",
"@types/enzyme": "^3.10.10",
"@types/enzyme-adapter-react-16": "^1.0.6",
"@testing-library/react": "^12.1.2",
"@types/es6template": "^1.0.0",
"@types/jest": "^27.0.2",
"@types/jsan": "^3.1.2",
@ -70,9 +69,6 @@
"@types/simple-diff": "^1.6.1",
"@typescript-eslint/eslint-plugin": "^5.1.0",
"@typescript-eslint/parser": "^5.1.0",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.6",
"enzyme-to-json": "^3.6.2",
"eslint": "^7.32.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-jest": "^25.2.2",

31
packages/redux-devtools-inspector-monitor-test-tab/test/TestGenerator.spec.tsx
View File

@ -1,6 +1,5 @@
import React from 'react';
import { render } from 'enzyme';
import { renderToJson } from 'enzyme-to-json';
import { render, screen } from '@testing-library/react';
import { PerformAction } from '@redux-devtools/core';
import { Action } from 'redux';
import TestGenerator from '../src/TestGenerator';
@ -30,12 +29,12 @@ const TestGeneratorAsAny = TestGenerator as any;
describe('TestGenerator component', () => {
it('should show warning message when no params provided', () => {
const component = render(<TestGeneratorAsAny useCodemirror={false} />);
expect(renderToJson(component)).toMatchSnapshot();
const { container } = render(<TestGeneratorAsAny useCodemirror={false} />);
expect(container.firstChild).toMatchSnapshot();
});
it('should be empty when no actions provided', () => {
const component = render(
const { container } = render(
<TestGeneratorAsAny
assertion={fnTemplate.assertion}
dispatcher={fnTemplate.dispatcher}
@ -43,11 +42,11 @@ describe('TestGenerator component', () => {
useCodemirror={false}
/>
);
expect(renderToJson(component)).toMatchSnapshot();
expect(container.firstChild).toMatchSnapshot();
});
it("should match function template's test for first action", () => {
const component = render(
const { container } = render(
<TestGeneratorAsAny
assertion={fnTemplate.assertion}
dispatcher={fnTemplate.dispatcher}
@ -58,11 +57,11 @@ describe('TestGenerator component', () => {
useCodemirror={false}
/>
);
expect(renderToJson(component)).toMatchSnapshot();
expect(container.firstChild).toMatchSnapshot();
});
it("should match string template's test for first action", () => {
const component = render(
const { container } = render(
<TestGeneratorAsAny
assertion={strTemplate.assertion}
dispatcher={strTemplate.dispatcher}
@ -73,11 +72,11 @@ describe('TestGenerator component', () => {
selectedActionId={1}
/>
);
expect(renderToJson(component)).toMatchSnapshot();
expect(container.firstChild).toMatchSnapshot();
});
it('should generate test for the last action when selectedActionId not specified', () => {
const component = render(
const { container } = render(
<TestGeneratorAsAny
assertion={fnTemplate.assertion}
dispatcher={fnTemplate.dispatcher}
@ -87,11 +86,11 @@ describe('TestGenerator component', () => {
useCodemirror={false}
/>
);
expect(renderToJson(component)).toMatchSnapshot();
expect(container.firstChild).toMatchSnapshot();
});
it('should generate test for vanilla js class', () => {
const component = render(
const { container } = render(
<TestGeneratorAsAny
assertion={fnVanillaTemplate.assertion}
dispatcher={fnVanillaTemplate.dispatcher}
@ -104,11 +103,11 @@ describe('TestGenerator component', () => {
useCodemirror={false}
/>
);
expect(renderToJson(component)).toMatchSnapshot();
expect(container.firstChild).toMatchSnapshot();
});
it('should generate test for vanilla js class with string template', () => {
const component = render(
const { container } = render(
<TestGeneratorAsAny
assertion={strVanillaTemplate.assertion}
dispatcher={strVanillaTemplate.dispatcher}
@ -121,6 +120,6 @@ describe('TestGenerator component', () => {
useCodemirror={false}
/>
);
expect(renderToJson(component)).toMatchSnapshot();
expect(container.firstChild).toMatchSnapshot();
});
});

14
packages/redux-devtools-inspector-monitor-test-tab/test/__snapshots__/TestGenerator.spec.tsx.snap
View File

@ -2,13 +2,13 @@
exports[`TestGenerator component should be empty when no actions provided 1`] = `
<textarea
style="padding:10px;width:100%;height:100%"
style="padding: 10px; width: 100%; height: 100%;"
/>
`;
exports[`TestGenerator component should generate test for the last action when selectedActionId not specified 1`] = `
<textarea
style="padding:10px;width:100%;height:100%"
style="padding: 10px; width: 100%; height: 100%;"
>
import expect from 'expect';
import reducers from '../../reducers';
@ -26,7 +26,7 @@ expect(state).toEqual({counter:1});
exports[`TestGenerator component should generate test for vanilla js class 1`] = `
<textarea
style="padding:10px;width:100%;height:100%"
style="padding: 10px; width: 100%; height: 100%;"
>
import expect from 'expect';
import SomeStore from '../../stores/SomeStore';
@ -44,7 +44,7 @@ expect(store.counter).toEqual(1);
exports[`TestGenerator component should generate test for vanilla js class with string template 1`] = `
<textarea
style="padding:10px;width:100%;height:100%"
style="padding: 10px; width: 100%; height: 100%;"
>
import expect from 'expect';
import SomeStore from '../../stores/SomeStore';
@ -62,7 +62,7 @@ describe('SomeStore', () =&gt; {
exports[`TestGenerator component should match function template's test for first action 1`] = `
<textarea
style="padding:10px;width:100%;height:100%"
style="padding: 10px; width: 100%; height: 100%;"
>
import expect from 'expect';
import reducers from '../../reducers';
@ -80,7 +80,7 @@ expect(state).toEqual({counter:1});
exports[`TestGenerator component should match string template's test for first action 1`] = `
<textarea
style="padding:10px;width:100%;height:100%"
style="padding: 10px; width: 100%; height: 100%;"
>
import expect from 'expect';
import reducers from '../../reducers';
@ -98,6 +98,6 @@ describe('reducers', () =&gt; {
exports[`TestGenerator component should show warning message when no params provided 1`] = `
<textarea
style="padding:10px;width:100%;height:100%"
style="padding: 10px; width: 100%; height: 100%;"
/>
`;

4
packages/redux-devtools-inspector-monitor-test-tab/test/setup.ts
View File

@ -1,4 +0,0 @@
import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
Enzyme.configure({ adapter: new Adapter() });

67
yarn.lock
View File

@ -4751,8 +4751,7 @@ __metadata:
"@redux-devtools/core": ^3.9.0
"@redux-devtools/inspector-monitor": ^1.0.0
"@redux-devtools/ui": ^1.0.0-9
"@types/enzyme": ^3.10.10
"@types/enzyme-adapter-react-16": ^1.0.6
"@testing-library/react": ^12.1.2
"@types/es6template": ^1.0.0
"@types/jest": ^27.0.2
"@types/jsan": ^3.1.2
@ -4762,9 +4761,6 @@ __metadata:
"@types/simple-diff": ^1.6.1
"@typescript-eslint/eslint-plugin": ^5.1.0
"@typescript-eslint/parser": ^5.1.0
enzyme: ^3.11.0
enzyme-adapter-react-16: ^1.15.6
enzyme-to-json: ^3.6.2
es6template: ^1.0.5
eslint: ^7.32.0
eslint-config-prettier: ^8.3.0
@ -6300,6 +6296,35 @@ __metadata:
languageName: node
linkType: hard
"@testing-library/dom@npm:^8.0.0":
version: 8.10.1
resolution: "@testing-library/dom@npm:8.10.1"
dependencies:
"@babel/code-frame": ^7.10.4
"@babel/runtime": ^7.12.5
"@types/aria-query": ^4.2.0
aria-query: ^5.0.0
chalk: ^4.1.0
dom-accessibility-api: ^0.5.9
lz-string: ^1.4.4
pretty-format: ^27.0.2
checksum: c11da16d981d4479fa18b2e90a62d2c19871da414016a4f80136394cf35e833ca4de4b56a64225f6bd5d3a13842176236d3508d217e3858c5e2ef35a3f391d5b
languageName: node
linkType: hard
"@testing-library/react@npm:^12.1.2":
version: 12.1.2
resolution: "@testing-library/react@npm:12.1.2"
dependencies:
"@babel/runtime": ^7.12.5
"@testing-library/dom": ^8.0.0
peerDependencies:
react: "*"
react-dom: "*"
checksum: 70b0f7f27c83fe1a33e7df01b1e64850fbab4050c403848d611d852cadaa25ccde58518773002ae569a1350b2282c2ccbcbe5eb6af8b29ab377ab2a8ab573b3b
languageName: node
linkType: hard
"@tootallnate/once@npm:1":
version: 1.1.2
resolution: "@tootallnate/once@npm:1.1.2"
@ -6344,6 +6369,13 @@ __metadata:
languageName: node
linkType: hard
"@types/aria-query@npm:^4.2.0":
version: 4.2.2
resolution: "@types/aria-query@npm:4.2.2"
checksum: 6f2ce11d91e2d665f3873258db19da752d91d85d3679eb5efcdf9c711d14492287e1e4eb52613b28e60375841a9e428594e745b68436c963d8bad4bf72188df3
languageName: node
linkType: hard
"@types/async@npm:*":
version: 3.2.8
resolution: "@types/async@npm:3.2.8"
@ -9075,6 +9107,13 @@ __metadata:
languageName: node
linkType: hard
"aria-query@npm:^5.0.0":
version: 5.0.0
resolution: "aria-query@npm:5.0.0"
checksum: c41f98866c5a304561ee8cae55856711cddad6f3f85d8cb43cc5f79667078d9b8979ce32d244c1ff364e6463a4d0b6865804a33ccc717fed701b281cf7dc6296
languageName: node
linkType: hard
"arr-diff@npm:^4.0.0":
version: 4.0.0
resolution: "arr-diff@npm:4.0.0"
@ -13044,6 +13083,13 @@ __metadata:
languageName: node
linkType: hard
"dom-accessibility-api@npm:^0.5.9":
version: 0.5.9
resolution: "dom-accessibility-api@npm:0.5.9"
checksum: 3988bd1c58e115e972179b9ef881e65ab5da9c2e9d08f4e9646870301971fb0c72d0e0866559e0c06b91b9da6f1fed2f31f0fcbf0b6cffd959b01c0601da2c56
languageName: node
linkType: hard
"dom-converter@npm:^0.2.0":
version: 0.2.0
resolution: "dom-converter@npm:0.2.0"
@ -20131,6 +20177,15 @@ fsevents@^1.2.7:
languageName: node
linkType: hard
"lz-string@npm:^1.4.4":
version: 1.4.4
resolution: "lz-string@npm:1.4.4"
bin:
lz-string: bin/bin.js
checksum: 54e31238a61a84d8f664d9860a9fba7310c5b97a52c444f80543069bc084815eff40b8d4474ae1d93992fdf6c252dca37cf27f6adbeb4dbc3df2f3ac773d0e61
languageName: node
linkType: hard
"make-dir@npm:^1.0.0":
version: 1.3.0
resolution: "make-dir@npm:1.3.0"
@ -23539,7 +23594,7 @@ fsevents@^1.2.7:
languageName: node
linkType: hard
"pretty-format@npm:^27.0.0, pretty-format@npm:^27.3.1":
"pretty-format@npm:^27.0.0, pretty-format@npm:^27.0.2, pretty-format@npm:^27.3.1":
version: 27.3.1
resolution: "pretty-format@npm:27.3.1"
dependencies: