Cypress升级至v13后如何存储元素文本原值用于校验？

在Cypress v10+版本中，别名（.as()）的行为发生了变化：当你通过cy.get('@alias')调用别名时，Cypress会重新执行别名对应的原始查询命令，所以你会拿到更新后的元素文本，而非初始存储的值。要固定住初始值，你可以用以下几种方式：

1. 使用闭包变量存储初始值 #

在测试块内声明变量，在获取初始文本时赋值，后续直接使用该变量进行断言：

// 声明变量存储初始值
let initialTotalCals;

// 获取初始卡路里值并赋值
cy.getBySel('mealList-totalCalories').invoke('text').then(text => {
  initialTotalCals = parseInt(text);
});

// 执行添加新餐品的操作（比如点击添加按钮、输入餐品信息等）
cy.getBySel('add-meal-button').click();
// ...其他添加餐品的步骤

// 断言更新后的值等于初始值+280
cy.getBySel('mealList-totalCalories').should('have.text', initialTotalCals + 280);

2. 链式调用传递初始值 #

不需要使用别名，直接通过.then()把初始值传递到后续的断言逻辑中，全程保持链式调用：

cy.getBySel('mealList-totalCalories').invoke('text').then(initialText => {
  const initialTotal = parseInt(initialText);
  
  // 执行添加新餐品的操作
  cy.getBySel('add-meal-button').click();
  // ...其他添加餐品的步骤
  
  // 直接使用初始值进行断言
  cy.getBySel('mealList-totalCalories').should('have.text', initialTotal + 280);
});

3. 临时存储到Cypress环境变量（可选） #

如果你需要跨测试用例共享初始值，可以用Cypress.env()临时存储，但单测试用例内优先推荐前两种方法：

cy.getBySel('mealList-totalCalories').invoke('text').then(text => {
  Cypress.env('initialTotalCals', parseInt(text));
});

// 添加餐品操作...

cy.getBySel('mealList-totalCalories').should('have.text', Cypress.env('initialTotalCals') + 280);

关键说明 #

Cypress v10+ 对别名的设计更偏向于动态查询元素，而非存储静态值。所以如果要保存静态的初始值，必须脱离Cypress的命令链，用普通变量或链式传递的方式固定值，避免别名的重新查询行为。

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