在Cypress中测试登录应用与页面跳转遇阻求助

你的代码存在的核心问题 #

• 未启用跨域会话支持：cy.origin依赖Cypress的experimentalSessionAndOrigin配置，默认未开启时会导致跨域跳转被拦截，出现“连接已重置”的提示。
• cy.origin使用时机错误：登录触发跳转后，没有等待页面完成导航切换就直接调用cy.origin，Cypress还未切换到目标域的上下文。
• 断言逻辑不完整：直接使用cy.should('contain', 'Hello, World!')未指定作用元素，无法正确定位页面内容。

修正步骤 #

1. 开启跨域会话配置 #

在cypress.config.js（或cypress.config.ts）中添加以下配置，这是使用cy.origin的前提：

module.exports = {
  e2e: {
    experimentalSessionAndOrigin: true,
    // 保留你原有的其他配置
  },
};

2. 修正测试代码逻辑 #

调整代码，等待跳转完成后再进入目标域上下文，同时完善断言逻辑：

describe('log-in', () => {
  it('logs in and redirects to target app successfully', () => {
    // 访问登录页面
    cy.visit('http://127.0.0.1:4200/login/my-app');
    
    // 输入登录信息并提交（建议用点击按钮代替直接enter，更稳定）
    cy.get('#mat-input-0').type('user');
    // 如果有密码框，补充：cy.get('#mat-input-1').type('your-password');
    cy.get('button[type="submit"]').click();
    
    // 等待页面跳转完成，确认目标域
    cy.location('port').should('eq', '4206');
    
    // 进入目标域上下文，执行断言
    cy.origin('http://127.0.0.1:4206', () => {
      // 等待页面加载，基于具体元素断言
      cy.get('body').should('contain', 'Hello, World!');
      // 若有特定元素，可更精准：cy.get('.welcome-title').should('have.text', 'Hello, World!');
    });
  });
});

额外排查点 #

• 确认localhost:4206的服务是否正常运行，“连接已重置”也可能是目标服务未启动导致。
• 可添加接口监听，确保登录请求成功：

// 在cy.visit后添加
cy.intercept('POST', '/api/login').as('login');
// 提交后等待请求完成
cy.wait('@login').its('response.statusCode').should('eq', 200);

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