What is a good headless browser to run with protractor?

Question

After hours of building my smoke and regression tests, I found out after reading many cases online that phantomjs is known to be a trouble to run with the protractor. Jenkins has been running phantomjs for all the tasks it has been given so far.

They need these tests to run as part of ci which does not have a windowing system installed.

So I would appreciate it if there is a recommendation for a completely headless browser or a headless chrome(that would be most beneficial) and a step by step to set it up. I already have a conf.js and an e2e.conf.js file. My code works perfectly fine with chrome.

I am on an iMac and selenium webdriver, I believe.

Edit: Problem = protractor doesn't work with phantomjs. What I have done = use different web elements and googled if anyone has faced a similar situation. Also googled for headless browsers that worked for the protractor, unable to find a suitable solution.

Answer 1

If anyone reached here - the answers are out-of-date. Chromium (on next release) now supports headless mode. no need to work hard.

You can read more here:

https://developers.google.com/web/updates/2017/04/headless-chrome

Here is an example from the command line

chrome \

 --headless \                   # Runs Chrome in headless mode.

 --disable-gpu \                # Temporarily needed for now.

 --remote-debugging-port=9222 \

 https://www.chromestatus.com   # URL to open. Defaults to about:blank.

And you'll simply trigger protractor with capabilities for chrome:

Here is the configuration I am using

capabilities: {

    'browserName': browserName,

    chromeOptions: {

      binary: '/Users/guymograbi/Downloads/chrome-mac/Chromium.app/Contents/MacOS/Chromium',

      args: ['--headless','--disable-gpu']

    }

  },

Update - new versions of chrome does not need binary property

In my IDE I found I can remove the binary property as a new edition of chrome is offered on stable branches

My protractor configuration is

capabilities: {

    'browserName': 'chrome',

    chromeOptions: {

      args: [ '--headless', '--disable-gpu', '--no-sandbox', '--window-size=1920x1200' ]

    },

  },

And it works smoothly for weeks now. highly recommended.

Update - how to do this in karma is super easy

Using headless chrome in karma is super easy:

browsers: 'ChromeHeadless'

it ought to work with the chrome loader and everything. more info