如何在Cypress的afterEach钩子中判断@userEmail别名是否存在？

问题背景 #

团队部分Cypress测试会通过setupEmail函数生成用户邮箱并设置别名@userEmail，但另一部分测试不会创建该别名。需要实现一个afterEach钩子逻辑：仅当@userEmail别名存在时，执行数据库清理操作；不存在则无任何动作。

当前创建别名的代码（路径：/cypress/support/actions/user-setup.js）：

const setupEmail = function (alias) {
  cy.wrap(getEmail(alias)).as('userEmail');
};

最初的afterEach实现会在无别名的测试中直接失败：

afterEach(function () {
  
  cy.get('@userEmail').then((email) => {
    cy.dbQuery('clearSSNandPhoneNumber', email);
  });
});

可行解决方案 #

方案1：直接检查测试上下文的别名属性 #

Cypress会将别名挂载到测试的this上下文对象中，因此可以直接通过this.userEmail判断别名是否存在：

afterEach(function () {
  // 必须使用普通函数，箭头函数会丢失this上下文
  if (this.userEmail) {
    cy.dbQuery('clearSSNandPhoneNumber', this.userEmail);
  }
});

注意：回调函数不能用箭头函数，否则无法访问Cypress的测试上下文this。

方案2：捕获cy.get()的错误 #

如果偏好链式调用风格，可以用.catch()捕获别名不存在的错误，避免测试失败：

afterEach(() => {
  cy.get('@userEmail')
    .then((email) => {
      cy.dbQuery('clearSSNandPhoneNumber', email);
    })
    .catch(() => {
      // 别名不存在时跳过操作
    });
});

方案3：自定义标记变量 #

在创建别名时额外设置一个标记变量，后续通过标记判断是否需要执行清理：

1. 修改setupEmail函数添加标记：

const setupEmail = function (alias) {
  const email = getEmail(alias);
  cy.wrap(email).as('userEmail');
  cy.wrap(true).as('hasUserEmail'); // 添加存在标记
};

2. 在afterEach中检查标记：

afterEach(function () {
  if (this.hasUserEmail) {
    cy.dbQuery('clearSSNandPhoneNumber', this.userEmail);
  }
});

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