我有一个我正在使用Enzyme进行测试的组件,如下所示:
<RichTextEditor name="name" onChange={[Function]} value="<p>what</p>" focus={false}>
<div className="rich-text-editor">
<div className="btn-group" role="group">
<StyleButton active={false} icon="fa-list-ul" label="UL" onToggle={[Function]} style="unordered-list-item">
// ...
我试图检测StyleButton组件的存在,如下所示:
mount(<RichTextEditor />).find('StyleButton[label="UL"]')
但是没有返回任何组件。我可以通过搜索字符串“StyleButton”来找到所有StyleButton,但是我找不到属性,包括仅通过使用属性选择器。
我粘贴的第一个代码块来自安装RichTextEditor的调试输出,所以StyleButton绝对存在。
有任何想法吗?
谢谢。
在文档中,没有选项可以将组件名称与props混合:
你可以使用findWhere:
wrapper.findWhere(n => n.name() === 'StyleButton' && n.prop('label') === 'UL')
由于find
返回另一个ReactWrapper
,你可以这样链接:
mount(<RichTextEditor />).find({label:"UL"}).find(StyleButton)
注意:订单很重要。
灵感来自@ romanlv的评论,但我发现这种语法更清晰。