Cypress访问页面遇cy.origin问题及URL校验失败求助

核心原因 #

你遇到的expected '' to include http://localhost:4200错误，大概率是跨域跳转导致Cypress丢失当前页面上下文，或是硬等待时间不足、登录请求未完成就执行cy.url()检查。另外cy.visit('https://login')的URL不完整，Cypress无法正确解析目标登录页面。

具体修复步骤 #

1. 修正cy.visit的完整URL #

'https://login'不是合法的完整URL，Cypress无法正常访问。替换为实际登录页面的完整地址，示例：

cy.visit('https://your-real-login-domain.com'); // 替换为真实登录页域名

2. 替换硬等待为可靠的等待逻辑 #

cy.wait(7000)不稳定——网络慢时7秒可能不够，快时又浪费时间。建议改成等待目标页面核心元素出现，或监听登录接口响应：

方式一：等待目标页面元素

cy.get('#kc-login').click()
// 等待目标页面的唯一标识元素（比如机器列表容器）出现
cy.get('.machine-list-container').should('be.visible')
cy.url().should('include', 'http://localhost:4200/machines')

方式二：监听登录接口

如果登录通过API请求完成，先拦截接口确保请求成功：

// 拦截登录接口，替换为你的实际接口路径
cy.intercept('POST', '/api/login').as('loginRequest') 

cy.get('#kc-login').click()
// 等待登录请求完成并验证状态码
cy.wait('@loginRequest').its('response.statusCode').should('eq', 200)
cy.url().should('include', 'http://localhost:4200/machines')

3. 处理跨域跳转问题 #

如果登录页（如https://your-login-domain.com）和目标页（http://localhost:4200）是不同域名，Cypress默认会在跨域跳转后丢失上下文，导致cy.url()返回空。这种情况下必须用cy.origin处理跨域操作，这是Cypress的标准跨域解决方案：

// 访问登录页所在域名
cy.visit('https://your-real-login-domain.com');

// 在登录页域名上下文内执行登录操作
cy.origin('https://your-real-login-domain.com', () => {
  cy.get('#username').type(username);
  cy.get('#password').type(password);
  cy.get('#kc-login').click()
})

// 回到目标页域名上下文，检查URL
cy.url().should('include', 'http://localhost:4200/machines')

4. 检查Cypress配置 #

如果确认没有跨域但experimentalSkipDomainInjection无效，检查cypress.config.js配置是否正确，修改后需重启Cypress服务：

module.exports = defineConfig({
  e2e: {
    experimentalSkipDomainInjection: true,
    // 其他配置项...
  },
})

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