如何根据另一个元素的文本单击一个元素

时间:2019-06-12 20:52:05

标签: automated-tests selector e2e-testing web-testing testcafe

给出多行用户表...

<tr>
  <td class="cell--select">
    <input class="choice__input" type="checkbox">
  </td>
  <td>
    <div class="user">
      <ul class="user-info">
        <li class="name">Jane Doe</li>
      </ul>
    </div>
  </td>
</tr><tr>
...

我要选择具有给定用户名的行,然后单击该行上的复选框。我已经尝试了多种方法来做到这一点,包括withText和/或parent()和/或find()等,但是没有任何效果。

通常,我会抓住所有li.name,检查正确的名称并使用索引来检查正确的复选框,但是我也找不到解决方法。

卡住了...主意吗?

2 个答案:

答案 0 :(得分:6)

有一种简单的方法可以实现所需的行为。您可以使用withText方法来标识表格行:

const checkboxToClick = await Selector('tr')
  .withText('Jane Doe')
  .find(".choice__input");

await t.click(checkboxToClick);

答案 1 :(得分:4)

好的,我找到了办法。这比我想要的要脆弱一些,但是可以。如果有更好的解决方案,请添加答案!

const checkboxToClick = await Selector('.name')
      .withText('Jane Doe')
      .parent("tr")
      .find(".choice__input");

await t.click(checkboxToClick);