如何使用Cypress取消含name1的行对应的复选框勾选

要实现取消包含name1的行对应的复选框勾选，核心思路是先定位到目标行，再找到该行内的复选框并执行取消勾选操作，以下是几种可行的实现方式：

方法一：直接通过行元素匹配文本 #

利用contains方法找到包含name1的行，再在该行内查找复选框并取消勾选：

// 定位包含name1的行，找到其中的复选框并取消勾选
cy.contains('div[role="row"]', 'name1')
  .find('input[data-testid="table-row-checkbox"]')
  .uncheck();

方法二：通过文本单元格回溯到行 #

先找到显示name1的单元格，再向上定位到其父级行元素，最后找到复选框：

cy.contains('div[role="cell"]', 'name1')
  .closest('div[role="row"]') // closest能匹配到最近的祖先行，比parent()更可靠
  .find('input[data-testid="table-row-checkbox"]')
  .uncheck();

验证操作结果（可选） #

如果需要确认复选框确实被取消勾选，可以添加断言：

cy.contains('div[role="row"]', 'name1')
  .find('input[data-testid="table-row-checkbox"]')
  .uncheck()
  .should('not.be.checked');

说明：使用data-testid定位复选框是推荐的做法，因为它不受页面文本或结构变化的影响，稳定性更高。

内容的提问来源于stack exchange，提问作者stackuser