多域名场景下Cypress测试高效执行的最优方案咨询

我来分享几个能解决你痛点的实用方案——既能避免before导致的页面重载问题，又能比beforeEach更高效地完成静态内容验证：

方案1：禁用测试隔离（Cypress 12+推荐） #

Cypress默认开启的testIsolation特性，会在每个it测试块之间重置浏览器上下文（包括清空页面、重置状态），这就是你用before时，第一个测试后页面反复重载的核心原因。

我们可以在describe级别禁用这个特性，让同一个站点的所有测试共享同一个浏览器上下文，这样before里的cy.visit只执行一次，后续测试直接复用已加载的页面：

config.sites.forEach((site) => {
  // 在describe配置中添加testIsolation: false
  describe('Testing SEO:' + site.url, { testIsolation: false }, function() {
    before(function() {
      cy.visit(site.url);
    });

    it('Checks there is only one h1 on the page', function() {
      cy.get('h1').should('have.length', 1);
    });

    it('Verifies the h1 content matches config', function() {
      cy.get('h1').should('have.text', site.seo.h1);
    });
  });
});

注意：这个方案只适合静态内容检查（比如你的SEO验证），如果测试中有修改页面状态的操作（比如点击按钮、提交表单），禁用隔离会导致测试间互相干扰，这种情况就不适用了。

方案2：合并断言到单个测试块 #

如果你的测试都是针对同一页面的静态验证，完全可以把多个断言合并到同一个it里，这样每个站点只需要加载一次页面，效率拉满：

config.sites.forEach((site) => {
  describe('Testing SEO:' + site.url, function() {
    it('Validates all SEO-related page content', function() {
      cy.visit(site.url);
      // 链式调用合并多个断言
      cy.get('h1')
        .should('have.length', 1)
        .and('have.text', site.seo.h1);
      
      // 还可以继续添加其他静态检查，比如meta标签、页面标题等
      cy.title().should('eq', site.seo.title);
      cy.get('meta[name="description"]').should('have.attr', 'content', site.seo.description);
    });
  });
});

这个方案的唯一小缺点是：如果某个断言失败，后续的检查就不会执行了。但如果你的需求是快速验证站点可用性，或者希望每个站点的测试作为一个整体报告，这反而更合适。

方案3：自定义钩子缓存页面元素（进阶场景） #

如果需要更精细的控制，可以在before中缓存页面元素，后续测试直接使用缓存的元素，避免重复查询DOM的开销：

config.sites.forEach((site) => {
  describe('Testing SEO:' + site.url, { testIsolation: false }, function() {
    let pageH1;

    before(function() {
      cy.visit(site.url);
      // 缓存h1元素到变量中
      cy.get('h1').then($el => {
        pageH1 = $el;
      });
    });

    it('Checks there is only one h1 on the page', function() {
      cy.wrap(pageH1).should('have.length', 1);
    });

    it('Verifies the h1 content matches config', function() {
      cy.wrap(pageH1).should('have.text', site.seo.h1);
    });
  });
});

这个方案和方案1结合使用，进一步减少了DOM查询的开销，适合元素查询成本较高的复杂场景。

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