Headless Browser Testing in Chrome

Any time that you are doing UI automation, regardless of the platform or tool, one of the biggest pain points that you typically run into is having to drop everything when a test is running. Being forced to watch as a spectator while the automation is flying through your scripts is pretty awesome, but also results in a lot of downtime (and there is only so much coffee one can consume…). Turns out, both Chrome and Firefox can run in a headless mode!

Going Headless

For the purpose of this article, I am going to use Provar as the automation tool of reference, but the browser options referenced apply no matter what your tool is.

Out of the box, Provar supports the testing of different browser options in both Chrome and Firefox (Firefox support was added as of Provar 1.9.6). In addition to enabling the ability to execute tests in a headless fashion, these options can be quite useful for other things as well, such as testing internationalization (which I will be covering in another post coming soon!).

In general Provar supports any applicable Chrome or Firefox browser preference. Refer to Chromium Command Line Switches for more information on Chrome options. For a full list of Firefox browser preferences and their syntax, refer to MozillaZine’s article on about:config entries or access this from the browser itself by entering ‘about:config’ in the URL bar.

Provar Setup

To test different browser options in Chrome and Firefox, start by adding an corresponding environment variable in Provar Desktop.

To add this environment variable, navigate to the Test Settings view and click the on the Variables subtab. Add a new Variable by clicking the ‘+’ (New) icon:

On the Variable details screen, you will then enter a name for the variable. This should be _chromeOptions if you are defining a Chrome browser preference or  _FirefoxProfilePrefs if you are defining a Firefox browser preference.

Once you have set the Variable Name, you can carry on to the example below to configure the variable for running Chrome headlessly.

Making Chrome Run Headlessly

On the edit Variable screen for your _chromeOptions variable, set the the Default Value to ‘–headless’:

headless variable details screen

Click the ‘OK’ button to save this change. You should now see the following on the Variables tab of Test Settings:

headless variable tab in test settings

Now that we have Chrome set to run headlessly, it’s time to test these settings. Start by making sure that the Web Browser is set to Chrome in the top-right of Provar Desktop:

browser selection in provar

Once this is configured, click the ‘Run’ or ‘Debug’ button to execute tests as usual. This time however, we will be running without actually launching the Chrome browser:

test runner console running in headless mode

One thing to note: If you are running in Provar’s Test Builder mode, Chrome will ignore any headless settings and launch Chrome browser as usual, along with the Test Builder:

test builder mode ignoring headless mode

In addition, if you are running your tests using ANT, Chrome should also be specified in order to make sure that these settings are applied:

ant settings for headless

For additional information regarding ANT configuration in Provar, you can refer to Provar’s ANT Task Parameters help page to see the full list of Provar/ANT config options.

If there are other browser options you are using in addition to headless mode, additional preferences can be added to the _chromeOptions variable using a comma-separated list.

Next Steps

As you can see, there is a lot of flexibility you can get by using the various browser options, and I will be exploring some of those in future blog posts. The other thing that is important to note is that this isn’t a Provar specific feature, but rather a part of the web standards that we here at Provar Testing fully embrace and support.