如何使用Cypress测试Web Dashboard时无需重复登录

问题根本原因 #

• Cypress 12及以上版本默认开启*testIsolation（测试隔离）*特性，每个it用例执行前会自动清空所有cookie、localStorage、sessionStorage并重置页面上下文，before钩子中生成的登录态会在测试用例启动前被清除。
• 也可能是你的cy.SignIn()自定义命令没有等待登录态完全写入存储就结束，导致后续页面跳转时系统识别为未登录。

解决方案 #

方案1：关闭当前测试集的测试隔离（适合现有场景快速生效） #

直接修改describe的配置，关闭测试隔离即可复用before钩子的登录态，修改代码如下：

// 仅在describe第二个参数添加{ testIsolation: false }即可
describe("Overview Page", { testIsolation: false }, () => {
   before("Behaviour to overview page", () => {
       cy.SignIn();
       // 额外加一步校验，确保登录完成、登录态落地再执行用例，可替换为你实际的登录后路径
       cy.location('pathname').should('include', '/dashboard')
    });

    // 你原有it测试逻辑保持不变即可
    it("Overview Page Check", () => {
      // 原有代码省略
    })
})

方案2：用cy.session缓存登录态（通用方案，跨用例/跨测试文件都可复用） #

更推荐的长期方案，修改你的cy.SignIn()自定义命令，把登录逻辑包裹在cy.session中，全局所有测试调用该命令都会复用同一套登录态，无需重复执行登录动作：

// 通常该代码写在cypress/support/commands.js文件中
Cypress.Commands.add('SignIn', () => {
  // 给当前登录会话设置唯一标识，相同标识会复用同一登录态
  cy.session('dashboard-admin-login', () => {
    // 此处替换为你原来的登录逻辑
    cy.visit('/login')
    cy.get('[name="username"]').type('你的测试账号')
    cy.get('[name="password"]').type('你的测试密码')
    cy.get('#submit-login').click()
    // 确认登录成功再结束会话缓存
    cy.location('pathname').should('not.include', '/login')
  })
})

该方案无需关闭测试隔离，也不用调整现有测试用例结构，登录态会全局复用。

额外检查项 #

确认你的测试代码中没有手动调用cy.clearCookie()、cy.clearLocalStorage()、cy.clearAllSessionStorage()这类会清空登录态的命令，如有需要调整执行时机。

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