javascript - 我如何使用 browser.findElements() 来计算和遍历元素？

Question

我正在测试包含以下元素的网页:

<span class="step-count ng-binding">1</span>
<span class="step-count ng-binding">2</span>
<span class="step-count ng-binding">3</span>
<span class="step-count ng-binding">4</span>

首先我想对它们进行计数，所以我尝试了以下代码:

it('make sure all elements exist at page', function() {
    var x = browser.findElements(by.css('.step-count.ng-binding'));
    expect(x.length).toEqual(4);
});

和

it('make sure all elements exist at page', function() {
    var x = browser.findElements(by.css('.step-count.ng-binding'));
    expect(x.size).toEqual(4);
});

两者都产生了失败信息:

Failures: Expected undefined to equal 4.

我如何在我的 ProtractorJS 元素中正确地计算它们以及我如何在之后迭代它们以便比较文本或以后可能添加的任何其他属性？

Answer 1

您使问题过于复杂。使用 $$() 和 .count() 和 .getText() :

var elements = $$('.step-count');

expect(elements.count()).toEqual(4);
expect(elements.getText()).toEqual(["1", "2", "3", "4"]);

---

请注意我们如何不需要解析为元素数组 - count() 和 getText() 方法都可用于 ElementArrayFinder(结果element.all() 或 $$()) 和 Jasmine/Protractor 中的 expect() 知道什么是 promise 并且会解析它在做出期望之前。

---

另请注意，在您的定位器中使用 ng-binding 类不是一个好主意——它是一个纯技术性的 Angular 类，不提供任何有值(value)的、独特的、面向数据的和有意义的信息。如果你想强制不在定位器中使用 Angular 类或其他技术属性，你可以使用 ESLint 静态代码分析工具和 eslint-plugin-protractor 插件，它有 no-angular-classes和no-angular-attributes相关规则。