1

我有一个 redux 操作创建器,它利用 redux-thunk 执行一些逻辑来确定将什么分派到商店。它不是基于承诺的,就像 HTTP 请求那样,所以我在如何正确测试它方面遇到了一些问题。我需要测试值何时满足条件以及何时不满足。由于动作创建者没有返回承诺,我无法在测试中运行 .then() 。测试这样的东西的最佳方法是什么?

同样,我相信测试getRemoveFileMetrics()动作创建者会非常简单,因为它确实返回了一个承诺。但是,如果值为 removeFiles 并且满足条件,我怎么能断言它会被调用呢?试卷上怎么写?

提前感谢,因为这让我在过去的几天里卡住了。

动作创作者

export const handleSelection = (value, cacheKey) => {
    return dispatch => {
        if (value === "removeFiles") {
            dispatch(getRemoveFileMetrics(cacheKey));
        }
        dispatch({ type: HANDLE_SELECTION, value });
    };
};

export const getRemoveFileMetrics = cacheKey => {
    return dispatch => {
        dispatch({ type: IS_FETCHING_DELETE_METRICS });
        return axios
            .get(`../GetRemoveFileMetrics`, { params: { cacheKey } })
            .then(response => {
                dispatch({ type: GET_REMOVE_FILE_METRICS, payload: response.data });
            })
            .catch(err => console.log(err));
    };
};

笑话

it("should dispatch HANDLE_SELECTION when selecting operation", () => {
    const store = mockStore({});
    const value = "switchVersion";
    const expectedAction = [{
        type: MOA.HANDLE_SELECTION,
        value,
    }]; // TypeError: Cannot read property 'then' of undefined
    return store.dispatch(MOA.handleSelection(value)).then(() => {
        const returnedActions = store.getActions();
        expect(returnedActions).toEqual(expectedAction);
    });
});

新编辑

因此,根据 Danny Delott 对返回承诺的回答,我通过了如下测试:

export const handleSelection = (value, cacheKey) => {
    return dispatch => {
        if (value === "removeFiles") {
            return dispatch(getRemoveFileMetrics(cacheKey));
        }
        return new Promise((resolve, reject) => {
            resolve(dispatch({ type: HANDLE_SELECTION, value }));   
        });
    };
};
4

1 回答 1

1

是否有理由明确地不在您的动作创建者中返回承诺?看起来像是getRemoveFileMetrics在兑现承诺,它只是被吞没了handleSelection......

最简单的解决方案是只返回承诺:

export const handleSelection = (value, cacheKey) => {
    return dispatch => {
        if (value === "removeFiles") {
            return dispatch(getRemoveFileMetrics(cacheKey));
        }
        dispatch({ type: HANDLE_SELECTION, value });
        return new Promise();
    };
};

否则,您需要在事件循环完成后做出断言。您可以使用包装在 Promise 中的 setTimeout 来获取.then行为。

it("should dispatch HANDLE_SELECTION when selecting operation", () => {
    const store = mockStore({});
    const value = "switchVersion";
    const expectedAction = [{
        type: MOA.HANDLE_SELECTION,
        value,
    }];

   store.dispatch(MOA.handleSelection(value));

   // flush outstanding async tasks
   return new Promise(resolve => {
     setTimeout(resolve, 0);
   })
   .then(() => {
      const returnedActions = store.getActions();
      expect(returnedActions).toEqual(expectedAction);
    });
});
于 2017-11-30T00:44:02.563 回答