我们使用 Enzyme 和 Jest 进行测试。
在我们的代码库中更新到最新版本的 react-redux,并且所有连接的组件测试用例开始失败(版本 6)。
使用
import { createMockStore } from 'redux-test-utils';
创建商店
适用于旧版本的测试用例:
const wrapper = shallow(<SomeConnectedComponent />, {context: { store }});
这失败给出错误
不变违规:在“Connect(SomeConnectedComponent)”的上下文中找不到“store”。
阅读了几篇文章,得到了使用提供程序包装器安装和包装的建议
const wrapper = mount(<Provider store={store}><SomeConnectedComponent /></Provider>);
上面的代码有效,但我希望它与吞咽一起用于单元测试。
编辑 :
const wrapper = shallow(<Provider store={store}>
<SomeConnectedComponent />
</Provider>)
上面的代码返回空的shallowWraper 对象。
使用 react-redux 版本 > 6 吞下连接组件的最佳方法是什么
最佳答案
Shallow 不适用于最新版本的 react-redux。
从版本 6.x 开始,它会导致上述问题。
我发现的最佳解决方案是使用旧版本的 react-redux 进行测试,
和用于实际代码的较新的。
1)将旧版本添加为开发依赖项。因为有较新版本的 react-redux,所以您需要使用别名。这可以是任何版本 5.x 这将安装“react-redux-test”
yarn add react-redux-test@npm:react-redux@5.0.6 -D
2) 在 _ mocks _ 文件夹下,创建一个新文件 react-redux.js 并从里面导出旧版本
export * from 'react-redux-test';
默认情况下,这个模拟将在每个测试用例文件中使用,因此旧的测试代码不再中断。
但是,如果您想使用新的 react-redux 库进行测试,则可以使用
jest.unmock('react-redux')
在新的测试文件上方。
升级后有数百个测试失败,这种方法对我有用,因为我也想在新组件中使用 Hooks Api。
通过这种方式,您可以使用新库的功能,直到 enzyme /react-redux 提出修复程序。
关于reactjs - enzyme /Jest react 测试 - 具有 react-redux > 6 的浅连接组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59191129/