CODEWITHSUNDEEP
reactjsjestjsenzyme
Jonathan
Jonathan

Reputation: 469

How to test a dispatch function?

Hello I'm trying to test this function with the return of the dispatch in how many times it have been called, but really don't know how to do it correctly in order to call dispatch

export const mapDispatchToProps = (dispatch) => {
    return {
        hideSidebar: () => {
            dispatch(hideSidebar)
        },
        updateUnit: (unitObject) => {
            dispatch(settingsActions.updateArray(unitObject))
        }
    }
}

I have these test

describe('mapDispatchToProps', () => {
    test('test', () => {
        const dispatch = jest.fn(() => Promise.resolve())
        mapDispatchToProps(dispatch)
        expect(dispatch).toHaveBeenCalledTimes(2)
    })
})

Any suggestions?

Upvotes: 1

Views: 2266

Answers (1)

Brian Adams
Brian Adams

Reputation: 45810

Create a dispatch mock function and pass it to mapDispatchToProps.

Then call the functions defined on the result.

You can use something like toHaveBeenCalledWith to verify that the correct action was dispatched:

// Stubs for hideSidebar and settingsActions.updateArray
const hideSidebar = { type: 'hide-side-bar' };
const settingsActions = { updateArray: u => ({ type: 'update-unit', payload: u })};

export const mapDispatchToProps = (dispatch) => {
  return {
    hideSidebar: () => {
      dispatch(hideSidebar)
    },
    updateUnit: (unitObject) => {
      dispatch(settingsActions.updateArray(unitObject))
    }
  }
}

test('mapDispatchToProps', () => {
  const dispatch = jest.fn();
  const map = mapDispatchToProps(dispatch);

  map.hideSidebar();
  expect(dispatch).toHaveBeenCalledWith({ type: 'hide-side-bar' });  // Success!

  map.updateUnit({ theKey: 'theVal' });
  expect(dispatch).toHaveBeenCalledWith({ type: 'update-unit', payload: { theKey: 'theVal' } });  // Success!
})

Upvotes: 1

Related Questions