Тестирование Redux: Действия должны быть простыми объектами. Используйте пользовательское промежуточное ПО для действий asyn c - PullRequest
0 голосов
/ 04 февраля 2020

У меня есть приложение Redux, и оно работает без ошибок. Сейчас я пытаюсь проверить это с Enzyme, Jest и Sinon:

  it('calls constructor', () => {
    sinon.spy(SavedVariantsComponent.prototype, 'constructor')
    const store = configureStore()(STATE1)
    wrapper = mount(<SavedVariantsComponent store={store} match={{ params: {} }} />)
    expect(SavedVariantsComponent.prototype.constructor).toHaveProperty('callCount', 1)
  })

В SavedVariantsComponent У меня есть mapDispatchToProps:

const mapDispatchToProps = (dispatch, ownProps) => {
  return {
    onSubmit: (updates) => {
      dispatch(updateSavedVariantTable(updates))
      const { match, analysisGroup } = ownProps
      const { familyGuid, variantGuid, tagArray, gene } = match.params
      const familyGuids = familyGuid ? [familyGuid] : (analysisGroup || {}).familyGuids
      const combineVariants = /combined_variants/.test(match.url)
      dispatch(loadSavedVariants(combineVariants, familyGuids, variantGuid, tagArray, gene))
    },  
    loadSavedVariants: (...args) => dispatch(loadSavedVariants(...args)),
  }
}

И loadSavedVariants выглядит так:

export const loadSavedVariants = (combineVariants, familyGuids, variantGuid, tagArray, gene = '') => {
  return (dispatch, getState) => {
...
...

и ошибка при запуске jest:

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

Что делает HTTP Request, который может не работать в текущем случае. Как исправить эту ошибку? Мне нужно проверить, что конструктор был вызван, но позже также нужно будет увидеть, как отображаются внутренние Components, поэтому нужно иметь mount там. Я предполагаю, что я делаю что-то не так в тестировании, а не в реальном коде, так как последний работает без каких-либо ошибок, предупреждений или проблем.

1 Ответ

1 голос
/ 04 февраля 2020

Вам, вероятно, нужно настроить свой фиктивный магазин для работы с redux-thunk. См .: https://github.com/dmitry-zaets/redux-mock-store#asynchronous -акции

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

const middlewares = [thunk] // add your middlewares like `redux-thunk`
const mockStore = configureStore(middlewares)
...