Leveraging the Power of DevTools Using Selenium and Java

As test automation engineers, we constantly seek ways to enhance our test automation scripts, making them more robust, efficient, and capable of interacting with web applications in more sophisticated ways. One such powerful tool at our disposal is the Chrome DevTools Protocol (CDP). By leveraging DevTools in combination with Selenium and Java, we can access advanced features such as network interception, console logging, and performance metrics, providing deeper insights into our web applications. In this blog, we will explore how to utilize DevTools using Selenium with Java and include some practical code snippets.

What is Chrome DevTools Protocol?

Chrome DevTools Protocol (CDP) is a set of tools provided by Google Chrome that allows developers to interact with, inspect, and debug web applications. CDP can be used to perform various actions such as capturing network traffic, accessing console logs, and taking performance metrics. By integrating CDP with Selenium, we can extend the capabilities of our automation scripts beyond typical browser interactions.

Setting Up Selenium with CDP in Java

To start using CDP with Selenium in Java, you need to install the necessary dependencies and configure the ChromeDriver to use DevTools.

Step 1: Install Selenium WebDriver and ChromeDriver

First, ensure that you have the Selenium WebDriver and ChromeDriver packages installed in your Java project. You can add the following dependencies in your Maven pom.xml:

<dependency>
    <groupId>org.seleniumhq.selenium</groupId>
    <artifactId>selenium-java</artifactId>
    <version>4.x.x</version>
</dependency>
<dependency>
    <groupId>org.seleniumhq.selenium</groupId>
    <artifactId>selenium-chrome-driver</artifactId>
    <version>4.x.x</version>
</dependency>

Step 2: Enable DevTools in ChromeDriver

You can enable DevTools by creating an instance of the ChromeDriver with specific DevTools options.

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

public class DevToolsExample {
    public static void main(String[] args) {
        System.setProperty("webdriver.chrome.driver", "path/to/chromedriver");

        ChromeOptions options = new ChromeOptions();
        options.addArguments("--auto-open-devtools-for-tabs");

        WebDriver driver = new ChromeDriver(options);

        // Navigate to a website
        driver.get("https://example.com");
    }
}

Using DevTools for Network Interception

One of the powerful features of DevTools is network interception. You can capture and manipulate network requests and responses. Here’s how to intercept network requests using DevTools.

import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v110.network.Network;

public class NetworkInterceptionExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));

        devTools.addListener(Network.requestWillBeSent(), request -> {
            System.out.println("Request: " + request.getRequest().getUrl());
        });

        devTools.addListener(Network.responseReceived(), response -> {
            System.out.println("Response: " + response.getResponse().getStatus() + " " + response.getResponse().getUrl());
        });

        driver.get("https://example.com");
    }
}

Accessing Console Logs

Another useful feature is accessing console logs. This can help in debugging JavaScript errors or capturing specific log messages.

import org.openqa.selenium.devtools.v110.log.Log;

public class ConsoleLogsExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Log.enable());

        devTools.addListener(Log.entryAdded(), logEntry -> {
            System.out.println("Log: " + logEntry.getLevel() + " " + logEntry.getText());
        });

        driver.get("https://example.com");
    }
}

Capturing Performance Metrics

You can also use DevTools to capture performance metrics, which can be useful for performance testing and optimization.

import org.openqa.selenium.devtools.v110.performance.Performance;

public class PerformanceMetricsExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Performance.enable(Optional.empty()));

        List<Metric> metrics = devTools.send(Performance.getMetrics()).getMetrics();

        for (Metric metric : metrics) {
            System.out.println(metric.getName() + ": " + metric.getValue());
        }

        driver.get("https://example.com");
    }
}

Throttling Network Conditions

Simulating different network conditions can help test how your web application performs under various network scenarios, such as slow connections or offline mode.

import org.openqa.selenium.devtools.v110.network.model.ConnectionType;

public class NetworkThrottlingExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));

        devTools.send(Network.emulateNetworkConditions(
            false, 
            100, // 100 ms latency
            50000, // 50 kbps download speed
            50000, // 50 kbps upload speed,
            Optional.of(ConnectionType.CELLULAR2G)
        ));

        driver.get("https://example.com");
    }
}

Blocking Specific URLs

You can block specific URLs, such as third-party scripts or ads, to see how your application behaves without them.

public class URLBlockingExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));

        devTools.addListener(Network.requestWillBeSent(), request -> {
            if (request.getRequest().getUrl().contains("ads.com")) {
                devTools.send(Network.failRequest(request.getRequestId(), ErrorReason.BLOCKED_BY_CLIENT));
            }
        });

        driver.get("https://example.com");
    }
}

Handling JavaScript Dialogs

You can use DevTools to handle JavaScript alerts, confirms, and prompts programmatically.

import org.openqa.selenium.devtools.v110.page.Page;

public class JavaScriptDialogsExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Page.enable());

        devTools.addListener(Page.javascriptDialogOpening(), dialog -> {
            System.out.println("Dialog message: " + dialog.getMessage());

            devTools.send(Page.handleJavaScriptDialog(true, Optional.of("Some input"))); // Optional: only needed for prompts
        });

        driver.get("https://example.com");
    }
}

Retrieving Browser Cookies

You can retrieve cookies from the browser using DevTools, which can be useful for managing sessions or verifying authentication.

public class BrowserCookiesExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));

        List<Cookie> cookies = devTools.send(Network.getCookies());

        for (Cookie cookie : cookies) {
            System.out.println("Cookie: " + cookie.getName() + " = " + cookie.getValue());
        }

        driver.get("https://example.com");
    }
}

Modifying User Agent

You can change the user agent to test how your application responds to different devices or browsers.

public class UserAgentExample {
    public static void main(String[] args) {
        WebDriver driver = new ChromeDriver();

        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();

        devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));

        devTools.send(Network.setUserAgentOverride(
            "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36",
            Optional.empty(),
            Optional.empty(),
            Optional.empty()
        ));

        driver.get("https://example.com");
    }
}

Conclusion

These examples demonstrate the versatility and power of using Chrome DevTools Protocol with Selenium and Java. By integrating these techniques into your test automation framework, you can create more robust, comprehensive, and realistic test scenarios, thereby ensuring better coverage and reliability of your web applications. Explore these features and see how they can enhance your automation efforts. Happy testing!