Reduxフォームユニットテスト

Question

還元型フォームにラップされたコンポーネントに酵素を使ってユニットテストを書こうとしましたが、レンダリングするコンポーネントをテストしようとすると問題が発生しましたformValues HOC with redux-form HOC、テスト方法fromValuesからコンポーネントへのストアまたは小道具をシミュレートします。私はHOCのReduxのフォームに

export const MiConfiguration = ({miConfiguration, change}) => 
{ 
    miConfiguration.isMiEnabled = miConfiguration.miConfigurationType !== MiConfigurationTypes.AccessPointOnly 

    return <FormSection name='miConfiguration'> 
     <Field 
      name='miConfigurationType' 
      component={renderSelectField} 
      label={<FormattedMessage id='passage.label.scenario' />} 
      style={{width: 400, ...styles.selectField}} 
      hintText={<FormattedMessage id='passage.selectConfiguration.hint'/>} 
      autoWidth 
      onChange={(e, newValue) => Object.keys(defaultValues[newValue]).forEach(key => change(key, defaultValues[newValue][key]))} 
     > 
     {miConfiguration && !!miConfiguration.miConfigurationType && 
      <InfoMessage id={`miConfiguration.description.${miConfiguration.miConfigurationType}`} />} 

    </FormSection>} 

ユニットテスト

describe('getMiConfiguration',() => { 
    let component, onChange 

    beforeEach(() => { 
     component = shallow(<MiConfiguration miConfiguration={{}} change={onChange = sinon.spy()}/>) 
    }) 

    it('should render <InfoMessage /> with id',() =>{ 
     component.setProps({miConfiguration: {miConfigurationType: 'type'}) 
component.find(InfoMessage).props().id.should.be.equal('some id') 
     component.find(InfoMessage).should.exist}) 
}) 

Answer 1

;[{id: MiConfigurationTypes.AccessPointOnly}, 
     {id: MiConfigurationTypes.WanderingDetection}, 
     {id: MiConfigurationTypes.MuteWanderingDetection}, 
     {id: MiConfigurationTypes.LockedWanderingControl}, 
     {id: MiConfigurationTypes.OpenWanderingControl}, 
    ].forEach(({id}) => { 
     it(`should render correct <InfoMessage/> with ${id} for each MI configuration scenarios id`,() => { 
      component.setProps({miConfiguration: {miConfigurationType: id}}) 

      component.find(InfoMessage).findWhere(x => x.props().id === `miConfiguration.description.${id}`).should.exist 
     }) 
    }) 

を包んだ、いくつかの親要素を持っていることを確認