generator-angular-fullstack icon indicating copy to clipboard operation
generator-angular-fullstack copied to clipboard

Protractor ChromeDriver configuration for mobile emulation

Open michaelerobertsjr opened this issue 10 years ago • 13 comments

We're working on end to end testing with protractor. We need to test our website on a variety of mobile devices so we would like to use ChromeDriver Emulation

The docs on the site are really thin, can anyone point me in the correct direction to get the setup complete? Here is what I have so far:

Updated chromedriver to 2.9.248307 (chromedriver 2.11 appears to be the first version with mobile emulation but 2.10 was the default in the generator.

In protractor.conf.js have set chromeOnly: true

Device capabilities are shown below. It doesn't seem to matter what I provide, it runs chromedriver but it appears to ignore the capabilities set in protractor.conf.js:

{
  "browserName": "chrome",
  "device": "Apple iPhone 6",
  "deviceMetrics": {
    "width": 360,
    "height": 640,
    "pixelRatio": 3.0
  }
}

What else needs to be configured/provided?

michaelerobertsjr avatar Dec 02 '14 20:12 michaelerobertsjr

up, this question is also important for me

drizgolovicha avatar May 12 '15 18:05 drizgolovicha

try:

capabilities: {
  'browserName': 'chrome',
  'chromeOptions': {
    'args': ['show-fps-counter=true'],
    'mobileEmulation' : {
      'deviceName': 'Apple iPhone 6'
    }
  }
}

daniel-rabe avatar Sep 10 '15 07:09 daniel-rabe

@daniel-rabe @michaelerobertsjr Nice I'm also interested in this kind of solution. Is there also a way to name the xml output files different by deviceName?

Karpo72 avatar Oct 20 '15 18:10 Karpo72

@daniel-rabe @michaelerobertsjr Hi! thanks to your solution now I am able to run my tests of a Web with Chromedriver mobile emulation. This is my config:

capabilities: { 
    'browserName': 'chrome', 
    'chromeOptions': { 
      'mobileEmulation' : { 
        'deviceName': 'Google Nexus 5' 
      } 
    } 
  }

Is there a way to have an "array" of devices to run the tests on? What I really would like is to be able to run the same tests over a list of device

LaiaPR avatar Feb 10 '16 14:02 LaiaPR

Thanks @LaiaPR your solution works pretty well.

I have a solution to add a list of devices. It is working for me but I think that maybe there is a clean solution.

Remove capabitities and add multCapabilities, example:

multiCapabilities: [
        {
            browserName: 'firefox'
        },
        {
            browserName: 'chrome'
        },
        {
            browserName: 'chrome',
            'chromeOptions': {
                'mobileEmulation': {
                    'deviceName': 'Google Nexus 5'
                }
            }
        },
        {
            browserName: 'chrome',
            'chromeOptions': {
                'mobileEmulation': {
                    'deviceName': 'Apple iPhone 6'
                }
            }
        },
    ]

Testing on desktop (firefox, chrome) Testing on Google Nexus 5 (chrome) Testing on Apple iPhone 6 (chrome)

aluzardo avatar Jun 16 '16 09:06 aluzardo

@aluzardo Hi!! Thanks for sharing your solution! I found the same solution as you (multicapabilities) and forgot to post it >_< Yes, it's the right one!

LaiaPR avatar Jun 20 '16 20:06 LaiaPR

I implemented this now non of my swiping gestures work

bchuckles avatar Sep 12 '16 18:09 bchuckles

@daniel-rabe Thanks for sharing your solution!

AndyForGit avatar Jan 11 '17 08:01 AndyForGit

Hi all, I am struggling to run the protractor emulating the mobile. my conf file is as you suggested: exports.config = { directConnect: true,

// Capabilities to be passed to the webdriver instance. capabilities: { 'browserName': 'chrome', 'chromeOptions': { 'mobileEmulation' : { 'deviceName': 'Google Nexus 5' } } }, But I got this error: WebDriverError: invalid argument: cannot parse capability: chromeOptions from invalid argument: cannot parse mobileEmulation from invalid argument: 'Google Nexus 5' must be a valid device from unknown error: must be a valid device

Am I missing something? Is there another place where I have to declare the device? Are you also using Appium?

ingriddbritok3 avatar Apr 15 '20 14:04 ingriddbritok3

@ingriddbritok3 I have tried 'Nexus 5' instead of 'Google Nexus 5' and it worked.

orlyohreally avatar May 21 '20 14:05 orlyohreally

Yes it worked with only giving 'Nexus 5'

I want to run single scenario on mobile emulation. How can I achieve that? Can it be possible using cucumber tagged hook? If yes then how? I am using protractor-cucumber-framework.

nishudixit avatar Jun 08 '20 09:06 nishudixit

@nishudixit 'Nexus 5` is very old device, I added a custom device such as iPhone 12 but it doesn't work, any idea why it supports only these super old devices?

offirpeer avatar May 20 '21 12:05 offirpeer

How to set the orientation to landscape??

ohlori avatar Jun 17 '21 19:06 ohlori