测试Redux动作时分派不是功能

debugcn 发表于 Dev

科恩

我正在学习使用Jest和Enzyme为动作创作者编写测试。这是我与React Native一起使用的动作创建者。

请考虑以下代码：

import {
    FETCH_FAIL
} from './types';

export const fetchFail = (dispatch) => {
    dispatch({
        type: FETCH_FAIL,
        payload: "An error occurred. Try again later."
    });
};

我为此动作创建者编写了以下测试：

import configureStore from 'redux-mock-store';
import thunk from 'redux-thunk';

const middlewares = [thunk];
const mockStore = configureStore(middlewares);

test('should fail fetch', async () => {
    const payload = {
        type: FETCH_FAIL,
        payload: "An error occurred. Try again later."
    }

    const store = mockStore({ data:[], isConnected: false });
    expect(store.dispatch(actions.fetchFail())).toEqual(payload);
})

我的测试失败，并显示以下结果：

TypeError：调度不是函数

我究竟做错了什么？

阿萨夫·阿维夫（Asaf Aviv）

首先，您需要从您的操作返回已分派的操作 thunk

export const fetchFail = (dispatch) => {
    return dispatch({
        type: FETCH_FAIL,
        payload: "An error occurred. Try again later."
    });
};

然后不要调用thunk而是传递引用（去掉括号），因为当操作是一个函数时，thunk中间件正在调用您的操作dispatch作为第一个参数传递

test('should fail fetch', async () => {
    const payload = {
        type: FETCH_FAIL,
        payload: "An error occurred. Try again later."
    }

    const store = mockStore({ data:[], isConnected: false });
    // removed the parentheses around fetchFail()
    expect(store.dispatch(actions.fetchFail)).toEqual(payload);
})

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。