Тестирование асинхронного метода редукса с moxios

Question

Я новичок в редуксе и выдергиваю свои волосы, пытаясь получить базовый тест для работы с редуксом и моксиосом.

API - это просто axios, с некоторыми настроенными заголовками.

Я получаю сообщение об ошибке в методе публикации: Ошибка типа: Не удается прочитать свойство 'then' с неопределенным значением

Мой метод:

const login = ({username, password}) => (dispatch) => {
  dispatch(actions.loginRequested());
  return API.post(`curavi/v2/authentication`, {username, password})
    .then(response => dispatch(actions.loginSuccess(response.data.payload)))
    .catch((error) => errorHandler(dispatch, error.response));
};

Мой тестовый пример:

describe('login', () => {

  beforeEach(function () {
    // import and pass your custom axios instance to this method
    moxios.install(API)
  });

  afterEach(function () {
    // import and pass your custom axios instance to this method
    moxios.uninstall(API)
  });

  test('calls loginSuccess when the response is successful', () => {
    const store = mockStore();

    const mockData = {
      data: { payload: 'yay' }
    };

    moxios.wait(() => {
      const request = API.requests.mostRecent();
      request.respondWith({
        status: 200,
        response: mockData
      });
    });

    const expectededActions = [
      {type: types.LOGIN_REQUESTED},
      {type: types.LOGIN_SUCCESS, payload: 'yay'}
    ];

    actions.loginRequested.mockReturnValue({type: types.LOGIN_REQUESTED});
    actions.loginSuccess.mockReturnValue({type: types.LOGIN_SUCCESS, payload: 'yay'});
    actions.loginFail.mockReturnValue({type: types.LOGIN_FAIL, message: 'boo'});

    return store.dispatch(operations.login({username: 'theuser', password: 'thepassword'}))
      .then(() => {
        expect(store.getActions()).toEqual(expectededActions);

        expect(API.post).toHaveBeenCalledWith('curavi/v2/authentication',
          {username: 'theuser', password: 'thepassword'});
      });
  })
});

Answer 1

Вы уверены, что получите TypeError в login, как вы предлагаете?Это не имеет смысла;вы получите эту ошибку, если API не будет экземпляром axios, и в этом случае API.post() может вернуть неопределенное значение.С другой стороны, ваш тест не будет работать по 2 причинам:

• Вам необходимо заменить API.requests.mostRecent() на moxios.requests.mostRecent().

• Функция, которую вы имеете внутри await moxios, не будет выполняться в течение 0,5 секунды, см. здесь .Если бы оператор возврата в вашем тесте должен был быть достигнут до этого, ваш тест просто вернул бы обещание.Вместо этого вы можете сделать следующее:

  test('...', async () => {
  
      // ...
  
      const result = await store.dispatch(
          operations.login({
              username: 'theuser',
              password: 'thepassword',
          })
      );
  
      expect(store.getActions()).toEqual(expectededActions);
      expect(API.post).toHaveBeenCalledWith(/* ... */);
  });
  

Вы также должны убедиться, что магазин правильно настроен:

import configureStore from 'redux-mock-store';
import thunk from 'redux-thunk';

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

// use your store inside your tests
const store = mockStore();