Question

我有要测试的向导组件。

WizardComponent

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)

})

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

Answer 1

根据enyzme documentation，使用wrapper.props()访问组件包装器的道具。

您使用了wrapper.instance().props。

使用酶完全安装法，找到的成分的实例等于null

1 个答案: