Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support headless chrome directly without selenium #1439

Closed
portenez opened this issue Apr 13, 2017 · 30 comments

Comments

Projects
None yet
@portenez
Copy link

commented Apr 13, 2017

Now that chrome has native support for headless mode, nightwatch should be able to directly talk to chrome without the need of selenium.

Here's the chromium ticket:
https://www.chromestatus.com/features/5678767817097216

Ways this will help developers:

  • Easier headless setup.
  • Better performance due to fewer components involved.
  • More predictability as there are less moving parts

Also, the main maintainer of phantomJS is stepping down due to this development:
https://groups.google.com/forum/#!topic/phantomjs/9aI5d-LDuNE

A bit of explanation of how this works:
https://www.youtube.com/watch?v=GivjumRiZ8c

slides:
https://docs.google.com/presentation/d/1gqK9F4lGAY3TZudAtdcxzMQNEE7PcuQrGu83No3l0lw/edit#slide=id.g13338d98ec_0_25

@beatfactor

This comment has been minimized.

Copy link
Member

commented Apr 13, 2017

I think you might already be able to do this (on Linux):

  1. Start Chrome with remote debugging enabled: https://chromium.googlesource.com/chromium/src/+/lkgr/headless/README.md
  2. Set the binary location in chromedriver:
    https://sites.google.com/a/chromium.org/chromedriver/capabilities
@discordianfish

This comment has been minimized.

Copy link

commented Apr 16, 2017

Can you elaborate? I can't figure out how to configure this. I see how to run chrome with remote debugging, but how do I configure nightwatch to talk to it?

@discordianfish

This comment has been minimized.

Copy link

commented Apr 18, 2017

As a frontend noob, I had to dive a bit into this testing ecosystem and I still don't get how headless chrome fits into it. I've figured out that I don't need selenium but can have nightwatch talk directly to chromedriver. So I thought headless chrome might replace chromedriver, but the remote debugging protocol doesn't seem to be webdriver.

@beatfactor

This comment has been minimized.

Copy link
Member

commented Apr 18, 2017

No it's not, and headless chrome is not meant to replace Chromedriver. You can launch Chrome in headless mode by passing the --headless cli flag (Linux only) and presumably instruct Chromedriver to use that Chrome instance. I don't have clear instructions as I haven't yet had time to try this myself.

This becomes useful more in a context of a Continuous Integration server which might not have a UI to open browser windows. Although you can already do this on Linux using a tool like Xvfb, but that requires a bit more setup and complexity involved.

@discordianfish

This comment has been minimized.

Copy link

commented Apr 18, 2017

Oh, so that's all headless is about? Then I'd suggest to rename this issue because like it is it sound as it's somehow selenium and friends related. Thanks for explaining. I've got 99 problems but running Xvfb before my tests ain't one :)

Now if someone ends up here looking to run nightwatch without selenium: Just run chromedriver manually with --url-base=/wd/hub, disable start_process and point nightwatch to the chromedriver port (via selenium_host/_port). I've put some more details here: https://5pi.de/2017/04/17/selenium-webdriver-chromedriver-nightwatch-chrome-headless/

@beatfactor

This comment has been minimized.

Copy link
Member

commented Apr 18, 2017

@weiyuxuan

This comment has been minimized.

Copy link

commented Apr 21, 2017

The headless chrome seems work fine with nightwatchJS in my project, but there is something wrong with the .saveScreenshot() api, every picture it captured was 1px*1px size, I have no idea why this happened. By the way, PhantomJS is OK.

@omair100

This comment has been minimized.

Copy link

commented Apr 21, 2017

@weiyuxuan i seem to be having the same issue - not figured out what is the cause yet - i'm on mac not sure if it's a nightwatch issue seems like more to do with selenium. I might be wrong.

@timetraveler90

This comment has been minimized.

Copy link

commented Apr 21, 2017

Is there anyone who was able to make nightwatchJS work with headless chrome, and if it is, could you please share your code with us please.

@omair100

This comment has been minimized.

Copy link

commented Apr 21, 2017

@timetraveler90 depends which environment linux should work with chrome. On Mac it will only work with canary version. This is what i've done for mac:

"desiredCapabilities": {
   "browserName": "chrome",
   "chromeOptions": {
       "args": [
           ""--headless"
        ],
        "binary": "/Applications/Google Chrome Canary.app/Contents/MacOS/Google Chrome Canary"
     }
}

You need to have the latest Chrome Canary and chrome driver version for Mac.

Also as mentioned previously i do have issues with screenshot on Mac.

@weiyuxuan

This comment has been minimized.

Copy link

commented Apr 23, 2017

@omair100 Sure thing, the screenshot problem also occurred on my Mac. Then I tested the .saveScreenshot() api on Ubuntu 14.04, it worked just fine. So I guess the chrome headless mode is not stable on Mac?

@Devegnik

This comment has been minimized.

Copy link

commented Apr 25, 2017

Hi! Somebody did it on Windows? I have latest version of chromedriver, Canary, choose headless args on chrome, but is still not headless. Can anyone show me nightwatch config?

@rafalf

This comment has been minimized.

Copy link

commented Apr 26, 2017

Hi. anyone been able to do it on Windows?
Ive tried it with the latest 50 chrome (developer) and chromedriver v.29 but not going headless

@KayLeung

This comment has been minimized.

Copy link

commented May 3, 2017

@beatfactor Will nightwatchJS implement "Chrome Debugging Protocol" if all browsers supporting it well? Or nightwatchJS only focus on webdriver forever? Do you have a plan? Thanks.

@Devegnik @rafalf this isn't available on Windows yet: https://bugs.chromium.org/p/chromium/issues/detail?id=686608

@mhemesath

This comment has been minimized.

Copy link

commented Jul 20, 2017

If anyone wants a good way to get the binary location you can use the chrome-launcher package:

var chromefinder = require('chrome-launcher/chrome-finder')
chromefinder[process.platform]()[0]
@portenez

This comment has been minimized.

Copy link
Author

commented Jul 21, 2017

I logged the issue some time ago, and it seems like this is already doable by using the selenium protocol directly against chrome driver. Should we close this ticket??

http://nightwatchjs.org/gettingstarted/#chromedriver

@apoorv-binary

This comment has been minimized.

Copy link

commented Jul 24, 2017

Was anyone able to fix the saveScreenshot problem on mac?

@vernak2539

This comment has been minimized.

Copy link

commented Aug 10, 2017

I've tried almost everything to get this working on CentOS 7.

First hurdle was that you need to install fonts used by chrome to get it to start up properly.

I've tried the following capabilities to no avail. I output the chrome version with the binary "path" too, so it should be functioning correctly. Also tried with the output of which google-chrome.

I'm using the standalone chromedriver setup, http://nightwatchjs.org/gettingstarted/#chromedriver. Works 100% on mac using headless, but not linux. Running http://nightwatchjs.org/gettingstarted/#chromedriver

let desiredCapabilities = {
    browserName: 'chrome',
    javascriptEnabled: true,
    acceptSslCerts: true,
    chromeOptions: {
        args: ['window-size=1400,1000', 'headless', 'disable-gpu', 'remote-debugging-port=9222']
    },
    binary: 'google-chrome'
};

also tried remote-debugging-port=9515

config

{
    output_folder: 'reports',
    custom_commands_path: '',
    custom_assertions_path: '',
    page_objects_path: 'page_objects',
    globals_path: 'config/globals.js',
    selenium: {
        start_process: false
    },
    test_settings: {
        default: {
            selenium_port: 9515,
            selenium_host: 'localhost',
            default_path_prefix: '',
            // silent: true,
            screenshots: {
                enabled: true,
                on_failure: true,
                path: 'screenshots/'
            },
            desiredCapabilities
        }
    }
};

Any help at all would be much appreciated

@sanbor

This comment has been minimized.

Copy link

commented Aug 16, 2017

@vernak2539 Try just using "args": ["--headless"],.

@vernak2539

This comment has been minimized.

Copy link

commented Aug 21, 2017

I did try that combo, but I can try again just to be sure

@shogunsea

This comment has been minimized.

Copy link

commented Aug 21, 2017

In case anyone hasn't tried this, but Google has recently released puppeteer to make launching headless Chrome painless in node environment.

@vernak2539

This comment has been minimized.

Copy link

commented Aug 22, 2017

@sanbor so I've tried it with --headless also to no avail. Frustrating to say the least

@shogunsea not sure how that would fit in here, just starting the browser? Tried out a few things without going to much into it, and it didn't seem to work with the session management and such. @beatfactor would you have any clue how to use puppeteer with nightwatch?

@portenez

This comment has been minimized.

Copy link
Author

commented Aug 23, 2017

I have a working setup.

I have a docker container that can run headless Chrome:
https://github.com/portenez/docker-builder/blob/master/nightwatch/Dockerfile

(Don't use my image directly, there's no guarantee I'll change it, use the Dockerfile as a template)

This is the config that I use:

module.exports = {
  src_folders: [ './features' ],
  output_folder: 'reports',
  custom_commands_path: '',
  custom_assertions_path: '',
  page_objects_path: './pageObjects',
  globals_path: './globals/globals.js',

  selenium: {
    start_process: false
  },

  test_settings: {
    default: {
      launch_url: 'http://web:5040',
      selenium_port: 9515,
      selenium_host: '127.0.0.1',
      request_timeout_options: {
        timeout: 15000,
        retry_attempts: 5
      },
      default_path_prefix: '',
      silent: true,
      screenshots: {
        enabled: true,
        path: './reports',
        on_failure: true
      },
      javascriptEnabled: true,
      acceptSslCerts: true,
      desiredCapabilities: {
        browserName: 'chrome',
        chromeOptions: {
          args: ['headless', 'no-sandbox', 'disable-gpu']
        }
      }
    }
  }
};

To run nightwatch, I prepare the env this way

export DISPLAY=:99
export DBUS_SESSION_BUS_ADDRESS=/dev/null
Xvfb :99 -ac -shmem -screen 0 1600x1200x16 2>/dev/null 1>&2 &

chromedriver &
sleep 10

It works! Screenshots, everything

@vernak2539

This comment has been minimized.

Copy link

commented Aug 23, 2017

you shouldn't need the display and xvfb stuff if you're running in headless mode. cannot exactly add it to mine 😞 Not sure if that's what is making it work or not. It takes screenshot successfully on macOS, but I cannot get it to work on linux

@portenez

This comment has been minimized.

Copy link
Author

commented Aug 23, 2017

You need xvfb. Because you're not going to be able to set Text fields without it. I tried without Xvfb, and many things do work, but when it's time to setValue it's not going to work. After much debugging I find it.

@vernak2539 Do give it a try like that. we run hundreds of tests like this.

@saimatsumoto saimatsumoto referenced this issue Oct 24, 2017

Open

Document End-to-End testing strategy #27

8 of 8 tasks complete
@manideep1111

This comment has been minimized.

Copy link

commented Dec 13, 2017

Hi
Anyone please send sample selenium code using headless browserfunctionality...
Any sample code
Thank you!

@piehei

This comment has been minimized.

Copy link

commented Dec 13, 2017

@manideep1111 it's super easy. Already documented in a comment above by @portenez . You can also check my blog posting about it here.

@vernak2539

This comment has been minimized.

Copy link

commented Dec 14, 2017

@manideep1111 I also got it working and happened to write a post like @piehei. No xvfb required at all.

Only caveat is that it still uses selenium. I haven't had time to work out using it standalone via chromedriver only

@manideep1111

This comment has been minimized.

Copy link

commented Dec 14, 2017

Thanks @piehei and @vernak2539

@stale

This comment has been minimized.

Copy link

commented Nov 14, 2018

This issue has been automatically marked as stale because it has not had any recent activity.
If possible, please retry using the latest Nightwatch version and update the issue with any relevant details. If no further activity occurs, it will be closed. Thank you for your contribution.

@stale stale bot added the stale label Nov 14, 2018

@stale stale bot closed this Nov 21, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.