如何在Cypress中避免重复执行元素选择流程？

1. 把公共元素集合存为变量 #

先一次性获取完整的目标元素集合，再针对不同索引的元素单独操作，不用重复写整条选择链：

// 先获取所有符合条件的元素集合
const targetElements = cy.get("...").find("...");

// 分别操作第0个和第1个元素
targetElements.eq(0).should("...");
targetElements.eq(1).should("...");

2. 封装自定义命令 #

如果这段选择逻辑会在多个测试用例里复用，直接封装成Cypress自定义命令，在cypress/support/commands.js中添加：

Cypress.Commands.add('getTargetElements', () => {
  return cy.get("...").find("...");
});

之后在测试代码里直接调用即可：

cy.getTargetElements().eq(0).should("...");
cy.getTargetElements().eq(1).should("...");

3. 使用.each遍历处理 #

如果两个元素的断言逻辑有相似性，可以用.each遍历元素集合，一次性完成多个元素的处理：

cy.get("...").find("...").each(($el, index) => {
  if (index === 0) {
    cy.wrap($el).should("..."); // 处理第0个元素的断言
  } else if (index === 1) {
    cy.wrap($el).should("..."); // 处理第1个元素的断言
  }
});

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