Network interception (CDP) in Selenium Java - Test Execution Trace

Test Overview

This test uses Selenium with Chrome DevTools Protocol (CDP) to intercept network requests. It verifies that a specific API call is made and checks its response status.

Test Code - TestNG

Selenium Java

import org.openqa.selenium.By;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v114.network.Network;
import org.openqa.selenium.devtools.v114.network.model.Response;
import org.testng.Assert;
import org.testng.annotations.AfterClass;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;

import java.util.Optional;
import java.util.concurrent.atomic.AtomicBoolean;

public class NetworkInterceptionTest {
    private ChromeDriver driver;
    private DevTools devTools;
    private AtomicBoolean apiCallMade;

    @BeforeClass
    public void setUp() {
        driver = new ChromeDriver();
        devTools = driver.getDevTools();
        devTools.createSession();
        apiCallMade = new AtomicBoolean(false);

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

        devTools.addListener(Network.responseReceived(), responseReceived -> {
            Response response = responseReceived.getResponse();
            if (response.getUrl().contains("/api/data")) {
                if (response.getStatus() == 200) {
                    apiCallMade.set(true);
                }
            }
        });
    }

    @Test
    public void testApiCallIsMade() {
        driver.get("https://example.com");
        driver.findElement(By.id("loadDataBtn")).click();

        // Wait briefly to allow network events to be captured
        try {
            Thread.sleep(2000);
        } catch (InterruptedException e) {
            Thread.currentThread().interrupt();
        }

        Assert.assertTrue(apiCallMade.get(), "Expected API call to /api/data was not made or did not return 200 status.");
    }

    @AfterClass
    public void tearDown() {
        if (driver != null) {
            driver.quit();
        }
    }
}

Execution Trace - 6 Steps

Step	Action	System State	Assertion	Result
1	Test starts and ChromeDriver launches browser	Browser window opens with DevTools session created and network interception enabled	—	PASS
2	Navigates to https://example.com	Page loads with a button having id 'loadDataBtn' visible	—	PASS
3	Finds element with id 'loadDataBtn' and clicks it	Button clicked, triggering network requests	—	PASS
4	Waits 2 seconds to capture network events	Network events captured including response for /api/data	Checks if response for /api/data has status 200	PASS
5	Asserts that API call to /api/data was made and returned 200	Assertion verifies apiCallMade is true	Assert.assertTrue(apiCallMade.get())	PASS
6	Test ends and browser closes	Browser window closes	—	PASS

Failure Scenario

Failing Condition: The API call to /api/data is not made or returns a status other than 200

Execution Trace Quiz - 3 Questions

What does the test verify about the network request?

A That the button with id 'loadDataBtn' is visible

B That the API call to /api/data is made and returns status 200

C That the page title contains 'Example'

D That the browser window opens successfully

Key Result

Using Chrome DevTools Protocol (CDP) with Selenium allows you to monitor and verify network requests directly, which is useful for testing API calls triggered by UI actions.

Practice

1. What is the main purpose of using Network Interception with Selenium DevTools Protocol (CDP)?

easy

A. To replace Selenium WebDriver with a faster browser engine

B. To speed up test execution by skipping UI rendering

C. To monitor and control network requests and responses during tests

D. To automatically generate test data from network traffic

Solution

1. Step 1: Understand Network Interception

   Network interception allows tests to watch and manipulate network traffic between the browser and server.

2. Step 2: Identify the purpose in Selenium CDP context

   Selenium's DevTools Protocol integration enables listening to and controlling network events during tests.

3. Final Answer:

   To monitor and control network requests and responses during tests -> Option C

4. Quick Check:

   Network interception = monitor and control traffic [OK]

Hint: Network interception means watching and controlling web traffic [OK]

Common Mistakes:

• Thinking it speeds up tests by skipping UI
• Confusing it with test data generation
• Assuming it replaces WebDriver

2. Which Java code snippet correctly creates a DevTools session to enable network interception in Selenium 4+?

easy

A. DevTools devTools = driver.getDevTools(); devTools.startSession(); Network.enable();

B. DevTools devTools = new DevTools(); devTools.startSession(); devTools.enableNetwork();

C. DevTools devTools = driver.createDevTools(); devTools.start(); Network.enable();

D. DevTools devTools = driver.getDevTools(); devTools.createSession(); devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));

Solution

1. Step 1: Check correct DevTools session creation

   In Selenium 4+, use driver.getDevTools() and then createSession() to start.

2. Step 2: Verify enabling network interception

   Use devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty())) to enable network events.

3. Final Answer:

   DevTools devTools = driver.getDevTools(); devTools.createSession(); devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty())); -> Option D

4. Quick Check:

   Use getDevTools(), createSession(), then send Network.enable [OK]

Hint: Use driver.getDevTools() then createSession() before enabling network [OK]

Common Mistakes:

• Trying to instantiate DevTools with new keyword
• Calling Network.enable() without devTools.send()
• Missing createSession() call

3. Given the following code snippet, what will be printed when a network request is intercepted?

DevTools devTools = driver.getDevTools();
devTools.createSession();
devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));
devTools.addListener(Network.requestWillBeSent(), request -> {
    System.out.println("Request URL: " + request.getRequest().getUrl());
});
// Browser navigates to https://example.com

medium

A. Request URL: https://example.com/

B. Request URL: null

C. No output because listener is not added correctly

D. Compilation error due to missing imports

Solution

1. Step 1: Understand listener setup

   The listener is added to Network.requestWillBeSent event, printing the URL of each request.

2. Step 2: Predict output on navigating to example.com

   When browser navigates, a request is sent to https://example.com/, triggering the listener and printing the URL.

3. Final Answer:

   Request URL: https://example.com/ -> Option A

4. Quick Check:

   Listener prints request URL on navigation [OK]

Hint: Listener prints URL of each request sent during navigation [OK]

Common Mistakes:

• Assuming listener won't trigger without explicit start
• Expecting null URL in request
• Thinking listener setup is incorrect

4. Identify the error in this Selenium Java code snippet for blocking image requests using CDP:

DevTools devTools = driver.getDevTools();
devTools.createSession();
devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));
devTools.addListener(Network.requestWillBeSent(), request -> {
    if(request.getRequest().getUrl().endsWith(".png")) {
        devTools.send(Network.setBlockedURLs(List.of(request.getRequest().getUrl())));
    }
});

medium

A. Calling setBlockedURLs inside the listener causes repeated blocking calls

B. Missing call to devTools.createSession() before enabling network

C. Using endsWith(".png") is invalid for URL filtering

D. Network.enable() should not be called with Optional.empty()

Solution

1. Step 1: Analyze listener behavior

   The listener calls setBlockedURLs every time a request ends with .png, causing repeated calls.

2. Step 2: Understand correct usage of setBlockedURLs

   setBlockedURLs should be called once with all URLs to block, not repeatedly inside the listener.

3. Final Answer:

   Calling setBlockedURLs inside the listener causes repeated blocking calls -> Option A

4. Quick Check:

   setBlockedURLs called repeatedly inside listener is wrong [OK]

Hint: Call setBlockedURLs once, not inside each request event [OK]

Common Mistakes:

• Calling setBlockedURLs repeatedly inside listener
• Forgetting to create session before enabling network
• Misusing string methods for URL filtering

5. You want to modify the response body of a JSON API call during a Selenium test using CDP. Which approach correctly achieves this?

hard

A. Use Network.requestWillBeSent to change the request URL to a local JSON file

B. Enable Network.requestIntercepted event, fetch response body, modify it, then use Network.continueInterceptedRequest with modified body

C. Call Network.setBlockedURLs to block the API call and serve a local file instead

D. Modify the DOM after page load to replace JSON data

Solution

1. Step 1: Understand response modification with CDP

   To modify a response, intercept it, get the body, change it, and continue with the new content.

2. Step 2: Identify correct event and method usage

   Use Network.requestIntercepted to detect response, fetch body, then Network.continueInterceptedRequest to send modified response.

3. Final Answer:

   Enable Network.requestIntercepted event, fetch response body, modify it, then use Network.continueInterceptedRequest with modified body -> Option B

4. Quick Check:

   Modify response by intercepting and continuing with new body [OK]

Hint: Intercept response, modify body, then continue intercepted request [OK]

Common Mistakes:

• Trying to modify request instead of response
• Blocking URL instead of modifying response
• Changing DOM instead of network response