Cypress自动化测试问题：登录提交后新URL无法访问，流程卡滞返回登录页

1. 验证登录请求的有效性 #

• 用cy.intercept监听登录接口，确认请求是否成功、返回的认证凭据是否正确：

  cy.intercept('POST', '/api/login').as('loginRequest')
  cy.get('form').submit()
  cy.wait('@loginRequest').then((interception) => {
    expect(interception.response.statusCode).to.eq(200)
    expect(interception.response.body).to.have.property('token') // 或对应你的认证字段
  })
  

• 如果请求失败，优先排查用户名密码正确性、参数格式是否匹配前端加密逻辑（比如密码是否需要加密后提交）。

2. 检查认证凭据的存储状态 #

• 登录成功后，确认localStorage/sessionStorage或Cookie是否保存了认证信息：

  // 检查localStorage
  cy.window().then((win) => {
    expect(win.localStorage.getItem('authToken')).to.exist
  })
  // 或检查Cookie
  cy.getCookie('sessionId').should('exist')
  

• 若凭据未存储，可能是前端存储逻辑需要触发，或Cypress的安全设置限制了存储（可调整chromeWebSecurity配置）。

3. 用元素断言替代URL跳转检测 #

• 不要依赖URL变化判断页面跳转，直接断言目标页面的标志性元素：

  cy.get('form').submit()
  // 等待目标页面的核心元素加载，延长超时时间避免误判
  cy.get('.dashboard-title', { timeout: 10000 }).should('be.visible')
  

• SPA应用的前端路由跳转，Cypress可能不会自动识别URL变化，元素断言是更可靠的方式。

4. 调整Cypress安全配置 #

• 同域名下跳转异常时，修改cypress.config.js中的chromeWebSecurity设置：

  module.exports = defineConfig({
    e2e: {
      chromeWebSecurity: false,
    },
  })
  

• 确认测试环境域名与登录页域名完全一致，避免子域名差异导致的Cookie隔离问题。

5. 用API登录绕过前端跳转问题 #

• 新手可直接通过接口登录获取凭据，跳过前端页面的跳转环节：

  beforeEach(() => {
    cy.request('POST', '/api/login', {
      username: '你的用户名',
      password: '你的密码'
    }).then((response) => {
      cy.window().then((win) => {
        win.localStorage.setItem('authToken', response.body.token)
      })
      cy.visit('/目标页面路径')
    })
  })
  

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