在Jest / Enzyme中模拟useReducer的存储，而无需导入reducer

Question

我正在尝试编写一个涉及更新名为useReducer的组件的<Dashboard />状态的测试。

  const [store, dispatch] = useReducer(reducer, dashboardStore);

在测试中，我希望能够更新store。

    const wrapper = mount(<Dashboard />); // <Dashboard /> contains the useReducer

    ...

    it('example test', () => {
      let mockStore = ['first item'];
      mockStore.push('second item');

      expect(wrapper.find(Dashboard).find('input').props().value.toBe('second item');
    });

在示例测试中，我有一些伪代码模拟store，然后将值推送到该伪代码。然后，我检查是否根据store的更改更新了此组件中的另一个子元素。

这可能吗？我需要将useReducer导入测试文件吗？

Answer 1

[如果您重构Dashboard以使用依赖项注入，并提供存储的初始状态作为道具，则可能：

function Dashboard({dashboardStore}) {
    ...
    const [store, dispatch] = useReducer(reducer, dashboardStore);
    ...
}

然后，您可以在测试中提供模拟存储作为道具：

let mockStore = ['first item'];
mockStore.push('second item');
const wrapper = mount(<Dashboard dashboardStore={mockStore} />);

否则，如果这不可能，您将在测试中留下模拟useReducer的信息。