尝试使用 Protractor 过滤 ng-repeat 生成的 table

Question

我有以下表示 table 的结构，我正在尝试根据 <a href> 文本和 <p> 文本进行过滤：

<tr ng-repeat="a in apples" class="ng-scope">
  <td>
    <p>
      <a href="javascript::" ng-click="openModal()" class="ng-binding">Some text</a>
    </p>
  </td>
  <td>...</td>
  <td>
    <p class="ng-binding">Some other text</p>
  </td>
  <td>...</td>
</tr>

到目前为止，我已经尝试使用 element.all(by.repeater('a in apples')，但从那里我不知道我是否应该使用 .filter 或应该链接 element(by.css()) 直到我开始<a href> 和 <p>。如果文本匹配某个值，我想 return true 并用 expect().

评估它

我也尝试查看文档，但大多数示例仅显示如下内容：

element.all(by.css('.items li')).filter(function(elem, index) {
  return elem.getText().then(function(text) {
    return text === 'Third';
  });

Answer 1

您可以通过element.all()找到所有行，然后在每个tr中获取所需的<a>和<p>的文本，如果这两个文本都是所需的值， return 正确。

推荐使用await/async使代码简单

# Use promise.then(), have to loop all rows, even matched row is not the last row

element.all(by.repeater('a in apples'))
    filter(function(tr){
        let linkText = tr.element(by.css('td:nth-child(1) a')).getText()
        let pText = tr.element(by.css('td:nth-child(3) p')).getText()

        return Promise.all([linkText, pText]).then(function(texts){
            return texts[0] === <link text> && texts[1] === <p text>
        });
    })

# Use await/async, end loop once find match row, not loop all rows

match = false
rows = element.all(by.repeater('a in apples'))
rowCount = await rows.count()

for(let i=0;i<rowCount;i++) {
  let linkText = await rows.get(i).element(by.css('td:nth-child(1) a')).getText()
  let pText = await rows.get(i).element(by.css('td:nth-child(3) p')).getText()
   
  if(linkText === <link text> && pText === <p text>) {
    match = true
    return
  }
}

量角器guide使用await/async

尝试使用 Protractor 过滤 ng-repeat 生成的 table

Trying to filter an ng-repeat generated table using Protractor

javascript

automated-tests

angularjs

protractor