Модульный тест: Действия должны быть простыми объектами. Использовать пользовательское промежуточное ПО для асинхронных действий

Question

Я знаю, что «Действия должны быть простыми объектами. Используйте пользовательское промежуточное ПО для асинхронных действий» много раз спрашивали, но я не могу найти решение.

Проблема возникает только в ферментном тесте.

Это мой componentDidMount, который регистрирует ответ:

componentDidMount () {
  this.props.dispatch(fetchUsers())
    .then(response => console.log(response))
}

запись ответа: пользователи: (27) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {… }, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}] тип: "GET_USERS_SUCCESS"

А это моё действие

export const fetchUsers = () => (dispatch) => {
  dispatch(fetchUSersRequest())
  const request = axios({
    method: 'GET',
    url: `${BASE_URL}users.json`,
    headers: []
  })
  return request.then(
    response => dispatch(fetchUsersSuccess(response.data)),
    err => dispatch(fetchUsersError(err))
  )
}

Компонент является связанным компонентом. и вот он тест

import React from 'react'
import configureMockStore from 'redux-mock-store'
import { shallow } from 'enzyme'

import Users from './'
import * as mocks from '../../mocks/users'

const mockStore = configureMockStore();

describe('it works', () => {
  const store = mockStore({});
  const wrapper = shallow(<Users store={store} users={mocks.getUsersMock} filters={mocks.getFiltersMock} />).dive().dive()
  console.log(wrapper.debug())
  it("renders a div", () => {
    expect(wrapper.find('div').length).toBe(1)
  })
});

Тогда ошибка в выводе модульного теста

● работает ›обнаружена исключительная ситуация объявления

Actions must be plain objects. Use custom middleware for async actions.

  21 |
  22 |   componentDidMount () {
> 23 |     this.props.dispatch(fetchUsers())
     |                ^
  24 |   }

Я уже использую Redux-Thunk

Answer 1

Попробуйте зарегистрировать redux-thunk промежуточное ПО с помощью redux-mock-store, чтобы тесты знали об асинхронном промежуточном ПО, которое вы используете в своем реальном магазине:

import configureMockStore from 'redux-mock-store'
import thunk from 'redux-thunk'

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

Надеюсь, это поможет!