Headless Browser Testing

Headless Browser testing

What is Headless Browser testing

Headless browser testing is type of browser testing without the head, meaning presence of any browser GUI. We can access webpage without showing the users that scripts are running in the backend.

Why Headless browser Testing?

Headless browser testing is a useful approach and can be used for the following benefits:

Performance

Headless browser testing is faster than real browsers since they do not come with all the overhead of starting up a browser GUI, and this equates to quicker results for your tests.

Automation

Webpage interactions can be automated such as form submissions, keyboard inputs, mouse clicks, etc. You can also run automated tests for JavaScript libraries. Headless browser testing can enable up-to-date automated tests in a browser environment.

Layout Testing

Headless browser testing can facilitate a lot of layout checks like test style elements such as page layouts (e.g. determining the default width of the page, the coordinates of where an element is), colour selection for any elements, font used, etc. You can even automate screen captures for layout checks.

Data Extraction

It is much easier and quicker to navigate to a website heedlessly, scrape for data, and use the results to test multiple webpages as part of a quality control effort.

Looks impressive, isn’t. However, we must also consider the constraints and limitations of using headless browser testing.

  • Debugging is very difficult in headless browser testing.
  • It can be limiting, if you want to test on the full variety of browser and OS combination to ensure coverage.
  • It can be limiting, when performing full UI tests, as it won’t interact with the browser the way your users would. 

Do, all browsers support headless testing? Here is a list.

Browsers supporting headless testing

              Some of the important headless browsers are listed below:

  • PhantomJS 
  • Headless Chrome
  • Headless Firefox
  • Splash
  • Selenium WebDriver
  • Nightmare
  • HtmlUnit
  • CasperJS        
  • Puppeteer

PhantomJS

 PhantomJS is a headless WebKit scriptable with a JavaScript API. It has fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG.

Following script can be used to use PhantomJS with Selenium:

DesiredCapabilities capabilities = new DesiredCapabilities (); capabilities.setCapability(PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY, “drivers/phantomjs.exe”);                                           

WebDriver driver = new PhantomJSDriver(capabilities);

HTMLUnitDriver

HTML Unit Driver is the lightest weight and fastest implementation headless browser for of WebDriver. It is based on HtmlUnit. It is known as Headless Browser Driver. It is same as Chrome, IE, or Firefox driver, but it does not have GUI so one cannot see the test execution on screen.

To use it in Chrome and Firefox:

Using Google Chrome:

System.setProperty(“webdriver. chrome. driver”, “drivers/chromedriver.exe”);

ChromeOptions options = new ChromeOptions ();

options. addArguments(“headless”);

WebDriver driver = new ChromeDriver(options);

driver.get(“http://pragmatictestlabs.com”);

Using Firefox:

 FirefoxBinary firefoxBinary = new FirefoxBinary ();

firefoxBinary.addCommandLineOptions(“–headless”);

System.setProperty(“webdriver. gecko. driver”, “drivers/geckodriver.exe”);

FirefoxOptions firefoxOptions = new FirefoxOptions ();

firefoxOptions.setBinary(firefoxBinary);

FirefoxDriver driver = new FirefoxDriver(firefoxOptions);

How to conduct tests if you are behind a proxy?

If you are behind a proxy server additional configuration has to be done along with the headless browser configuration.

HTMLUnitDriver

HtmlUnitDriver driver = new HtmlUnitDriver();
Proxy proxy = new Proxy();
proxy. setHttpProxy(“PROXY_HOST, PROXY_PORT”);
driver.setProxySettings(proxy);

PhanthomJSDriver

ArrayList cliArgsCap = new ArrayList();
cliArgsCap.add(“–proxy=127.0.0.1:1024”);
cliArgsCap.add(“–proxy-type=socks5”);
DesiredCapabilities caps = new DesiredCapabilities();
caps.setJavascriptEnabled(true);
caps.setCapability(“takesScreenshot”, true);
caps.setCapability(“screen-resolution”, “1280×1024”);
caps.setCapability(PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY, “C:\phantomjs.exe”);
caps.setCapability(PhantomJSDriverService.PHANTOMJS_CLI_ARGS, cliArgsCap);
driver = new PhantomJSDriver(caps);

Conclusion

Automated headless browser testing is great for when you need fast feedback on components of your application. They are quick to set up, and can ensure that snippets of code are working with the end-to-end experience. 

About Techcanvass

Techcanvass is an IIBA endorsed education provider (EEP), iSQI ATP (for Certified Agile Business Analyst Training) as well as Agile Testing alliance partner for CP-SAT certification training in Selenium.

Techcanvass offers wide range of automation testing courses. These courses include Java and Selenium certification coursePython Selenium Certification courseBDD Training with CucumberRPA Training with UiPathDevOps certification course and more automation testing courses.

Selenium Certification Training