react jest unit test case TypeError: Cannot read property 'then' of undefined

Question

I have write the testcases using react, redux-mock-store and redux, but I keep getting and error. I have checked this same error on stackoverflow but i am unable to understand in my case.

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

here is my index.js file:

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,
          });
        }
      })
  }
}

here is my index.test.js file

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();
  });
});

on the above link in answered he said that error is coming because of store.dispatch() method returning undefined.bt in my case my other actions test cases are running fine which is the same what i have wrote above dont know why getting this error.

console error while running npm test:

● 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 |       });

if any one know please guide me what I am doing wrong here.any help will be appreciated

Answer 1

just write return before the post calling in your index.js file. e.g:

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

this worked for me.