css-selectors - 获取 Protractor 中的第一个元素

Question

我想验证 Protractor 中的表格行数，在这种类型的表格出现不止一次的页面上。我一直在尝试使用 first-of-type选择器，但它似乎同时捕获了两个表，因为它们没有并排出现。

例如，给定这个 HTML:

<div>
  <table class="foo">
    <tr>
      <th>First row</th>
      <th>Second row</th>
      <th>Third row</th>
      <th>Fourth row</th>
    </tr>
  </table>
</div>
<div>
  <table class="foo">
    <tr>
      <th>First row</th>
      <th>Second row</th>
      <th>Third row</th>
      <th>Fourth row</th>
    </tr>
  </table>
</div>

这个 Protractor 代码:

element.all(by.css('table:first-of-type tr:first-of-type th')).then(function (elements) {
  expect(elements.length).toBe(4);
});

Protractor 失败的原因是有 8 个元素而不是 4 个元素。似乎 table:first-of-type选择器同时捕获这两个元素，因为它们都是其父元素的第一个子元素 div成分。我的项目的结构是这样的:最好不要在每个包装中添加单独的类 div .

有没有办法获取在 Protractor 中找到的第一个元素，然后搜索它的子元素？

Answer 1

我没用过:first-of-type作为 Protractor 中的 css 选择器；但是，您可以获得 first table与所有 th 's 然后检查是否 count是 4。

expect(element.all(by.css('table')).first().all(by.css('th')).count()).toBe(4);