如何在嵌套子项上使用带有redux连接的jest测试React?

时间:2017-12-13 06:47:13

标签: reactjs unit-testing redux jestjs

如果有任何人可以分享,如果有一种单元测试的方式使用嵌套子上的redux连接使用jest做出反应,我更喜欢最简单的实现

import React from 'react'
import sinon from 'sinon'
import { bindActionCreators } from 'redux'
import { shallow } from 'enzyme'
import { CoreLayoutWithRedux } from '../index'
import createStore from '../../../redux/create'

describe('(Layout) Core', () => {
  let _props, _spies, _wrapper

  beforeEach(() => {
    _spies = {}
    _props = {
      store: createStore({}),
      isOnline: false,
      notifications: [],
      ...bindActionCreators({
        notificationDismiss : (_spies.notificationDismiss = sinon.spy()),
        notificationDispatch : (_spies.notificationDispatch = sinon.spy()),
        updateConnectionStatus: (_spies.updateConnectionStatus = sinon.spy())
      }, _spies.dispatch = sinon.spy())
    }
    _wrapper = shallow(<CoreLayoutWithRedux {..._props}><div /></CoreLayoutWithRedux>)
  })

  test('Should render as a <CoreLayout>.', () => {
    expect(_wrapper.is('CoreLayout')).toBe(true)
  })
})

这是我到目前为止所做的,但问题是当我们需要为嵌套孩子存储时

1 个答案:

答案 0 :(得分:1)

您可以尝试这样的事情

let connectedWrapper = mount(<Provider store={store}>
                <SomeContainerOfYours {...yourprops}/>
            </Provider>);

let wrapper = connectedWrapper.find(ComponentYouWantToTest);

现在,您可以与已连接的嵌套组件进行交互。