使用变量量角器链接元素？

Question

我正在努力使 Protractor 中的 pageObjects 尽可能干净，但是运行反对选择子元素时的某些行为。

这个有效：

var parent = element(by.css('.parent-class'));

parent.element(by.css('.child-class')).getText();

然而这不是：

var parent = element(by.css('.parent-class'));
var child = element(by.css('.child-class'));

parent.child.getText();

有没有办法像第二个例子那样做？我不想让元素定位器遍及我的 pageObjects 上的所有方法，但似乎这是定位子元素的唯一方法？

在实际应用中，我有一长串卡片，我从中筛选出我正在寻找的卡片。然后我想用卡片的子元素做一些事情。

Answer 1

您可以使用 locator() 函数获取子元素的定位符并使用它来查找父元素的子元素。这类似于您在评论中提供的解决方案，但允许您将页面对象上的所有属性定义为 Web 元素，而不是元素和定位器的混合：

var parent = element(by.css('.parent-class'));
var child = element(by.css('.child-class'));

parent.element(child.locator()).getText();

Answer 2

我有很多下面的代码：

var parent = element(by.css('.parent-class'));
var child = parent.element(by.css('.child-class'));

child.getText();

但据我了解，您有很多 children 并且您不想列出所有变体。

除 Nathan Thompson 的回答外，您还可以在 object 页中使用辅助函数来查找子元素：

function getCard(parent, child) { // Or getChild()
  return element(by.css(parent)).element(by.css(child));
}

function getCardText(parent, child) { // Or getChildText
  return getCard(parent, child).getText();
}

那么你可以在规范中写：

expect(cardPage.getCardText('.parent-class', '.child-class')).toBe('...');

Answer 3

我想提一下，使用 5.2.2 版本这个实现有点不同。要获得实际的选择器值，您必须使用以下代码

let selector = child.locator().value

这是因为locator returns 一个包含selector 和其他属性的对象，但在这种情况下，您只需要selector。这是方法 locator()

返回的内容

name(name) {
  return By.css('*[name="' + escapeCss(name) + '"]');
}
{ using: 'css selector', value: '.child-class' }

现在应该如何实施。

var parent = element(by.css('.parent-class'));
var child = element(by.css('.child-class'));
parent.element(child.locator().value).getText();

//short hand
var parent = $('.parent-class');
var child = $('.child-class')

parent.$(child.locator().value).getText();

使用变量量角器链接元素？

Protractor Chained Elements by Using Variables?

protractor