Невозможно получить доступ к состоянию из-за лишнего действия в шутку - PullRequest
Новая
       8

Невозможно получить доступ к состоянию из-за лишнего действия в шутку

1 голос
/ 10 марта 2020

У меня не может быть state при отправке действия внутри моего юнит-теста

Я пытаюсь сделать так: 

  import configureMockStore from 'redux-mock-store'
import * as React         from 'react'
  import MarginPage         from './index'
  import { Provider }       from 'react-redux'
  import {
  mount,
  }                         from 'enzyme'
import thunk                from 'redux-thunk'

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

const state = {
  margin: {
    list: null,
  },
}
  
  it('Should list props are correctly filling', async () => {
    await store.dispatch({
      type: 'SET_MARGIN_LIST',
      payload: [0, 1, 2],
    })

    const wrapper = mount(
      <Provider store={store}>
        <MarginPage />
      </Provider>,
    )

    wrapper.update()

    const actions = store.getActions() // Here I have my state
    // But now I would like to have the updated state list inside getState()
    
    
    console.log(store.getState().margin.list) // return undefined
  })

1 Ответ

0 голосов
/ 10 марта 2020

Я нашел ответ, надеюсь, он поможет вам, если вы столкнулись с этой проблемой.

Мы можем взять приведенный выше код и просто обновить: 

import * as React         from 'react'
import MarginPage         from './index'
import { Provider }       from 'react-redux'
import {
  mount,
}                         from 'enzyme'
// @ts-ignore
import store              from '@App/helpers/configureStore' // Finally I prefer use store from my app
import { IAppState } from '@App/reducers' // This line come from interface of typeScript

describe('<MarginPage /> Component', () => {
  it('Should list props are correctly filling', async () => {
    // instanciate component and make the test use async/await
    const wrapper = mount(
      <Provider store={store}>
        <MarginPage />
      </Provider>,
    )

 
    await store.dispatch({
      type: 'SET_MARGIN_LIST',
      payload: MOCK_MARGIN_LIST,
    })

    // Don't forget to force the re-render
    wrapper.update()

    // Now we have access to our store
    const state = (store.getState() as IAppState).margin.list as any

    expect(state.results[0].campaigns_revenue).toEqual(47096.52)
  })
})
...