Cypress.io 中是否有编程方式来更改用户代理？

Question

我有一些广告调用仅在移动设备上进行。在 Chrome 中，我可以使用设备模式并模拟移动设备，并且从服务器生成的广告调用是针对移动设备正确定制的。我不确定 Chrome 是如何做到这一点的，除了可能通过发送不同的用户代理。

在Cypress.io文档中，它说可以在配置文件中更改用户代理(Cypress.json)。但是，我需要运行测试桌面视口，然后是带有移动用户代理的移动视口。有没有办法以编程方式更改用户代理？

Answer 1

更新：根据https://github.com/cypress-io/cypress/issues/3873，Cypress 3.3.0 在cy.request() 中使用user-agent 属性是可能的和 cy.visit().

如果您需要，例如，将 userAgent 设置为 Googlebot:

cy.visit(url, {
    headers: {
        'user-agent': 'Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)',
    }
});

赛普拉斯 3.3.0 之前的原始答案

before(() => {
    cy.visit(url, {
        onBeforeLoad: win => {
            Object.defineProperty(win.navigator, 'userAgent', {
                value: 'Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)',
            });
        },
    });
});

Answer 2

其他答案没有设置底层 HTTP 请求的 User-Agent header，只是 win.navigator 的 userAgent 属性。要将 User-Agent header 设置为所有 HTTP 请求的自定义值，您可以设置 userAgent configuration option:

{
  // rest of your cypress.json...
  "userAgent": "Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)"
}

Answer 3

现在 cypress 支持在 header 中为 cy.visit 以及 cy.request 传递用户代理：

it('Verify Social Sharing Meta Tags', () => {
  cy.visit(portalURL + '/whats_new/140', {
    headers: {
      'user-agent': 'LinkedInBot/1.0 (compatible; Mozilla/5.0; Apache-HttpClient +http://www.linkedin.com)',
    }
  });

  cy.document().get('head meta[name="og:type"]')
    .should('have.attr', 'content', 'website');
});

https://on.cypress.io/changelog#3-3-0

2021 年 8 月 12 日更新：

看来你不能再更改用户代理了，参考https://docs.cypress.io/api/cypress-api/config#Notes

Cypress.io 中是否有编程方式来更改用户代理？

Is there a programmatic way to change user agent in Cypress.io?

browser

e2e-testing

cypress

赛普拉斯 3.3.0 之前的原始答案