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();

但据我所知，你有很多孩子，而且你不想列出所有的变种。

除了Nathan Thompson的回答，你可以在页面对象中找到辅助函数来查找子元素：

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（）返回的内容

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();

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

3 个答案: