Cypress技术问询：如何实现页面登出及登录状态校验？

嘿，针对你在Cypress里遇到的登录状态相关问题，我来给你详细拆解下：

你发现浏览器逐个运行测试用例时每次都要重新登录，但命令行运行时仅第一个用例需要登录——这其实是Cypress不同运行模式下的上下文隔离机制导致的：

• 当你在Cypress Test Runner中单独点击某个测试用例运行时，Cypress会为每个单独运行的用例启动全新的浏览器实例，自动清空所有cookie、localStorage等状态，所以每次都得重新登录。
• 而通过命令行运行整个测试套件时，默认情况下（如果没开启强制隔离）Cypress会在同一个浏览器实例中按顺序执行所有用例，之前的登录状态（cookie、会话）会被保留，因此后续用例不需要重复登录。

如果你想让命令行运行时每个用例也完全隔离，可以在cypress.config.js里设置testIsolation: true，这样每个用例都会重置上下文。

有几种常用的校验方式，你可以根据站点的实际情况选择：

• 检查页面UI元素：登录后通常会出现专属的元素（比如用户头像、退出按钮），未登录时则显示登录入口：

  // 校验已登录：退出按钮可见
  cy.get('.logout-button').should('be.visible')
  // 校验未登录：登录按钮可见
  cy.get('.button-login').should('be.visible')
  

• 检查认证Cookie：多数站点会把登录凭证存在Cookie里，你可以检查对应Cookie是否存在：

  cy.getCookie('auth_token').should('exist') // 替换成你站点的认证Cookie名称
  

• 检查本地存储：如果站点用localStorage/sessionStorage存储登录状态，也可以直接校验：

  cy.window().its('localStorage.user_info').should('exist') // 替换成实际存储的键名
  

登出操作的实现完全依赖站点的UI或接口设计，这里给你两种常见场景的示例：

场景1：通过UI操作登出 #

假设你的站点需要点击用户菜单后选择登出选项：

// 先确保处于登录状态（可选校验）
cy.get('.user-menu').should('be.visible')
// 点击用户菜单按钮
cy.get('.user-menu-toggle').click()
// 点击登出选项
cy.get('.logout-option').click()
// 校验登出成功：比如跳转到登录页，或显示登录按钮
cy.url().should('include', '/login')
cy.get('.button-login').should('be.visible')

场景2：通过接口调用登出 #

如果站点提供了登出接口，直接调用接口会比UI操作更高效：

// 发送登出请求
cy.request('POST', '/api/user/logout') // 替换成实际的登出接口地址
// 校验登出后的状态
cy.getCookie('auth_token').should('not.exist')

为了避免重复登录的繁琐，推荐你用Cypress的cy.session()来缓存登录状态，这是官方推荐的最佳实践：

beforeEach(() => {
  cy.session('user-login', () => {
    // 执行你的登录逻辑
    cy.visit( "https://zeteodemo.uat.creasoft.cz/login?ReturnUrl=%2fVehicleInsuranceV2%2fCompare%3fOsobniCislo1%3d1%26ProductsFilter%3dAXA-ONLINE" );
    cy.get(".login__username")
      .type("tester")
      .should("have.value", "tester");
    cy.get(".login__password")
      .type("1")
      .should("have.value", "1");
    cy.get(".button-login").click();
    // 必须校验登录成功，确保缓存的会话是有效的
    cy.get('.user-menu').should('be.visible')
  })
})

使用cy.session()后，不管是浏览器单个运行用例还是命令行运行套件，Cypress都会复用已缓存的登录会话，不用每次重复执行登录步骤，既节省时间又保证状态一致。

内容的提问来源于stack exchange，提问作者Dominik Skála