在React＆Redux中使用Enzyme进行嵌套组件测试

小编典典

在React＆Redux中使用Enzyme进行嵌套组件测试

reactjs

我有一个SampleComponent可挂载另一个“连接的组件”（即container）的组件。当我尝试SampleComponent通过mounting
进行测试（因为我需要componentDidMount）时，出现错误：

永久违反：在“
Connect（ContainerComponent）”的上下文或属性中找不到“存储”。可以将根组件包装在中，或者将“存储”作为道具明确传递给“
Connect（ContainerComponent）”。

对此进行测试的最佳方法是什么？

阅读 377

2020-07-22

共1个答案

小编典典

实际上，我要做的就是将redux商店（和Provider）带进来，并将其包装在一个实用程序组件中，如下所示：

export const CustomProvider = ({ children }) => {
  return (
    <Provider store={store}>
      {children}
    </Provider>
  );
};

然后，我mount将SampleComponent和对其运行测试：

it('contains <ChildComponent/> Component', () => {
  const wrapper = mount(
    <CustomProvider>
      <SampleComponent {...defaultProps} />
    </CustomProvider>
  );
  expect(wrapper.find(ChildComponent)).to.have.length(1);
});

2020-07-22