App & Browser Testing Made Easy

Give your users a seamless experience by testing on 3000+ real devices and browsers. Don't compromise with emulators and simulators

Home Guide Headless Browser Testing with Selenium: Tutorial

Headless Browser Testing with Selenium: Tutorial

By Sonal Dwivedi, Community Contributor -

Table of Contents

Selenium is one of the powerful web automation test suites to automate testing of web applications against browsers such as Chrome, Firefox, IE, Edge, etc. It is one of the popular web automation tools to verify functioning of websites, navigation flow check in websites, verifying page titles and to fetch huge data by web scraping. Along with all these, it offers one more amazing feature that is Headless Browser testing. Headless browser testing is nothing but running the Selenium tests on headless browsers. Headless browser is just like a real browser with no User Interface.

We all might have experienced some challenges while automating a real browser through Selenium which is slow rendering of the page and consuming screen time.

For example: Headless browsers are faster than typical browsers, as you can bypass all the time taken to load the CSS. It is more significant in saving time while running a larger number of complex test cases where multiple steps are involved. 

What is Headless Browser Testing?

Headless Browser Testing in general means an object/ thing with no head and in regards with browsers it means browser simulation which has no UI. Headless browser automation uses a web browser for end-to-end testing without loading the browser’s UI.

Headless mode is a functionality which allows the execution of a full version of the browser while controlling it programmatically. They are executed via a command-line interface or using network communication. This means it can be used in servers which have no graphics or display and still the Selenium tests run!

When the web page is not rendered on the screen and the tests are executed without UI interaction, obviously the execution gets faster as compared to real browser automation.

Why is Headless execution important?

Web automation testing on a real browser takes considerable time as the web page takes time to load the CSS, Javascript and rendering HTML pages. If your testing approach is inclined towards performance, Headless testing is the best option.

Testing comes after requirement analysis, design, and development phases in Software Development Lifecycle (SDLC). Headless browser testing is a shift-left design thinking. This means it moves testing to the left in the SDLC workflow by implementing Headless testing. Testing at the early-stage surfaces critical issues which can be fixed by the development team and thereby help them fix the issues at higher speed.

Headless browser like a real browser has access to all the webpages however one cannot visualise the web pages getting interacted unlike real browsers.

Running Selenium tests for Headless Chrome 

Chrome Driver version 59 onwards, it can be run on headless mode without full browser UI. It offers a real browser context without the memory overhead of running a full version of Chrome browser. Selenium provides ChromeOptions class to modify the default characteristics of the browser. addArguments() method of ChromeOptions helps to run the tests on headless mode by passing headless or –headless as an argument, as seen in the commands below. 

ChromeOptions options = new ChromeOptions();

options.addArguments("--headless"); 

OR

ChromeOptions options = new ChromeOptions();
options.addArguments("headless");

setHeadless() method of ChromeOptions class can also be used to accomplish the same task. Pass true as an argument to the setHeadless() method.

ChromeOptions options = new ChromeOptions();
options.setHeadless(true); 

After this pass the options as an argument when instantiating the ChromeDriver object. 

ChromeOptions options = new ChromeOptions();
options.setHeadless(true);
WebDriver driver = new ChromeDriver(options);

Steps:

Step 1: For a Maven project add the Selenium Java and TestNG dependencies in the pom.xml file and save it to download the dependencies.

<dependencies> 

<dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-java</artifactId>
<version>4.6.0</version>
</dependency>


<dependency>
<groupId>org.testng</groupId>
<artifactId>testng</artifactId>
<version>7.6.1</version>
<scope>test</scope>
</dependency>

</dependencies>

Step 2: Create a package under src/test/java and create a class as ChromeHeadless

 public class ChromeHeadless {
WebDriver driver;

@Test
public void verifyTitle() {
//WebDriverManager.chromedriver().setup();
ChromeOptions options=new ChromeOptions();
options.addArguments("headless");
driver=new ChromeDriver(options);
driver.get("https://www.browserstack.com/");
System.out.println("Title is: " +driver.getTitle());
Assert.assertEquals(driver.getTitle(), "Most Reliable App & Cross Browser Testing Platform | BrowserStack");
driver.quit();
}
}

Step 3 Right click on the class and select Run As > TestNG Test. Observe that the page title is displayed on the console which proves that the Chrome launched in headless mode.

Selenium Chrome Headless Browser Testing

Run Selenium Headless Tests on Real Devices

Running Selenium tests for Headless Firefox

Firefox browser launched its first headless browser with version 56. It works just like a Chrome headless browser. Selenium provides FirefoxOptions class to modify the default characteristics of the browser. addArguments() method of FirefoxOptions helps to run the tests on headless mode by passing –headless as an argument.

FirefoxOptions options=new FirefoxOptions();
options.addArguments("--headless");

setHeadless() method of FirefoxOptions class can also be used to accomplish the same task. Pass true as an argument to the setHeadless() method.

FirefoxOptions options = new FirefoxOptions ();
options.setHeadless(true);

After this pass the options as an argument when instantiating the FirefoxDriver object.

FirefoxOptions options = new FirefoxOptions ();
options.setHeadless(true);
WebDriver driver = new FirefoxDriver (options);

Run Selenium Headless Tests on Real Devices

For Example, 

public class FirefoxHeadless {
WebDriver driver;

@Test
public void verifyTitle() {
//WebDriverManager.chromedriver().setup();
FirefoxOptions options=new FirefoxOptions();
options.setHeadless(true);
driver=new FirefoxDriver(options);
driver.get("https://www.browserstack.com/");
System.out.println("Title is: " +driver.getTitle());
Assert.assertEquals(driver.getTitle(), "Most Reliable App & Cross Browser Testing Platform | BrowserStack");
driver.quit();
} 

}

Right click on the class and select Run As > TestNG Test. Observe that page title is displayed on the console which proves that the Firefox launched in headless mode. Also observe console logs states that “*** You are running in headless mode.”

Selenium Firefox Headless Browser Testing

Benefits of Selenium Headless Testing

Here are some of the key benefits of Selenium Headless Testing:

  1. Headless browser testing is extremely fast as compared to real browsers as it consumes fewer resources from the system that they run on.
  2. It improves test execution performance as it executes typically 2X faster than real browser testing.
  3. It is perfect for Web scraping. If there is a requirement to fetch a huge data from a webpage (Sports data, Stocks data, etc) through Selenium automation and store it any excel or database, web scraping is the best as launching of real browser to verify UI is not required and the main concern is just to get data.
  4. It helps to simulate multiple browsers on a single system without any resource overhead.
  5. It is suitable for parallel testing. UI-based browsers consume a lot of memory and resources. So, here Headless browser is the better option to use.

Limitations of Selenium Headless Testing

In additions to the several benefits discussed in previous section, here are a couple of drawbacks of Selenium Headless Testing:

  1. Debugging is not possible as you cannot visualise what is happening when a test is running in headless mode.
  2. If there is a need to observe the tests visually and report the developer about the issue with the help of Web page UI, headless mode for such testing is a bad choice.

HTMLUnit, PhantomJS, Ghost and ZombieJS are some of the popular headless drivers. In this article we are going to learn about Chrome and Firefox headless browsers and their implementation with Selenium tests. 

Conclusion

Opting for headless or non-headless depends on the web application to be tested, system on which testing would be performed and the type of testing results expected from the execution. If your application demands user interaction visualisation then headless testing is a big NO. And if it demands faster execution and performance and system resources are a concern, then you should try headless browser testing. Headless Browser testing plays a major role when performance and time are crucial.

If you are looking for a cloud-based platform to test your web application across all the latest browsers and on different browser versions, BrowserStack is the right choice! As running Selenium tests on headless mode reduces execution time and increases performance, running tests on BrowserStack speeds up the testing process as it offers 3000+ real devices and browsers to test your applications. BrowserStack leverages parallel testing and cross browser testing to give a seamless experience to their users.

Try BrowserStack Real Device Cloud for Free

Tags
Automated UI Testing Selenium Website Testing

Featured Articles

How to start with Selenium Debugging

Headless Browser Testing with NightwatchJS

Curated for all your Testing Needs

Actionable Insights, Tips, & Tutorials delivered in your Inbox
By subscribing , you agree to our Privacy Policy.
thank you illustration

Thank you for Subscribing!

Expect a curated list of guides shortly.