Performance metrics via DevTools in Selenium Java - Build an Automation Script

Measure page load performance metrics using Chrome DevTools Protocol in Selenium

Preconditions (3)

Step 1: Launch Chrome browser with Selenium WebDriver

Step 2: Enable Chrome DevTools Protocol (CDP) session

Step 3: Navigate to the URL 'https://example.com'

Step 4: Use CDP to collect performance metrics after page load

Step 5: Extract metrics such as First Contentful Paint, DOMContentLoaded, and Load event

Step 6: Verify that these metrics are present and have reasonable numeric values

✅ Expected Result: Performance metrics are successfully collected via DevTools and contain valid numeric values indicating page load timings.

Automation Requirements - Selenium WebDriver with Chrome DevTools Protocol (CDP) support in Java

Assertions Needed:

Assert that performance metrics map contains keys for 'FirstContentfulPaint', 'DomContentLoaded', and 'LoadEvent'

Assert that the metric values are greater than zero

Best Practices:

Use Chrome DevTools Protocol commands via Selenium's DevTools interface

Use explicit waits to ensure page load is complete before collecting metrics

Use meaningful assertions to validate metric presence and values

Close browser session properly after test

Automated Solution

Selenium Java

import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v115.performance.Performance;
import org.openqa.selenium.devtools.v115.performance.model.Metric;
import org.openqa.selenium.devtools.v115.page.Page;
import org.openqa.selenium.devtools.v115.page.model.LifecycleEvent;
import org.openqa.selenium.support.ui.WebDriverWait;
import org.openqa.selenium.support.ui.ExpectedCondition;
import java.time.Duration;
import java.util.List;
import java.util.Map;
import java.util.stream.Collectors;

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

        ChromeOptions options = new ChromeOptions();
        ChromeDriver driver = new ChromeDriver(options);

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

        // Enable performance domain
        devTools.send(Performance.enable());

        // Navigate to the page
        driver.get("https://example.com");

        // Wait for load event fired
        WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
        wait.until(webDriver -> {
            List<LifecycleEvent> lifecycleEvents = devTools.send(Page.getLifecycleEvents());
            return lifecycleEvents.stream().anyMatch(e -> e.getName().equals("load"));
        });

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

        // Convert list to map for easy lookup
        Map<String, Double> metricsMap = metrics.stream()
                .collect(Collectors.toMap(Metric::getName, Metric::getValue));

        // Assertions
        if (!metricsMap.containsKey("FirstContentfulPaint")) {
            throw new AssertionError("Missing FirstContentfulPaint metric");
        }
        if (!metricsMap.containsKey("DomContentLoaded")) {
            throw new AssertionError("Missing DomContentLoaded metric");
        }
        if (!metricsMap.containsKey("LoadEvent")) {
            throw new AssertionError("Missing LoadEvent metric");
        }

        if (metricsMap.get("FirstContentfulPaint") <= 0) {
            throw new AssertionError("FirstContentfulPaint metric value is not greater than zero");
        }
        if (metricsMap.get("DomContentLoaded") <= 0) {
            throw new AssertionError("DomContentLoaded metric value is not greater than zero");
        }
        if (metricsMap.get("LoadEvent") <= 0) {
            throw new AssertionError("LoadEvent metric value is not greater than zero");
        }

        System.out.println("Performance metrics collected successfully:");
        System.out.println(metricsMap);

        driver.quit();
    }
}

This Java Selenium test uses ChromeDriver and the Chrome DevTools Protocol (CDP) to collect performance metrics.

First, it sets up ChromeDriver and creates a DevTools session.

It enables the Performance domain to access performance metrics.

Then it navigates to the target URL and waits explicitly for the page load event to ensure the page is fully loaded.

After that, it collects the performance metrics and converts them into a map for easy access.

The test asserts that key metrics like FirstContentfulPaint, DomContentLoaded, and LoadEvent exist and have values greater than zero, indicating valid timings.

Finally, it prints the metrics and closes the browser.

This approach uses explicit waits and CDP commands properly, following best practices for reliable and maintainable test automation.

Common Mistakes - 4 Pitfalls

Not enabling the Performance domain before requesting metrics

Using Thread.sleep() instead of explicit waits for page load

Not checking if metrics keys exist before accessing values

Hardcoding chromedriver path without flexibility

Bonus Challenge

Now add data-driven testing to collect performance metrics for three different URLs: 'https://example.com', 'https://wikipedia.org', and 'https://github.com'.

Show Hint

Practice

1. What is the main purpose of using DevTools performance metrics in Selenium Java tests?

easy

A. To handle browser alerts automatically

B. To locate elements on the web page

C. To take screenshots during test execution

D. To measure page load speed and browser performance

Solution

1. Step 1: Understand DevTools role in Selenium

   DevTools integration allows Selenium to collect browser performance data like load times.

2. Step 2: Identify the purpose of performance metrics

   Performance metrics help measure page speed and resource usage to improve user experience.

3. Final Answer:

   To measure page load speed and browser performance -> Option D

4. Quick Check:

   Performance metrics = page speed measurement [OK]

Hint: Performance metrics measure speed, not element location [OK]

Common Mistakes:

• Confusing performance metrics with element locators
• Thinking DevTools handles alerts
• Assuming screenshots are related to performance

2. Which Java code snippet correctly enables performance monitoring using DevTools in Selenium?

easy

A. devTools.send(Performance.enable());

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

C. driver.manage().timeouts().pageLoadTimeout(Duration.ofSeconds(10));

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

Solution

1. Step 1: Identify the correct DevTools command for performance

   The Performance domain in DevTools is enabled by calling Performance.enable().

2. Step 2: Check other options for correctness

   devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty())); enables Network, not Performance. driver.manage().timeouts().pageLoadTimeout(Duration.ofSeconds(10)); sets timeout, and B loads a page.

3. Final Answer:

   devTools.send(Performance.enable()); -> Option A

4. Quick Check:

   Enable performance with Performance.enable() [OK]

Hint: Use Performance.enable() to start performance monitoring [OK]

Common Mistakes:

• Using Network.enable() instead of Performance.enable()
• Confusing timeout settings with performance enabling
• Calling driver.get() instead of enabling metrics

3. Given the following code snippet, what will be the output type of metrics.getMetrics()?

DevTools devTools = driver.getDevTools();
devTools.createSession();
devTools.send(Performance.enable());
PerformanceMetrics metrics = devTools.send(Performance.getMetrics());
System.out.println(metrics.getMetrics().get(0).getName());

medium

A. A boolean indicating if metrics are enabled

B. An integer value of the first metric

C. A String representing the name of the first performance metric

D. A list of WebElement objects

Solution

1. Step 1: Understand Performance.getMetrics() return type

   It returns a PerformanceMetrics object containing a list of Metric objects, each with a name and value.

2. Step 2: Analyze metrics.getMetrics().get(0).getName()

   This accesses the first Metric's name, which is a String describing the metric.

3. Final Answer:

   A String representing the name of the first performance metric -> Option C

4. Quick Check:

   getName() returns String metric name [OK]

Hint: getName() returns metric name as String, not value [OK]

Common Mistakes:

• Assuming getName() returns a number
• Confusing metrics with WebElements
• Expecting a boolean from getMetrics()

4. Identify the error in this Selenium Java code snippet that tries to enable performance metrics:

DevTools devTools = driver.getDevTools();
devTools.send(Performance.enable());
devTools.createSession();

medium

A. Performance.enable() requires parameters

B. createSession() must be called before sending commands

C. DevTools cannot be used with ChromeDriver

D. No error, code is correct

Solution

1. Step 1: Check the order of DevTools commands

   Session must be created before sending any DevTools commands like Performance.enable().

2. Step 2: Verify method usage

   Calling Performance.enable() before createSession() causes an error because no session exists yet.

3. Final Answer:

   createSession() must be called before sending commands -> Option B

4. Quick Check:

   Call createSession() first, then enable performance [OK]

Hint: Always createSession() before sending DevTools commands [OK]

Common Mistakes:

• Calling enable() before createSession()
• Thinking Performance.enable() needs parameters
• Assuming DevTools is unsupported in ChromeDriver

5. You want to measure the page load time using Selenium Java and DevTools. Which approach correctly captures the 'DomContentLoaded' metric after page load?

hard

A. Enable performance, load page, then get metrics and filter for 'DomContentLoaded'

B. Load page first, then enable performance and get metrics immediately

C. Enable performance, get metrics before loading page, then load page

D. Only use driver.manage().timeouts().pageLoadTimeout() to measure load time

Solution

1. Step 1: Enable performance monitoring before page load

   Performance must be enabled before loading the page to capture all metrics during load.

2. Step 2: Load the page and then retrieve metrics filtering for 'DomContentLoaded'

   After page load, get metrics and select the 'DomContentLoaded' metric to measure load time.

3. Final Answer:

   Enable performance, load page, then get metrics and filter for 'DomContentLoaded' -> Option A

4. Quick Check:

   Enable first, load page, then get metrics [OK]

Hint: Enable before load, get metrics after load for accurate timing [OK]

Common Mistakes:

• Enabling performance after page load misses metrics
• Getting metrics before loading page
• Relying only on timeout settings for load time