如何等待Mocha使用酶完成React组件的渲染？

我有一个Parent组件，它呈现一个Child组件。 Child组件首先渲染独特的道具（如“名称”），然后父组件渲染通用道具（如“类型”），并使用React.Children.map将这些道具注入Child组件。如何等待Mocha使用酶完成React组件的渲染？

我的问题是酶不能检测Section组件提供的常见道具，所以我无法有效测试是否添加了常用道具。

测试：

 const wrapper = shallow(
 
     <Parent title="Test Parent"> 
 
      <div> 
 
      <Child 
 
       name="FirstChild" 
 
      /> 
 
      </div> 
 
     </Parent> 
 
    ) 
 
//  console.log(wrapper.find(Child).node.props) <- returns only "name" in the object 
 
     expect(wrapper.find(Child)).to.have.prop("commonPropOne") 
 
     expect(wrapper.find(Child)).to.have.prop("commonPropTwo") 
 
     expect(wrapper.find(Child)).to.have.prop("commonPropThree")

注入普通道具代码：

const Parent = (props) => (
 
    <div 
 
    className="group" 
 
    title={props.title} 
 
    > 
 
    { React.Children.map(props.children, child => applyCommonProps(props, child)) } 
 
    </div> 
 
)

来源

2016-05-20 cmwall

你将不得不使用酶的mount。

mount为您提供完整的DOM渲染，当您需要等待组件渲染子组件时，而不是像shallow那样渲染单个节点。

来源

2016-05-21 00:51:50

您可以使用计时器来设置一个事件，该事件将引发一个将在其他事件之后发生的事件。您必须使用此方法手动调用完成。

describe('<MyComponent />',() => { 
    it('My test.', (done) => { 
    const wrapper = mount(<MyComponent />); 

    setTimeout(() => { 
     expect(wrapper).toMatchSnapshot(); 
     done(); 
    }, 1); 
    }); 
});

React: Wait for full render in snapshot testing

来源

2017-05-05 17:14:09 ram4nd

如何等待Mocha使用酶完成React组件的渲染？

回答

相关问题