Jest/RTL测试环境下Redux Mock Store未更新问题排查

你的问题核心在于redux-mock-store的工作机制：这个库仅模拟Redux store的dispatch行为以记录action调用，但不会像真实Redux那样通过reducer自动更新store状态。所以即便组件正确触发了更新逻辑，storeMock.getState()返回的始终是初始值。

具体解决方法 #

方法一：手动更新mock store状态 #

既然你已经通过前两个断言验证了mockedInitProducts的调用逻辑完全正确，若仍需断言store状态，可手动更新mock store：

// 在fireEvent.click之后添加手动更新代码
storeMock.setState({
  productsDataState: updatedQtdeValues
});

// 再执行最后的状态断言
const updatedState = storeMock.getState().productsDataState;
const updatedQtde = updatedState.find((product: ProductsList) => product.id === id)?.qtde;
expect(updatedQtde).toBe(3);

方法二：使用真实reducer创建mock store #

若想让测试更贴近真实运行环境，可传入项目中真实的reducer来创建mock store，这样dispatch action后store会自动更新状态：

// 导入项目中的真实根reducer
import rootReducer from '../path/to/your/rootReducer';

// 用真实reducer初始化mock store
const mockStore = configureStore([rootReducer]);
// 后续测试代码保持不变

额外建议 #

作为测试新手，需明确测试核心目标：如果这个测试是为了验证组件点击按钮后是否正确触发了数据更新逻辑，前两个断言已经足够覆盖；如果一定要验证store状态变化，更推荐使用真实reducer的方式，它能同时覆盖reducer的逻辑正确性。

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