mercredi 17 août 2016

React-redux: How to write an integration test

I am using Enzyme to test my react and redux portions. I've read around and have found that its a good practice to write an integration test for the component as well. So, that's simple as I have to call the action creators and check their updated values against store but I have some async actions that return dispatch actions.

login.actions.js

export function loginUser(credentials) {
  return dispatch => {
    dispatch(action.loginRequest());
    return axios({
      method: 'post',
      url: `${api}/login`,
      data: {
        email: _.trim(_.get(credentials, 'email')),
        password: _.get(credentials, 'password')
      }
    })
      .then(response => {
        const { data } = response;

        if (_.isEqual(_.get(response, 'status'), 200)) {
          dispatch(action.loginSuccess(data));
        }
      })
      .catch(err => {
        dispatch(action.loginError(err));
      });
  };
} 

login.actionCreators.js

export function loginRequest() {
  return {
    type: types.LOGIN_REQUEST
  };
}
export function loginSuccess(payload) {
  return {
    type: types.LOGIN_SUCCESS,
    payload
  };
}
export function loginError(payload) {
  let error;
  switch (_.get(payload, 'response.status')) {
    case 422: {
      error = 'Invalid Credentials';
      break;
    }
    case 401: {
      error = 'Invalid user';
      break;
    }
    case 403: {
      error = 'Account not confirmed';
      break;
    }
    default:
      error = 'Something went wrong';
  }
  return {
    type: types.LOGIN_ERROR,
    error
  };
}

So, in order to perform a complete integration test, I would have to test the login.actions.js as well but since dispatch normally returns plain objects, in my case they are returning a dispatch function. How do I test them?

Aucun commentaire:

Enregistrer un commentaire