erichardson30 erichardson30 - 1 year ago 263
Javascript Question

React Redux async action testing

I have my test written to test async actions. I'm currently getting the following error

TypeError: Cannot read poperty 'then' of undefined
and it is pointing to the following line in my code

return store.dispatch(actions.fetchMovies()).then(() => {

Here is my code :

async actions test :

import { createStore, applyMiddleware } from 'redux';
import initialState from '../reducers/initialState';
import rootReducer from '../reducers/index';
import thunk from 'redux-thunk';
import * as actions from './actions';
import * as ActionTypes from '../constants/constants';
import nock from 'nock';
import { expect } from 'chai';
import API_KEY from '../config/config';

const MOVIES_API = ''+API_KEY;

describe('async actions', () => {
afterEach(() => {

it('creates FETCH_MOVIES_SUCCESS when fetching movies is complete', () => {
.reply(200, {data: {results: [{title: 'Batman vs Superman'}]}});

const expectedActions = [
{ type: ActionTypes.FETCH_MOVIES },
{ type: ActionTypes.FETCH_MOVIES_SUCCESS, data: {results: [{title: 'Batman vs Superman'}]}}

const store = createStore(rootReducer, initialState, applyMiddleware(thunk));

return store.dispatch(actions.fetchMovies()).then(() => {


import axios from 'axios';

import * as constants from '../constants/constants';
import API_KEY from '../config/config';

export const fetchMovies = () => {
const MOVIES_API = ''+ API_KEY;

return dispatch => {
type: constants.FETCH_MOVIES
axios.get(MOVIES_API).then(function(response) {
type: constants.FETCH_MOVIES_SUCCESS,
.catch(function(res) {
type: constants.FETCH_MOVIES_ERROR,
msg: res.message

This is the first time testing async actions so I'm not sure what's going wrong.

Answer Source

Try using redux-mock-store instead of redux createStore(). This is a mock store for testing async action creators and middleware. The Github page also includes some examples how to use it.


What happens when you modify your action creator so that it returns the result of axios.get(MOVIES_API)?