如何开发定制量角器定位器？

Question

我有一个角度应用程序，我在其中放置了自定义 html 属性（“data-testid='saveButton'”）以进行识别，例如按钮、输入等 Protractor 没有内置的定位器：xpath 方式不起作用，因为它总是从文档根目录搜索（为了克服这个限制，我必须做很多字符串魔术来构建 xpath 字符串，所以我放弃了这个变种）。

所以想自己写定位器，咨询了官方Protractor Documentation。

文档给我留下了一个重要的问题： 父元素对象有哪些方法可用？在他们的示例中，他们使用using.querySelectorAll('button');，但他们怎么知道他们可以使用它？

我在量角器文档中搜索了'querySelectorAll'，看看它是否可能是ElementFinder或WebElement的方法，但我没有找到。

我也找不到调试定位器的方法（只能通过browser.pause() 停止量角器测试），所以我无法查看运行时来查看我可以使用给定的父元素做什么。

那么有人知道我如何获得有关父元素具有哪些方法的信息吗？

Answer 1

parent-element，本质上是选择器的上下文，是一个由浏览器处理的 DOM 元素——它可以使用任何 DOM 函数，在本例中为 Element.querySelectorAll。正如 addLocator 的示例所说，您传递给它的函数：

该函数将被序列化为字符串，并在浏览器中执行。

另外，请记住，有一种方法可以为 xpath 选择器提供上下文，从而避免从根目录搜索：

var context = element(by.css('.some-parent-element-class'));
var divDirectDescendants = context.element(by.xpath('div'));
var divAllDescendants = context.element(by.xpath('.//div'));

使用 CSS，这些将是：

var divDirectDescendants = element(by.css('.some-parent-element-class > div'));
var divAllDescendants = element(by.css('.some-parent-element-class  div'));

此外，还有一种方法可以通过CSS selector 实现您想要的（毕竟querySelectorAll 就是这样）：

var everyElementWithMyAttr = element.all(by.css('[data-testid="saveButton"]'));