Cypress如何精准校验表格行指定td单元格包含目标文本且避免误匹配

原代码报错原因 #

• 多余调用parent()方法：cy.contains('tr', 'abc...')已经直接返回了包含指定文本的目标<tr>行元素，调用parent()后会选中行的父节点（通常是<tbody>），导致后续within的作用范围扩大到整个表格体，而非目标单一行。
• 直接选中所有单元格校验文本：cy.get('td.v-cell')会选中作用范围内所有符合类名的单元格，should('have.text')会把所有选中单元格的文本拼接后做比对，因此你会看到报错信息中是多个单元格文本拼接后的结果。

修正方案 #

方案1：按文本精确匹配（推荐，无需关注列位置） #

开启exact: true配置实现单元格文本完全匹配，仅当目标行存在内容完全等于ZZ的单元格时校验通过，替换为20%时会自动抛出错误：

cy.contains('tr', 'abc...')
  .within(() => {
    // exact: true 开启完全匹配，避免部分文本匹配导致的误判
    cy.contains('td.v-cell', 'ZZ', { exact: true }).should('exist')
  })

方案2：指定列校验（精准度最高，适合固定列的表格） #

如果目标内容的列位置固定，可以直接指定列索引做精准校验，完全避免其他列的内容干扰：

cy.contains('tr', 'abc...')
  .find('td.v-cell')
  .eq(7) // 此处替换为目标列的实际索引，索引从0开始计数
  .should('have.text', 'ZZ')

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