赛普拉斯：单击带有特定文本的 td 旁边的 TD 中的复选框

Question

这可能吗？

我的table是这样的：

[ ]           Address string 1
[ ]           Address string 2
...

标记：

<td>
  <div>
    <input class="hb-checkbox type="checkbox" id="byggSkjemaliste-element0-0-adresse-skjema-element-0">
    <div class="hb-label" data-e2e-selector="byggSkjemaliste-element0-0-adresse-skjema-element-0hb-checkbox-label">
      <label for="byggSkjemaliste-element0-0-adresse-skjema-element-0" id="byggSkjemaliste-element0-0-adresse-skjema-element-0-label"></label>
    </div>
  </div>
</td>
<td>
  Address string"
</td>

我希望能够在 table 中找到“地址字符串 1”，然后单击

左侧的复选框

由于我无法控制创建的复杂动态 selector，因此当 table 变大并且有多个 [=23] 时尝试使用它们非常复杂=]s 在页面上。另外，我想要一种更优雅的方式来 select 特定行中的复选框。

Answer 1

如果您想遵循 DOM 布局，请使用 .prev() 之类的导航命令，文档中说

Get the immediately preceding sibling of each element in a set of the elements.

cy.contains('td', 'Address string 1')  // the cell containg the text you're looking for
  .prev('td')                          // previous sibling cell (td)
  .find('input')                       // pick the input within that cell
  .check();

以上是基于DOM结构的初探，但我更喜欢下面的Cypress命令（为了简单起见，可能更健壮）

cy.contains('tr', 'Address string 1')   // the row containing the address
                                        // looks in all children of tr,
                                        // so finds the label 4 levels down
  .find('input')                        // pick the input within that row
  .check();

赛普拉斯：单击带有特定文本的 td 旁边的 TD 中的复选框

Cypress: Click a checkbox in a TD next to a td with specific text

checkbox

html-table

cypress