测试 redux 的 ConnectedComponent

Posted 2023-02-22

【中文标题】测试 redux 的 ConnectedComponent

【英文标题】：Testing redux's ConnectedComponent

【发布时间】：2019-06-13 23:38:21

【问题描述】：

我一直在尝试。但我无法相处。当我将商店作为商店道具传递给 ConnectedComponent 时，我收到此错误：

Invariant Violation：在 props 中传递 redux 存储已被删除，并且不执行任何操作。要为特定组件使用自定义 Redux 存储， 使用 React.createContext() 创建一个自定义的 React 上下文，并将上下文对象传递给 React-Redux 的 Provider 和特定组件，例如：.你也可以传递一个 context : MyContext 选项来连接

我的测试：

const store = storeFactory( success: true );
test('renders component without error', () => 
  const wrapper = shallow(<Input store=store />);

  expect(wrapper.props()).toBe();
);

我使用创建商店的辅助函数：

export const storeFactory = initialState => 
  return createStore(rootReducer, initialState);
;

我使用这个版本的包：

"react-redux": "^6.0.0",
"redux": "^4.0.1",
"enzyme": "^3.8.0",
"enzyme-adapter-react-16": "^1.7.1",
"enzyme-redux": "^0.2.1",
"jest": "^23.6.0",
"jest-enzyme": "^7.0.1"

我不知道如何测试 ConnectedComponent。 如果您对这种情况有任何解决方案或建议，请与我分享））

【参考方案1】：

是的，在 React-Redux v6 中，we removed the ability to pass store as a prop to connected components，因为内部架构发生了变化。

老实说，浅层渲染连接的组件对我来说似乎毫无意义，因为您真正测试的只是 connect 调用您的 mapState 和 mapDispatch 并将组合结果传递给您自己零件。我们已经对 React-Redux 进行了测试来验证该行为:)

但是，似乎确实有人想要这样做。我们有an open issue to discuss how we can help handle the "shallow+connected" use case。没有关于 API 的具体更改的 ETA，但请密切关注该问题。

【讨论】：

我想我应该只测试道具而不是这里描述的商店github.com/reduxjs/redux/blob/master/docs/recipes/…