javascript - 使用 Protractor 获取表数据并存储它

Question

假设我有一张这样的 table

    <h2>HTML Table</h2>

<table>
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Code</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>THK-ASA-AKK</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>KAL-ASA-AKK</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>MAK-ASA-AAKS</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>Helen Bennett</td>
    <td>ABC-ASA-AKK</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Yoshi Tannamuri</td>
    <td>BSA-ASA-AKK</td>
  </tr>
  <tr>
    <td>Ernst Alimentari Riuniti</td>
    <td>Giovanni Rovelli</td>
    <td>KAL-ASA-AKK</td>
  </tr>
</table>

我需要找到 Ernst- 的代码 header 的内容，其中有两个。我怎样才能使用 Protractor 来实现这一点。

我目前正在尝试使用以下代码段来定位该元素

element.all(by.cssContainingText('td','Ernst')).elment(by.css('td:nth-child(3)')).getText().then(function(code){
console.log(code)});

但是，脚本运行没有任何问题，但未打印文本。这怎么办。

Answer 1

过滤以查找包含文本的 tr

因此我们需要遍历每个表行并使用过滤功能。 filter函数将允许我们返回 ElementArrayFinder对象，它是满足条件的行的集合。我们试图满足的条件是特定表格数据文本包含文本“Ernst”。

因此，从 tr 中，我们需要获取该表行内的 tds 集合。我们将从包含文本“Ernst”的第一列的文本中返回 promise 的 bool 值。如果这是真的，我们会将其添加到 ElementArrayFinder对象。

let ernstTrs = element.all(by.tagName('tr')).filter(tr => {
  tds = tr.all(by.tagName('td'));
  return tds.get(0).getText().then(text => {
    return text.includes('Ernst');
  });
});

从tr中查找码表数据

有了ernstTrs之后，我们就可以获取第一个元素来得到ElementFinder目的。我们将执行相同的搜索来获取 td 的集合。获取索引 2 处的第三列，我们将从中获取文本并将其打印到控制台。

let ernstTr = ernstTrs.get(0); // get an ElementFinder from the ElementArrayFinder

let ernstTds = ernstTr.all(by.tagName('td'));
let ernstTdCode = ernstTds.get(2);

// let's output the ernst code in column 2:
ernstTdCode.getText().then(text => {
  console.log(text);
});

Protractor 快乐!