赛普拉斯 - 根据两个单元格的值单击行上的超链接

Question

尝试让 Cypress 脚本单击基于两个值的超链接 - 第 1 列中的超链接文本和第二列中的单元格值：

<tbody>
  <tr>
    <td><a href="/id/343408">Anything</a></td>
    <td>Casualty</td>
  </tr>
  <tr>
    <td><a href="/id/338494">Declined Prospect</a></td>
    <td>Casualty</td>
  </tr>
  <tr>
    <td><a href="/id/343408">Declined Prospect</a></td>
    <td>Package</td>
  </tr>
  <tr>
    <td><a href="/id/338494">Declined Prospect</a></td>
    <td>Casualty</td>
  </tr>
  <tr>
    <td><a href="/id/338432">Irrelevant</a></td>
    <td>Package</td>
  </tr>
</tbody>

cy.get('a').包含('Declined Prospect').click()

失败，因为具有该值的超链接不止一个。该 ID 没有用，因为它是动态的。

在上面的示例中，我想在第二列为 Casualty 时单击 Declined Prospect（但行的顺序可能变化，第一列和第二列中的值重复 - 但组合只重复一次）。

有什么想法吗？

Answer 1

我认为这很有用：https://github.com/cypress-io/cypress-xpath

您可以在 xpath 而不是 css 中创建选择器，并且在 xpath 中您可以按文本搜索树。例如：

cy.xpath("//text() = 'Declined Prospect'")

================================已编辑======== ========== 您可以合并几个 xpatch 选择器：它看起来像这样 //tr[td='Casualty']/td/a

Playgroud

Answer 2

诀窍是定位 <td>Casualty</td>，然后单击前面的 <td><a>。

有很多方法可以获取兄弟元素，在本例中最简单的是 prev()。

cy.contains('td', 'Casualty')  // target the 'marker' element
  .prev()                      // move to the previous sibling
  .click()

从一排接近并向内移动

要在某些单元格中定位具有特定文本组合的行，只需连接文本并使用 contains()。

cy.contains('tr', 'Declined Prospect Casualty')  // target unique text within children

即使有其他单元格的文本与搜索无关，这也适用，例如

<tr>
  <td><a href="/id/338494">Declined Prospect</a></td>
  <td>Casualty</td>
  <td>Irrelevent text here</td>
</tr>

然后你可以沿着HTML树走下去，

cy.contains('tr', 'Declined Prospect Casualty') // target unique text within children
  .find('td a')                                 // descendant of previous subject
  .click()

赛普拉斯 - 根据两个单元格的值单击行上的超链接

Cypress - click hyperlink on row based on value of two cells

e2e-testing

cypress