如何使用Cypress route2测试指定请求未被发起？

我正在使用Cypress和route2测试Cookie授权横幅，因为需要测试多种网络请求类型，所以必须使用route2。

第一个场景我已经实现了：确保点击「接受」授权后，会发起Google Analytics请求，代码如下：

cy.route2('https://www.google-analytics.com/gtm/js').as("getGA")
cy.visit("/")
cy.contains("button", "Accept", { timeout: 15000 }).click()
cy.wait('@getGA').its('response.statusCode').should('eq', 200)

现在我需要实现第二个场景：测试在接受Cookie授权前，没有发起Google Analytics请求。我只找到cy.route()相关的示例，没找到route2的实现方案，请问能否用route2实现这个测试？

当然可以用cy.route2实现这个测试！它提供了比旧版cy.route更灵活的请求跟踪能力，下面是两种可行的实现方式：

方法1：通过回调标记请求是否触发 #

你可以在拦截请求时设置一个标志，当请求被触发时将标志置为true，最后断言这个标志保持false即可：

// 初始化标志，记录GA请求是否被触发
let gaRequestWasTriggered = false;

// 设置route2拦截GA请求，触发时修改标志
cy.route2('https://www.google-analytics.com/gtm/js', (req) => {
  gaRequestWasTriggered = true;
}).as("getGA");

cy.visit("/");
// 等待Cookie授权横幅加载完成（但不点击接受）
cy.contains("button", "Accept", { timeout: 15000 }).should('be.visible');

// 断言GA请求从未被发起
cy.wrap(gaRequestWasTriggered).should('be.false');

方法2：通过别名的请求数组断言数量为0 #

cy.route2的别名会自动收集所有匹配的请求，你可以通过@getGA.all获取这个请求数组，然后断言它的长度为0：

// 设置route2拦截并别名GA请求
cy.route2('https://www.google-analytics.com/gtm/js').as("getGA");

cy.visit("/");
// 等待授权横幅出现，不点击接受
cy.contains("button", "Accept", { timeout: 15000 }).should('be.visible');

// 断言没有匹配的GA请求被发起
cy.get('@getGA.all').should('have.length', 0);

小提示 #

如果你使用的是Cypress 6.0+版本，官方已经推荐使用cy.intercept替代cy.route2，两者的API几乎一致，上面的代码只需要把cy.route2替换成cy.intercept就能直接运行。另外记得断言前给页面足够的时间，避免因为请求延迟导致误判。

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