如何开发自定义量角器定位器？

Question

我有一个 angular-应用程序，我将自定义 html-属性（“data-testid='saveButton'”）用于识别，例如按钮、输入等 Protractor 对此没有内置定位器：xpath-way 不起作用，因为它总是从文档根目录搜索（为了克服这个限制，我将不得不做很多字符串魔术来构建 xpath-string，所以我放弃了这个变体）。

于是想自己写一个定位器，咨询了官方Protractor Documentation。

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

我在protractor-documentation中搜索了'querySelectorAll'，看它是否可能是ElementFinder或WebElement的方法，但我没有找到。

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

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

Answer 1

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

This function will be serialized as a string and will execute in the browser.

此外，请记住，有一种方法可以为 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"]'));

如何开发自定义量角器定位器？

How to develop a custom protractor locator?

javascript

testing

selenium

angularjs

protractor