如何在 react-redux-thunk 中使用 reducer 编写动作的集成测试

Question

我在 utils.fetch_json 中有一个函数 returns json 的承诺（或 json 中的一些错误）。我想测试一下，当使用 fetch_json 的动作被调度时，updateData 这里，当 API 的时候，存储状态用 json 的有效载荷更新json有效。

例证：

import {createStore,  applyMiddleware} from "redux";
import Store from "../../reducers/foobar";
import { updateData } from "../../actions/foobar";
import utils from '../../utils'
import thunk from 'redux-thunk';

const data = {
    a: ["A1", "A2"],
    b: [20, 10],
}

describe("Test the reducer-actions", () => {
    utils.fetch_json = jest.fn().mockResolvedValue(data);

    it("updates the state when updateData is dispatched", () => {
        const store = createStore(Store, applyMiddleware(thunk));
        store.dispatch(updateData())
        expect(store.getState().data).toEqual(data);
    });
});

这失败了，因为 store.dispatch(updateData()) 的执行是异步的，因此 expect 在它之前执行，导致初始状态而不是 data 在商店中。

我试图避免对此的依赖，但如果符号类似于 jest，我愿意使用一个。

请注意，我不是要：

隔离测试减速器
单独测试动作创建器
单独测试 thunk-action

我有兴趣在集成中测试它们。

Answer 1

如果 updateData returns 那么你可以这样做：

store.dispatch(updateData()).then(()=>test here)

这是假设 updateData returns 一个承诺。

如何在 react-redux-thunk 中使用 reducer 编写动作的集成测试

How to write an integration test of an action with a reducer in react-redux-thunk

reactjs

redux

redux-thunk