哪种酶适配器适用于 React 17？

Question

我有一个 React 应用程序，我想开始使用 Enzyme 编写单元测试。 Enzyme 的 documentation 讨论了最多 16 个版本的 React。

在src/setupTests.js我目前有

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

但我的应用程序使用 React 版本 17.0.1。 React 17 有什么酶适配器？

Answer 1

What enzyme adapter is there for React 17?

如果你有 React 版本 17，你可以使用这个 unofficial adapter for React 17 for enzyme。

// src/setupTests.js
import { configure } from 'enzyme';
import Adapter from '@wojtekmaj/enzyme-adapter-react-17';

configure({ adapter: new Adapter() });

有关非官方适配器的更多信息，请参阅此 GitHub issue。

Answer 2

我尝试使用非官方适配器“@wojtekmaj/enzyme-adapter-react-17”，它工作正常。 谢谢@super Jade。

清除 npm 缓存（清除这可能会使 npm 变慢，但请尝试一下）。

npm cache verify 然后 npm cache clean --force

删除你的

node_modules 和 package-lock.json

用 "@testing-library/react": "^11.2.5","@wojtekmaj/enzyme-adapter-react-17": "^0.4.1","react": "^17.0.1","react-dom": "^17.0.1",

package.json

npm i --legacy-peer-deps
as @wojtekmaj/enzyme-adapter-react-17 提到在测试文件中进行更改。

从 '@wojtekmaj/enzyme-adapter-react-17';
配置({ adapter: new Adapter() });

Answer 3

在 setupTests.js 文件中添加此代码

// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom';
import Enzyme from 'enzyme';
import Adapter from '@wojtekmaj/enzyme-adapter-react-17';

Enzyme.configure({ adapter: new Adapter() });

Answer 4

我已经为 React 17 尝试了 @wojtekmaj/enzyme-adapter-react-17，它工作得很好。

使用 npm install --save-dev @wojtekmaj/enzyme-adapter-react-17 后，您还需要设置 enzyme 以使用您希望它使用的适配器，您可以通过添加顶级配置 API:

来实现

/* src/setupTests.js */
import Enzyme from 'enzyme';
import Adapter from '@wojtekmaj/enzyme-adapter-react-17';

Enzyme.configure({ adapter: new Adapter() });

哪种酶适配器适用于 React 17？

Which Enzyme adapter works with React 17?

unit-testing

reactjs

enzyme