说我有以下组件:
const MyComponent = () => (
<div>
<Foo>
<Bar>
<Lee>
Hello!
</Lee>
</Bar>
</Foo>
</div>
)
我想对其进行浅化渲染,并且希望对其进行黑盒测试,因此我对子组件(Foo
,Bar
,Lee
)一无所知,最后,我只想确保它包含文本“ Hello!”。
shallow(<MyComponent />).text()
只返回<Foo />
。
shallow(<MyComponent />).html()
好像它实际上是在研究每个子组件的实现,也许无法达到使它变浅(当然不是黑盒测试)的目的?
shallow(<MyComponent />).debug()
老实说,它能给我我所期望的并能够断言,但这显然不是目的(而且我想并没有针对性能进行优化)。
在文档中显示类似
shallow(<MyComponent />).find("Lee").text()
但这使我的测试与MyComponent
的实现相结合,这显然是不可取的(至少使其成为白盒测试)。
使用浅浅的方法断言某个组件具有您想要的用于黑盒测试的内容的最佳方法是什么?