What Is Headless Browser And Headless Browser Testing

This tutorial Explains what is a Headless Browser, its Advantages, Examples & Headless Browser Testing with Selenium. You will also learn about HtmlUnitDrvier:

Over the past few years, we have seen the web being evolved from simple to highly advanced websites built with beautiful UI. In short, nowadays JavaScript controls the web extremely well so that it can handle almost every interaction on websites.

Today, we can see the Browsers are so efficient that they can easily understand how to process JavaScript. In co-ordination with JavaScript, a Browser is taken care of programmatically. Headless Browsers are being considered very useful for Web Browser Testing as they improve our efforts.

Headless Browsers and Headless Browser Testing

What Is A Headless Browser?

Headless – Oh Yes, you read it right. Headless, means a Web Browser without User Interface. To elaborate, Headless Browsers are those which actually access the Web Page, but the GUI is hidden from the user.

Further reading =>> Top Internet Browsers for PC

A headless browser is just like any other browser, the only difference is we cannot see anything on the screen. Here we can say that the program actually runs in the backend and nothing can be viewed on the screen. Thus, it is known to be the one without a Head/GUI.

Just like a normal browser a Headless Browser performs all the functions like clicking links, navigating pages, downloading the document, uploading a document, etc. by performing all the instructions as per our program.

A normal browser would proceed with each step of the program with a GUI presentation, whereas for a Headless Browser all the steps of the program are carried out sequentially and correctly and we can keep a track of it with the help of a Console or command-line interface.

Advantages Of Headless Browser

#1) Headless Browsers are used when the machine has no GUI, that is while using Linux (an OS without GUI) is executed via the command-line interface and actually has no interface to display.

#2) Also, these can be used in a case where there is no need to view anything and our purpose is just to ensure that all tests are getting executed successfully line by line.

#3) When there is a need for executing parallel tests, UI based browsers consume a lot of memory and/or resources. Hence, here Headless browser is preferred to use.

#4) If we want to perform Regression Testing for the next coming releases with continuous Integration and we are done with the Cross Browser Testing, then Headless browser testing can be used.

#5) If we wish to simulate multiple browsers on a single machine or running test cases just for data creation, then we use Headless Browsers.

#6) When compared to Real Browsers, Headless Browsers are faster. So, these are chosen for faster execution.

Disadvantages Of Headless Browser

#1) Although Headless Browsers are very fast, still there are some disadvantages as well. Due to its faster page loading ability, sometimes it is difficult to debug the issues.

#2) Real Browser Testing includes performing test cases in the presence of GUI. Also, these tests are performed in front of the user, hence the user can interact with the team, referring the GUI and discuss where ever changes or corrections are required. In such a case, Headless Browsers cannot be used.

#3) As Headless Browsers don’t represent GUI, it is troublesome to report errors with the help of screenshots. A Real Browser helps to present the defects by generating screenshots as screenshots are a must in testing.

#4) In the case where a lot of browser debugging is required, the use of Headless Browsers can be challenging.

Examples Of Headless Browsers

There are various Headless Browsers available.

Enlisted below are some examples:

  • Html Unit Browsers
  • Firefox
  • Chrome
  • PhantomJS
  • Zombie.js
  • TrifleJS
  • SlimerJS
  • Splash
  • SimpleBrowser
  • NodeJS

Headless Testing With Selenium

VatsaSolutions

Selenium is a free, open-source testing tool. It is a quite well known and efficient automation tool for performing automation tests.

Selenium allows us to write test scripts in various languages like Java, Python, C#, Ruby, Perl, Scala, etc. by supporting numerous browsers like Firefox, Chrome, Internet Explorer, Opera, Safari, etc. and is capable to run on Windows, Linux, and macOS.

Selenium Webdriver provides good support to dynamic web pages, where various web elements change without the page itself being reloaded.

Headless Chrome And Firefox

Both Firefox, as well as Chrome Browsers, support Headless automation testing which is an implementation of the code in Firefox and Chrome without GUI.

Headless Firefox Example

Headless Firefox provides support for versions starting 56 and is available on Windows, Linux, and macOS. We need to download the geckodriver.exe file of the latest version of Firefox and ensure that the version we will be using is greater than the minimum supported version. Firefox runs in headless mode via the headless() method.

Let’s see the code for Firefox Browser in Headless mode:

package headless_testing;

import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;

public class HeadlessFirefox {

	public static void main(String[] args) {
		// TODO Auto-generated method stub

		System.setProperty("webdriver.gecko.driver"," E://Selenium/latest firefox exe/geckodriver.exe");
		
		FirefoxOptions options = new FirefoxOptions();
		options.setHeadless(true);
		
		WebDriver driver = new FirefoxDriver(options);

		driver.get("www.google.com/");
		System.out.println("Executing Firefox Driver in Headless mode..\n");

		System.out.println(">> Page Title : "+driver.getTitle());
             System.out.println(">> Page URL  : "+driver.getCurrentUrl());
	}

}

On executing the above code for Firefox Browser in Headless mode, the title of the Page and its URL are displayed. The code is executed in Headless mode and can be tracked on the Console.

Firefox Driver output

Just like Headless Firefox is supported by Selenium, it runs on SlimmerJS and W3C WebDrier as well.

Headless Chrome Example

Headless Chrome provides support for Chrome versions 60 onwards and is available for Windows, Linux, and macOS. We need to download the .exe file of the latest version of the Chrome browser.

Given below is the syntax for using Chrome in Headless mode:

ChromeOptions options = new ChromeOptions();
options.addArguments(“--headless”); OR options.setHeadless(true);

Let’s see the code for Chrome Browser in Headless mode:

package headless_testing;

import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;

public class HeadlessChrome {

	public static void main(String[] args) {
		// TODO Auto-generated method stub

		System.setProperty("webdriver.chrome.driver","E://Selenium/latest chrome exe/chromedriver.exe");
		
		ChromeOptions options = new ChromeOptions();
		options.addArguments("--headless");
		
		WebDriver driver = new ChromeDriver(options);
	
		driver.get("www.google.com/");
		System.out.println("Executing Chrome Driver in Headless mode..\n");

		System.out.println(">> Page Title : "+driver.getTitle());
		System.out.println(">> Page URL  : "+driver.getCurrentUrl());
	}
}

On executing the above code for the Chrome Browser in Headless mode, the title of the Page and its URL are displayed. The code is executed and the execution can be tracked on the Console.

Chrome Driver output

Headless HtmlUnitDriver

What Is HtmlUnitDriver?

HtmlUnitDriver is a Headless web browser written in Java. The name suggests it is a Headless driver which is based on HtmlUnit. HtmlUnitDriver is a built-in headless browser in Selenium WebDriver. It is considered to be the most lightweight and fast browsers.

Let’s move on to the implementation of the HtmlUnitDriver. The HtmlUnitDriver JAR files can be downloaded from the official website of Selenium.

HtmlUnitDriver In Headless Mode

Just like all the other browsers, for the HtmlUnitDriver as well, we need to create an object for the class to run the code in headless mode.

package headless_testing;

import org.openqa.selenium.WebDriver;
import org.openqa.selenium.htmlunit.HtmlUnitDriver;

public class HtmUnitDriver {

public static void main(String[] args) {
	// TODO Auto-generated method stub

	WebDriver driver = new HtmlUnitDriver();
	driver.get("https://www.google.com/");				

System.out.println("Executing HtmlUnitDriver in Headless mode..\n");
		
	System.out.println(">> Page Title : "+ driver.getTitle());
	System.out.println(">> Page URL   : "+ driver.getCurrentUrl());
				
	}
}

Thus on executing the above code for HtmlUnitDriver in Headless mode, the Output received displays the Title of Page and its URL. The Output is received through the Console where all the functions performed in the program can be viewed in a stepwise manner.

Given below is the screenshot of the above-executed code:

HtmlUnitDriver In Headless mode

Features/Advantages Of HtmlUnitDriver

Features of HtmlUnitDriver

[image source]

  • Provides support for HTTPS and HTTP protocols.
  • Great support for JavaScript.
  • Helps in Multitasking, thereby allowing to run multiple tests.
  • Provides support for Cookies. Also, supports Proxy Servers.
  • Improves the performance and speed of test scripts, as it has the fastest implementation of WebDriver.
  • HtmlUnitDriver is platform-independent.
  • As it is Headless by default, it supports Headless Testing.

Disadvantages Of HtmlUnitDriver

  • The use of HtmlUnitDriver is not possible for complex websites.
  • While comparing with a real browser testing, for headless browsers like HtmlUnitDriver, it becomes very difficult for debugging the script.
  • The generation of screenshots is not possible with HtmlUnitDriver.
  • Headless Browsers emulate other browsers.

Conclusion

Headless Browser testing is in fact faster, by providing great speed and efficiency but it fails to reach out for some specific features that are indeed fulfilled by a Non-Headless / Real Browsers.

Headless Browser has its own benefits while Real Browser has its own. As per the need for testing, one can choose whichever technique is preferable and beneficial to the tester.

For Example: In the case where there exists user involvement, Real Browser testing can be chosen. If there are no UI presentation requirements to perform the testing quickly, then one can go for Headless Browser testing.

More efficient testing would be the one with a combination of both Headless as well as Real Browser. Thereby overcoming the limitations of each individually.

Hope this tutorial would have clarified all your queries on Headless Browser & Headless Browser Testing!!