Question

在将react-redux升级到6.0.0并将redux-form升级到8.1.0（连接的组件不再存储在props中）之后，我试图调整测试以适应重大变化。

我需要在测试中将我的连接组件从react-redux中包装起来，并使用mount来获取实际组件，但是现在ReduxForm呈现了两次。我尝试使用hostNodes（）方法，但它返回0个元素。有任何解决方法的想法吗？

这是测试：

import React from 'react'
import { mount } from 'enzyme'
import configureStore from 'redux-mock-store'
import { Provider } from 'react-redux'
import PasswordResetContainer from './PasswordResetContainer'

describe('PasswordResetContainer', () => {
  it('should render only one ReduxForm', () => {
    const mockStore = configureStore()
    const initialState = {}
    const store = mockStore(initialState)
    const wrapper = mount(<Provider store={store}><PasswordResetContainer /></Provider>)

    const form = wrapper.find('ReduxForm')
    console.log(form.debug())
    expect(form.length).toEqual(1)
  })

PasswordResetContainer如下所示：

import { connect } from 'react-redux'
import { reduxForm } from 'redux-form'
import PasswordReset from './PasswordReset'
import { resetPassword } from '../Actions'

export const validate = (values) => {
  const errors = {}

  if (!values.email) {
    errors.email = 'E-mail cannot be empty.'
  } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) {
    errors.email = 'Invalid e-mail.'
  }
  return errors
}

export default connect(null, { resetPassword })(
  reduxForm(
    { form: 'passwordReset',
      validate
    })(PasswordReset))

测试结果如下：

PasswordResetContainer › should render only one ReduxForm

    expect(received).toEqual(expected)

    Expected value to equal:
      1
    Received:
      2

编辑（找到部分解决方案）：

当我更改wrapper.find('ReduxForm')时进入wrapper.find('ReduxForm>Hoc>ReduxForm')，开始工作。
为什么我需要做这样的魔术？

Answer 1

已修复要创建的库mod，但如果形式相同，则解决此问题的一种快速方法是在find之后调用first（）

wrapper.find('ReduxForm')

看起来像：

wrapper.find('ReduxForm').first()

通过酶安装时，ReduxForm呈现两次

1 个答案: