Cypress教程：验证新打开标签页的URL是否正确

Cypress本身不支持直接切换到浏览器新标签页，所以我们需要通过拦截页面的window.open行为来捕获新标签页的目标URL，再完成验证。以下是对应Cucumber步骤的具体实现代码：

1. 实现"When"步骤：拦截新标签页跳转并存储URL #

When('I click on {string}', (linkText) => {
  // 拦截window.open方法，捕获要打开的URL
  cy.window().then(win => {
    cy.stub(win, 'open').callsFake(url => {
      // 将捕获到的URL存入Cypress环境变量
      Cypress.env('newTabTargetUrl', url);
      // 返回模拟窗口对象避免报错
      return { closed: false };
    });
  });
  // 点击目标链接
  cy.contains(linkText).click();
});

2. 实现"Then"步骤：验证捕获到的URL是否符合预期 #

Then('A new tab should be opened with the URL {string}', (expectedUrl) => {
  // 从环境变量中取出捕获到的实际URL
  const actualUrl = Cypress.env('newTabTargetUrl');
  // 断言URL匹配
  expect(actualUrl).to.equal(expectedUrl);

  // 可选：如果需要验证该URL页面的内容，可直接访问
  // cy.visit(actualUrl);
  // cy.url().should('eq', expectedUrl);
});

3. 可选：清理环境变量避免测试污染 #

在测试钩子中添加清理逻辑，防止环境变量影响其他测试用例：

After(() => {
  // 清除存储的URL
  Cypress.env('newTabTargetUrl', null);
});

说明 #

• 该方案适用于通过target="_blank"链接或window.open()方法触发的新标签页跳转。
• 如果页面是通过其他JS逻辑触发跳转，可根据实际情况调整拦截对象（比如拦截location.href跳转）。

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