如何在Cypress测试中存储值并跨页使用？排查存储值报错问题

AI 小北

2026-8-2

Cypress跨页面信息对比的正确实现

你的问题出在三个核心点：

存储了DOM元素对象而非元素的文本内容：执行cy.visit()刷新页面后，原DOM元素被销毁，别名引用的对象变为null，导致读取失败。
错误地将cy.get()赋值给变量：cy.get()是异步命令，返回的是Cypress命令链，不是实际的元素文本，不能直接用const赋值获取结果。
对比的是DOM元素对象而非文本内容：即使不刷新页面，不同页面的DOM元素对象也不可能相等，应该对比元素显示的文本。

正确实现步骤

访问第一个页面时，获取元素的文本内容并存为别名：

// 访问第一个URL后，获取标题文本并存储
cy.get('[datacy="displayTitle"]')
  .invoke('text') // 获取元素的文本内容
  .as('savedTitle'); // 存为别名

访问第二个页面：

cy.visit("different url");

取出存储的文本，与当前页面元素的文本对比：

cy.get('@savedTitle').then(savedTitle => {
  // 获取当前页面的目标元素文本，与存储的文本对比
  cy.get(':nth-child(1) > .css-106jpu6 > .css-1j088rq > .MuiBox-root > button > .MuiTypography-root')
    .invoke('text')
    .should('eq', savedTitle.trim()); // trim()处理首尾空格，避免因空格导致断言失败
});

额外优化方案

如果不需要保留别名后续复用，也可以直接把文本存入Cypress环境变量：

// 存储文本到环境变量
cy.get('[datacy="displayTitle"]')
  .invoke('text')
  .then(title => {
    Cypress.env('savedTitle', title.trim());
  });

// 断言时读取环境变量
cy.visit("different url");
cy.get(':nth-child(1) > .css-106jpu6 > .css-1j088rq > .MuiBox-root > button > .MuiTypography-root')
  .invoke('text')
  .should('eq', Cypress.env('savedTitle'));