Useragent自动化在柏树中无法在移动视图中进行测试。也尝试了viewport，但是失败了

Question

我目前正试图自动化一个网站的移动视图使用柏树。我试着使用观点，但它似乎没有足够的响应网站。https://i.imgur.com/xvsm22d.png，我也使用了userAgent，但是它不起作用。以下是我尝试过的一些代码：

///<reference types = "Cypress"/>


describe("Test for mobile view", () => {
//method 1: using viewport
    beforeEach(() => {
       cy.viewport('iphone-x')
    })

// method 2: using useragent
    before(() => {
        cy.visit('https://www.bookmundi.com/', {
            onBeforeLoad: win => {
                Object.defineProperty(win.navigator, 'userAgent', {
                    value: 'Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)',
                });
            },
        });
    });
//method 3: using both useragent and viewport
    beforeEach(() => {
       Cypress.config('userAgent', "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1");
       cy.viewport('iphone-6')  // Set viewport to 375px x 667px
    });


    it("should be able to go to home page", () => {
//method 4: tried by keeping random size
        Cypress.config({
           viewportHeight: '375px',
           viewportWidth: '667px',
           userAgent: 'Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.87 Mobile Safari/537.36'
        })
        cy.visit("https://www.bookmundi.com/"); //homepage

//method 5:tried using headers
        cy.visit('https://www.bookmundi.com/', {
          headers: { 'user-agent': 'mobile' }
        });
    });
});

Answer 1

请尝试在userAgent配置文件中设置cypress.json。

{
  "baseUrl": "https://www.bookmundi.com",
  "userAgent": "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1"
}  

测试

it('my test', () => {
  cy.viewport('iphone-x')
  cy.visit('/')
})

布赖恩-曼于2018年8月23日发表评论。

不能在测试过程中更改用户代理。您可以做的是将移动测试与桌面测试分开，然后通过不同的cypress run --config userAgent=...分别运行这些组。