Question

我已经使用react，redux-mock-store和redux编写了测试用例，但是我不断出错。我已经在stackoverflow上检查了同样的错误，但是我无法理解。

Cannot read property '.then' of undefined when testing async action creators with redux and react

这是我的index.js文件：

import { post } from '../../../service/index';
import { CREATE_JD_SUCCESS, CREATE_JD_FAILED, CREATE_JD_URL, REQUEST_INITIATED, REQUEST_SUCCESSED } from '../../../constants/AppConstants'

export function createJob(jd) {
  return (dispatch) => {
    dispatch({
      type: REQUEST_INITIATED
    });
    post(CREATE_JD_URL, jd)
      .then((response) => {
        if (response.status === 200) {
          dispatch({
            type: REQUEST_SUCCESSED,
          });
          dispatch({
            type: CREATE_JD_SUCCESS,
            data: response.payload,
          })
        }
        else {
          dispatch({
            type: REQUEST_SUCCESSED
          });
          dispatch({
            type: CREATE_JD_FAILED,
            data: response.status,
          });
        }
      })
  }
}

这是我的index.test.js文件

import * as actions from '../index';
import configureMockStore from 'redux-mock-store';
import moxios from 'moxios';
import thunk from 'redux-thunk';
import apiGatewayEndpoint from '../../../../config/index';
import { CREATE_JD_SUCCESS, CREATE_JD_URL } from '../../../../constants/AppConstants';

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

const newJd = {
  "companyId": "12345",
  "jobDescription": 'Hello there'
};

const responseData = "job created!";

describe('actions for creating new job', () => {

  beforeEach(function () {
    moxios.install();
  });

  afterEach(function () {
    moxios.uninstall();
  });

  it('action for create job', async (done) => {
    let url = CREATE_JD_URL;
    moxios.stubRequest(apiGatewayEndpoint.apiGatewayEndpoint + url, {
      status: 200,
      response: responseData
    });
    const expectedActions = [{ "type": "REQUEST_INITIATED" }, { "type": "REQUEST_SUCCESSED" }, { data: responseData, type: "CREATE_JD_SUCCESS" }];
    const store = mockStore({});
    await store.dispatch(actions.createJob(newJd))
      .then(() => {
        expect(store.getActions()).toEqual(expectedActions);
      });
    done();
  });
});

在上面的链接中回答说，错误是由于store.dispatch（）方法返回undefined.bt而导致的，在我的情况下，我的其他动作测试用例运行正常，这与我在上面编写的内容相同，不知道为什么收到此错误。

运行npm测试时出现控制台错误：

● actions for creating new jd › action for create jd

    TypeError: Cannot read property 'then' of undefined

      38 |     const expectedActions = [{ "type": "REQUEST_INITIATED" }, { "type": "REQUEST_SUCCESSED" }, { data: responseData, type: "CREATE_JD_SUCCESS" }];
      39 |     const store = mockStore({});
    > 40 |     await store.dispatch(actions.createJob(newJd))
         |           ^
      41 |       .then(() => {
      42 |         expect(store.getActions()).toEqual(expectedActions);
      43 |       });

如果有人知道，请指导我在这里做错了。任何帮助将不胜感激

Answer 1

只需在index.js文件中的post调用之前写return即可。例如：

return post(CREATE_JD_URL, jd)
      .then((response) => {
   ...

这对我有用。

反应开玩笑的单元测试用例TypeError：无法读取未定义的属性'then'

1 个答案: