如何在Cypress测试中区分表格重复条目并匹配对应值

安全阿岳

2026-7-5

解决方案：通过分类锚点定位表格中重复标题的对应值

核心思路

利用表格中固定的fix headline作为分类锚点，先定位到目标分类的起始行，再获取该分类下的所有行（直到下一个fix headline为止），最后在这个范围内查找目标title并读取对应的值。这种方法适配动态行数的表格，能精准区分不同分类下的重复标题。

具体实现代码

直接编写测试逻辑

针对你的需求，验证fix headline 1下的title 1对应value 1，以及fix headline 2下的title 3对应value 3，可以这样写：

// 验证fix headline 1分类下的title 1对应值
cy.contains('tr', 'fix headline 1')
  .nextUntil('tr:contains("fix headline")') // 获取当前分类到下一个分类之间的所有行
  .contains('td', 'title 1') // 在分类范围内找到目标title
  .siblings('td:nth-child(3)') // 获取对应的第三列（value列）
  .should('have.text', 'value 1'); // 断言值正确

// 验证fix headline 2分类下的title 3对应值
cy.contains('tr', 'fix headline 2')
  .nextUntil('tr:contains("fix headline")')
  .contains('td', 'title 3')
  .siblings('td:nth-child(3)')
  .should('have.text', 'value 3');

封装为自定义命令（复用性更强）

如果需要多次使用该逻辑，可以封装成Cypress自定义命令：

// 在cypress/support/commands.js中添加
Cypress.Commands.add('getTableValueByCategory', (categoryName, targetTitle) => {
  return cy.contains('tr', categoryName)
    .nextUntil('tr:contains("fix headline")')
    .contains('td', targetTitle)
    .siblings('td:nth-child(3)')
    .invoke('text')
    .then(text => text.trim()); // 去除可能的空格
});

// 在测试用例中调用
cy.getTableValueByCategory('fix headline 1', 'title 1').should('eq', 'value 1');
cy.getTableValueByCategory('fix headline 2', 'title 3').should('eq', 'value 3');