Google Lighthouse with Selenium

Integrate Web Page Performance & Accessibility audits with Functional Tests

Google Lighthouse is an open-source, automated tool for improving the quality of web pages. It can be run on any web page, public or requiring authentication. It has audits for performance, accessibility, progressive web apps, SEO and more. Lighthouse runs a series of tests on the page, and then generates a report on how well the page did. The report includes opportunities for improvement and suggestions on how to fix them.

With the power of Lighthouse, we can make our automated functional tests even more productive by integrating the two, and run automated Lighthouse audits on strategic pages which are either of high business value or slow performing.

In this article we will see how we can integrate lighthouse into our Java Selenium tests seamlessly and perform performance, accessibility and SEO audits both on authenticated and non-authenticated pages.

We will use Lighthouse Node CLI as its the most powerful and advanced way to run performance and accessibility audits. This is also recommended by the Lighthouse Team in their GitHub Page.

Step 1 : Installation

npm install -g lighthouse

Step 2 : Programmatically set chrome-debug to a port

ProcessBuilder builder = new ProcessBuilder("cmd.exe", "/c", "chrome-debug --port=9222");
builder.redirectErrorStream(true);
Process p = builder.start();

Step 3 : Launch ChromeDriver with debuggerAddress having the same port

ChromeOptions options = new ChromeOptions();
options.setExperimentalOption("debuggerAddress", "127.0.0.1:9222");
ChromeDriver driver = new ChromeDriver(options);

Step 4 : Use Selenium to navigate through the application and even authenticate where needed. So we use Selenium for the authentication instead of passing authentication details or cookies to Lighthouse. This is nicely explained in this implementation with Puppeteer.

Step 5: Before triggering Lighthouse make sure you have closed the tab that Selenium has opened. This is because Lighthouse will try to open up the same URL in a new tab and you will get an error Runtime error encountered: You probably have multiple tabs open to the same origin.

So you can do the following :

String originalWindow = driver.getWindowHandle();
driver.switchTo().newWindow(WindowType.TAB); 
String newWindow = driver.getWindowHandle();
driver.switchTo().window(originalWindow);    
driver.close();   //Close the window to avoid conflict with window opened by Lighthouse

Step 6: Programmatically trigger the Lighthouse audit on which ever page we want.

String URL = driver.getCurrentUrl();

ProcessBuilder builder = new ProcessBuilder("cmd.exe", "/c", "lighthouse", URL, "--port=9222","--preset=desktop", "--output=html", "--output-path=report.html");
builder.redirectErrorStream(true);
Process p = builder.start();

BufferedReader r = new BufferedReader(new InputStreamReader(p.getInputStream()));
String line;
while (true) {
   line = r.readLine();
     if (line == null) {
     break;
   }
  System.out.println(line);
}

Step 7 : Regain control over the browser window which was closed to continue with the Selenium flow.

You can find the entire sample code here as a GitHub gist.

On the left : Lighthouse report on the Items page. On the right : Lighthouse report on the Carts page

Voila!!! This is how we can achieve a seamless integration between Java-Selenium and Google Lighthouse to perform Performance, Accessibility, SEO audits during our functional tests.