Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Emulating mobile in ChromeDriver

If you're using WebDriver with Chrome (via Chromedriver) you may want to emulate mobile viewport characteristics. Similarly, you may want to automate tests on desktop without having to use a proper Chrome on Android setup.

How do you do that?

like image 334
Paul Irish Avatar asked Aug 19 '14 22:08

Paul Irish


People also ask

How do I add a custom emulated device to Chrome?

To add a custom emulated device in Chrome, first open the dev tools with your favorite method. Then select toggle the device toolbar by clicking the phone/tablet icon or using the shortcut ctrl / cmd + shift + m . Open the dropdown to see all of the default devices available in Chrome.

How do I enable emulation in Chrome?

Start Chrome, navigate to the web page you want to test and open the Developer Tools (Menu > Tools > Developer Tools, Cmd + Opt + I on macOS or F12 / Ctrl + Shift + I on Windows and Linux). While not quite an iOS or Android emulator, a number of mobile devices running both platforms can be selected as presets.


1 Answers

The mobile_emulation capability was added to ChromeDriver in 2.11

Full documentation: https://sites.google.com/a/chromium.org/chromedriver/mobile-emulation

My notes below:

Creating a driver in Python with the mobile_emulation capability options:

 driver = self.CreateDriver(
        mobile_emulation = {
            'deviceMetrics': {'width': 360, 'height': 640, 'pixelRatio': 3}})

Currently you can emulate devicepixelratio, useragent, viewport height and width.

Possible properties for the mobile_emulation dict:

  • deviceName : if used, must be the only property. Matches a device preset in Chrome (e.g. 'Google Nexus 5').
  • deviceMetrics: a dict that can include width (int), height (int), pixelRatio (double) as shown above.
  • userAgent: a string to spoof at the request header and navigator object.
like image 112
Paul Irish Avatar answered Sep 29 '22 12:09

Paul Irish