javascript - 使用酶完整安装找到的组件的实例等于 null

Question

我有我想测试的向导组件。

向导组件

class WizardComponent extends React.Component {
  render(){
    return (
      <div>
        {this.props.steps.map(({Component, ...props}) => <Component {...props} />)}
      </div>
    )
  }
}

测试

it('Provides props to the component', () => {
 const FakeComponent = props => <div>1</div>

    const fakeProps = {
        test:1,
        prop4:'test'
    }

    const wrapper = mount(<WizardComponent currentStepName="fakeComponent" steps={[
        {Component:FakeComponent, name:'fakeComponent'},
    ]}/>)

    const component = wrapper.find(FakeComponent);
    console.log(wrapper.contains(<FakeComponent />)) // logs true
    console.log(component) // logs ReactWrapper { length: 1 }
    console.log(component.instance()) // logs null

    expect(component.instance().props).objectContaining(fakeProps)

})

为什么我无法访问组件实例？我想测试它的子组件道具。有人可以帮忙吗？

标签： javascriptreactjstestingenzyme

Answer 1

根据enyzme 文档，组件包装器的道具可以使用wrapper.props().

你用过wrapper.instance().props。