为何一个函数的状态测试成功另一个失败？React测试求助

看起来你遇到了个有点迷惑的测试问题——两个逻辑相近的状态切换测试，一个报错找不到Redux store，另一个却顺利通过。我来帮你拆解下原因和解决办法：

问题根源分析 #

你的组件默认状态passwordChangeOpen就是false，所以第二个测试调用onClosePasswordChange()后，状态还是维持false，组件可能没触发依赖Redux store的重新渲染逻辑，也就没暴露store缺失的问题。

但第一个测试调用openPasswordChange()后，状态变为true，这会触发组件重新渲染，而你的组件（或它的子组件）依赖Redux store，此时测试环境里没有提供store，就抛出了Could not find "store" in either the context or props的错误。

具体解决步骤 #

• 给测试组件包裹Redux Provider：在测试挂载组件时，必须用Redux的Provider把组件包起来，提供一个mock的store。示例代码如下：

  import { Provider } from 'react-redux';
  import configureMockStore from 'redux-mock-store';
  
  const mockStore = configureMockStore();
  // 这里填入你的组件/子组件需要的初始store结构
  const store = mockStore({ user: { /* 模拟的用户数据 */ } });
  
  // 测试中挂载组件的正确方式
  const wrapper = mount(
    <Provider store={store}>
      <SettingsItemPassword {...mockPropsForComponent} />
    </Provider>
  );
  

• 确保mock store包含必要的state片段：如果组件或子组件需要从store读取特定数据，一定要在mock store里提供对应的初始值，避免渲染时触发其他错误。
• 可选：更新组件后再断言：虽然直接调用实例方法会同步更新状态，但如果组件有复杂渲染逻辑，调用wrapper.update()强制更新后再做断言会更稳妥：

  instance.openPasswordChange();
  wrapper.update();
  expect(wrapper.state('passwordChangeOpen')).toBeTruthy();
  

额外提醒 #

以后只要组件依赖Redux，不管测试逻辑看起来会不会触发渲染，都要统一给组件加上Provider包裹，避免这种“随机通过”的测试情况，保证测试的一致性和可靠性。

内容的提问来源于stack exchange，提问作者Jonathan