如何等待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組件的渲染？

回答

相關問題