javascript - 找出 Protractor 元素 CSS 链

标签 javascript angularjs css-selectors protractor

出于开发和调试目的,如果知道我在以下方法中询问的完整 CSS 链是什么,那将是非常好的:

divElm.element(by.css("article")).element(by.css("tbody > tr")).then(function(elm) {
  // is there a way to know here what is the "CSS chain" of 'elm'?
});

如果我调试 elm,我会看到一个 locator 属性:

locator_: { using: 'css selector', value: 'tbody > tr' },

但这只是链中最后一个元素的定位符。

拥有所有东西真的很有用,比如:divElm, article, tbody > tr 这样我就可以在页面上手动调试它,看看元素是否真的存在或不。

更新:我真正需要的是,当 Protractor 选择器期望失败(例如使用 isPresent() 方法)时,我得到的错误仅显示 链中的最后一个 选择器。如果显示整个链,那将非常方便。

最佳答案

如果您想直接从浏览器测试 CSS 链,最简单的方法就是按照那篇优秀文章中的建议进行操作: http://yizeng.me/2014/03/23/evaluate-and-validate-xpath-css-selectors-in-chrome-developer-tools/

这样你就不必再调试它了,你从一开始就知道你的选择器匹配了什么(以及不匹配什么)

关于javascript - 找出 Protractor 元素 CSS 链,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32876217/

相关文章:

javascript - javascript 更改类名时出现逻辑错误

angularjs - 如何使用 Angular/Karma/Jasmine 正确测试放置(或发布)请求?

javascript - 更改 Angular Material 输入样式

javascript - 如何在 Angular 中获取更详细的错误信息?

html - 如何使用:last-child selector?

html - nth-of-type css 选择器以类的第一个元素为目标

css - 使用第 nth-child 作为 CSS 变量

javascript - VueJS2:如何检查数组是否包含特定元素?

JavaScript 语法错误还是更多?

javascript - Vue : display response from form submit on another page