如何解决Cypress测试SSO登录时跳转URL无法正常处理的问题

你当前代码的核心问题是未等待SSO跳转流程完成就获取URL，同时冗余的点击配置、未开启跨域跳转支持也可能触发异常，可按以下步骤修复：

• 移除登录按钮点击的多余配置
  你当前调用click时加的{multiple: true,force: true}会绕过Cypress的可交互性校验，若按钮唯一且可正常点击，直接调用cy.get(".login > .submit > .button").click()即可，避免异常点击导致登录请求提交失败。

• 新增跳转等待逻辑，避免提前获取URL
  点击登录按钮后不要立刻读取当前URL，先校验已离开SSO登录页，确认跳转完成后再做后续操作，优化后的核心逻辑如下：

it.only("logs in using env variables", () => {
  const username = Cypress.env("username");
  const password = Cypress.env("password");

  cy.visit("/");
  cy.get(".chakra-stack > .css-1n94901").click()
  cy.contains("Login with Carmarket").click();

  cy.get(":nth-child(1) > .form-control").type(username);
  cy.get(":nth-child(2) > .form-control").type(password);
  // 移除冗余配置
  cy.get(".login > .submit > .button").click();

  // 等待跳转完成，先校验已离开登录页，替换为你实际的SSO登录页域名关键字
  cy.url().should('not.include', 'carmarket-sso-login');
  // 无需重复调用cy.visit，跳转已经自动完成，直接校验目标地址即可
  cy.url().should("include", "你预期的登录后地址关键字"); 
});

• 开启跨域支持配置
  SSO登录通常涉及跨域跳转，需要在cypress.config.js中添加配置项experimentalSessionAndOrigin: true，开启后Cypress可以正常捕获跨域跳转的上下文，不会出现地址获取错误、页面空白等问题。

• （可选）用cy.session封装登录逻辑复用
  如果多个用例都需要登录，可将SSO登录逻辑封装为自定义命令，避免每个用例都重复走跳转流程，同时缓存登录态提升执行效率：

// 放在cypress/support/commands.js中
Cypress.Commands.add('ssoLogin', (username, password) => {
  cy.session([username, password], () => {
    cy.visit("/");
    cy.get(".chakra-stack > .css-1n94901").click()
    cy.contains("Login with Carmarket").click();
    cy.get(":nth-child(1) > .form-control").type(username);
    cy.get(":nth-child(2) > .form-control").type(password);
    cy.get(".login > .submit > .button").click();
    cy.url().should('include', '你预期的登录后地址关键字');
  })
})

// 用例中直接调用
it.only("logs in using env variables", () => {
  const username = Cypress.env("username");
  const password = Cypress.env("password");
  cy.ssoLogin(username, password);
  cy.visit("/");
  // 后续业务测试逻辑
})

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