Тестирование Jest Enzyme, передача реквизита в качестве функции obj и ожидаемый результат теста

Question

У меня есть компонент входа в систему и

MobileNumber в качестве подкомпонента,

Я передаю реквизиты для MobileComponent из LoginComponent

login.js

setHeaderInfo = () => {
    this.setState({
      showHeader: true,
      headerContent: {
        headerContent: {
         showBckBtn: true,
         headerTitle: 'Next'
        },
        headerTitle
      }
    })
  }
return(
<MobileComponent setHeaderInfo={this.setHeaderInfo}>
) 

Теперь для тестирования js:

  let wrapper = shallow(<Login  />)

  const MobileNumberComponent = wrapper.find('MobileNumberComponent')

  it('header Title text checking', () => {
    MobileNumberComponent.props().setHeaderInfo( () => ({setHeaderInfo: {
      showHeader: true,
      headerContent: {
        showBckBtn: true,
        headerTitle: 'Next'
        }
    }}))
  })

Здесь console.log для

    console.log(MobileNumberComponent.debug())
<MobileNumberComponent setHeaderInfo={[Function]} />

Я передал здесь функцию ... Но как я мог ожидать этот вывод ...установлен ли мой тестовый заголовок или нет как «Далее» ..?

Answer 1

После долгой охоты я нашел какое-то решение, чтобы войти в него ..

Здесь я использую подключенный компонент для рендеринга элемента в качестве пропуска, проходящего в него.

Вот код:

import { mountWrap } from '../contextWrap'
import { Provider } from 'react-redux'
import sinon from 'sinon'
import Login from '../components/Login/'
// import makeStore from '../redux/createStore'

import React from 'react'
import configureMockStore from 'redux-mock-store'
import thunk from 'redux-thunk'

const mockStore = configureMockStore([ thunk ])
const authDetails = {
  'authDetails' : {
    Terms :''
  }
}

const match = {
  params : {}
}
let actionSpy = sinon.spy()
let actionHistorySpy = sinon.stub({})
let authDetails_ = sinon.stub(authDetails)
let store
let component
/* eslint-disable */
describe('tests for MyContainerComponent', () => {
  beforeEach(() => {
    store = mockStore(authDetails)
    component = mountWrap(<Provider store={ store }>
      <Login history={actionHistorySpy} match={match} setGlobalLoaderStatus= {actionSpy} userDetail={authDetails_} />
     </Provider>)
  })

  it('renders container', () => {
    console.log(component.debug())
  })
})

Да, все, что нам нужно, чтобы передать ложные данные и сохранить элемент, как в поставщике маршрутов.