比如,假如在 chrome devtools elemnts 页面里面看到的是如下内容,
<div class="siva ffdaj my-div" >
<button class="jkda fjda my-button" role="click-button" />
</div>
我用 enzyme 写测试
const wrapper = mount(组件);
expect(wrapper.find("div[class*='my-div']").length).toEqual(1); // false
expect(wrapper.find("button[role='click-button']").length).toEqual(1); // true
这句话 div[class*=my-div] 我在 chrome->dev tools-> elements 页面,Ctrl-F 后,直接输入,是能够正常工作的,找到该 div 的。但是放到 react/enzyme 的测试里,就不行了。
然后,只要不是 div ,换成其它元素,比如,button, li ,ul, span, etc. 用非 class 的 属性方式去查找,也是能够成功的。
但问题是,我们使用的一些组件,是第三方的,生成 的就是 div ,只能通过它特定的 class name 去查找确认是否加载成功。
但这个 enzyme 的 css selector + react 后,和通用的 css selector 好像不一太一样了。有什么翻译原则么?我也试过,把 class->className ,没有啥用... 比如 wrapper.find("div[className*='my-div']") or wrapper.find(".my-div") 都是失败的...
有没有大神知道是怎么回事?
谢谢!
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.