Как протестировать асинхронное действие Redux с помощью redux-axios-middleware - PullRequest
Новая
       23

Как протестировать асинхронное действие Redux с помощью redux-axios-middleware

1 голос
/ 18 июня 2019

В моем хранилище Redux настроено промежуточное программное обеспечение redux-thunk и redux-axios-middleware для извлечения данных с помощью Axios HTTP-клиентов.

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

export const subscribeTrial = trialingDuration => dispatch => {
  const message = `You're now Premium✨ for ${trialingDuration} days!`;

  return dispatch({
    type: SUBSCRIBE_TRIAL,
    payload: {
      request: {
        method: 'post',
        url: '/subscriptions/trial',
      },
    },
  }).then(({ type }) => {
    if (type === SUBSCRIBE_TRIAL_SUCCESS) {
      dispatch(
        showHeadMessage(message, { type: 'info', discardTimeout: 5000 }),
      );
    }
  });
};

Вот мой текущий тест, который не проходит: 

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

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

beforeEach(() => {
  store.clearActions();
});

it('can start trial', () => {
  const expectedAction = {
    type: SUBSCRIBE_TRIAL,
    payload: {
      request: {
        method: 'post',
        url: '/subscriptions/trial',
      },
    },
  };

  store.dispatch(subscribeTrial());

  expect(store.getActions()).toEqual([expectedAction]);
});

Jest продолжает указывать на .then() и выдает следующую ошибку: 

TypeError: dispatch(...).then is not a function

Что я делаю не так? Не могу понять это.

1 Ответ

0 голосов
/ 18 июня 2019

На основании комментария @YuryTarabanko:

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

Я исправил тест, добавив свой клиент axiosи связующее ПО для магазина: 

import configureStore from 'redux-mock-store';
import thunk from 'redux-thunk';
import { multiClientMiddleware } from 'redux-axios-middleware';

import axiosClients from '../../services/http_clients';

const middlewares = [thunk, multiClientMiddleware(axiosClients)];
const mockStore = configureStore(middlewares);

it('can start trial', () => {
  const store = mockStore({
    user: { email: 'user@example.com', authenticationToken: '123456' },
  });

  const expectedAction = {
    type: SUBSCRIBE_TRIAL,
    payload: {
      request: {
        method: 'post',
        url: '/subscriptions/trial',
      },
    },
  };

  store.dispatch(subscribeTrial());
  expect(store.getActions()).toEqual([expectedAction]);
});
...