ReduxForm отображается дважды при подключении через фермент - PullRequest
Новая
       30

ReduxForm отображается дважды при подключении через фермент

0 голосов
/ 30 декабря 2018

Я пытаюсь выровнять свои тесты, чтобы они следовали критическим изменениям после обновления response-redux до 6.0.0 и redux-form до 8.1.0 (подключенные компоненты больше не сохраняются в подпорках)

Мне нужно было обернуть мой подключенный компонент из response-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'), он начал работать.
Зачем мне это делатьтакая магия?

1 Ответ

0 голосов
/ 31 декабря 2018

Исправление для библиотечных модов для создания, но если формы идентичны, один быстрый способ обойти проблему - вызвать first () после find, чтобы 

wrapper.find('ReduxForm')

выглядело так: 

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