<\/div>\n

<\/div>\n<\/div>\n

<\/div>\n

Table of Contents<\/div>\n<\/p><\/div>\n<\/div>\n<\/div>\n

<\/div>\n

Capture Network Request in Selenium 4<\/a><\/div>\n

Capturing Network Response with CDP in Selenium 4<\/a><\/div>\n

Blocking URL using Chrome DevTools Protocol in Selenium<\/a><\/div>\n

Loading Insecure Website using CDP in Selenium 4<\/a><\/div>\n

Network Emulation and Controlling Network Speed using CDP in Selenium 4<\/a><\/div>\n

Mock API using Chrome DevTools Protocol in Selenium 4<\/a><\/div>\n<\/div>\n

<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

Selenium is a very popular automation tool, Selenium 4 has introduced many advantages which are helpful for testers. Chrome DevTools Protocol (CDP) is one of the major features which selenium has introduced recently. As the Chrome DevTools Protocol is now available with selenium 4 we can control the network on Chrome browsers.\u00a0 In this tutorial let\u2019s discuss some of the features of Network Interception<\/p>\n

\n<\/ins>\n<\/div>\n

Capture Request with Selenium 4<\/li>\n

Capture Response with Selenium 4<\/li>\n

Block Network URLs with Selenium 4<\/li>\n

Load Insecure website in Selenium 4<\/li>\n

Mock Network using Selenium 4<\/li>\n

Control Network Speed\/Emulation with Selenium4<\/li>\n<\/ul>\n
Capture Network Request in Selenium 4<\/h3>\n
Selenium 4 has introduced CDP, using CDP you get access to browser Network features. You can get access to the Network HTTP requests when you make the call to the particular domain. For example, if you type URL https:\/\/www.rahulshettyacademy.com<\/a> internally it makes requests to a lot of assets such as CSS, images, javascript, it may even call the API to load the data on the browser.<\/p>\n
To capture Network Request in Selenium 4, you need to follow below steps.<\/p>\n
The CDP features are made available in the selenium using DevTool package\/class so we need to create the instance.<\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
ChromeDriver driver = new ChromeDriver();<\/span><\/p>\n
DevTools devTool = driver.getDevTools();<\/span><\/p>\n
devTool.createSession();<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
In the above code, we care about creating driver instance first, using driver instance we are getting dev tools and then we are creating session.<\/p>\n
The DevTool provides the command send() which allows us to send the command to CDP, CDP has documented list of Chrome DevTools Protocol<\/a> command, by referring their documentation, to capture network request we need to<\/p>\n
\n
Enable<\/strong> the Network<\/li>\n
Add the Listener to requestWillBeSent <\/strong>event<\/li>\n<\/ul>\n
So the code looks like below<\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
devTool.send(Network.enable(Optional.empty(), Optional.empty(),<\/span><\/p>\n
Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.addListener(Network.requestWillBeSent(), requestSent -> {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Request URL => ” + requestSent.getRequest().getUrl());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Request Method => ” + requestSent.getRequest().getMethod());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Request Headers => ” + requestSent.getRequest().getHeaders().toString());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“————————————————-“);<\/span><\/p>\n
});<\/span><\/p>\n
Once we are done with Network capturing, we need to navigate to the URL<\/span><\/p>\n
driver.get(“https:\/\/rahulshettyacademy.com\/#\/index”);<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
Putting Everything Together<\/p>\n
Example: Capture Network Request Using CDP in Selenium 4<\/strong><\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
import java.util.Optional;<\/span><\/p>\n
import org.junit.Test;<\/span><\/p>\n
import org.openqa.selenium.chrome.ChromeDriver;<\/span><\/p>\n
import org.openqa.selenium.devtools.DevTools;<\/span><\/p>\n
import org.openqa.selenium.devtools.v94.network.Network;<\/span><\/p>\n
public class CaptureRequestSelenium {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 @Test<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 public void captureRequestSelenium() {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.setProperty(“webdriver.chrome.driver”, “path to chromedriver “);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ChromeDriver driver = new ChromeDriver();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 DevTools devTool = driver.getDevTools();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.createSession();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.addListener(Network.requestWillBeSent(), requestSent -> {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Request URL => ” + requestSent.getRequest().getUrl());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Request Method => ” + requestSent.getRequest().getMethod());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Request Headers => ” + requestSent.getRequest().getHeaders().toString());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“——————————————————“);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 });<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 driver.get(“https:\/\/rahulshettyacademy.com\/#\/index”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/span><\/p>\n
}<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
Once you Execute the above Code the Output looks like below<\/p>\n
Output : Network Request CDP Selenium 4<\/strong><\/p>\n
$\"\"$ <\/p>\n
Capturing Network Response with CDP in Selenium 4<\/h3>\n
Above we have captured network requests similarly we can capture network response, For example, if you are looking for status for API, we can get it that as well.<\/p>\n
To Capture Network response we need to do<\/p>\n
\n
Enable Network<\/li>\n
Add Listener to Network.responseReceived<\/strong> event<\/li>\n<\/ul>\n
Code Looks like below<\/p>\n
Example: Capture Network Response with Chrome DevTools Protocol in Selenium 4<\/strong><\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
import java.util.Optional;<\/span><\/p>\n
import org.junit.Test;<\/span><\/p>\n
import org.openqa.selenium.chrome.ChromeDriver;<\/span><\/p>\n
import org.openqa.selenium.devtools.DevTools;<\/span><\/p>\n
import org.openqa.selenium.devtools.v94.network.Network;<\/span><\/p>\n
public class CaptureResponseSelenium {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 @Test<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 public void captureRequstSelenium() {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.setProperty(“webdriver.chrome.driver”, “path to chromedriver”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ChromeDriver driver = new ChromeDriver();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 DevTools devTool = driver.getDevTools();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.createSession();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.addListener(Network.responseReceived(), responseReceieved -> {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Response Url => ” + responseReceieved.getResponse().getUrl());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Response Status => ” + responseReceieved.getResponse().getStatus());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Response Headers => ” + responseReceieved.getResponse().getHeaders().toString());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Response MIME Type => ” + responseReceieved.getResponse().getMimeType().toString());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“——————————————————“);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 });<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 driver.get(“http:\/\/google.com”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/span><\/p>\n
}<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
Output: Network Response CDP Selenium<\/strong><\/p>\n
$\"\"$ <\/p>\n
Blocking URL using Chrome DevTools Protocol in Selenium<\/h3>\n
Consider example, if you want to validate the website blocking all the .css files (that is website without styles), you need to block all the urls\/files which are having extensions with .css. Similarly, you might have a scenario to test blocking certain API calls. These scenarios can be tested using Chrome DevToos Protocol(CDP) in selenium 4.<\/p>\n
The Network.setBlockedURLs ()<\/strong> provides option to block the List of URLs<\/p>\n
If you want to block all the .css you can simply use<\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
devTool.send(Network.setBlockedURLs(List.of(“*.css”))); \/\/ Blocks all css<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
If you want to block a particular API or URL you can use like below<\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
devTool.send(Network.setBlockedURLs(List.of(<\/span><\/p>\n
\u00a0\u00a0\u00a0 “https:\/\/www.google.com\/images\/branding\/googlelogo\/1x\/googlelogo_color_272x92dp.png”<\/span><\/p>\n
)));<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
Example: Blocking API\/URL\/CSS in Selenium 4<\/strong><\/p>\n
Before Blocking CSS website looks like below<\/p>\n
$\"\"$ <\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
import org.junit.Test;<\/span><\/p>\n
import org.openqa.selenium.chrome.ChromeDriver;<\/span><\/p>\n
import org.openqa.selenium.devtools.DevTools;<\/span><\/p>\n
import org.openqa.selenium.devtools.v94.network.Network;<\/span><\/p>\n
public class BlockURL {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 @Test<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 public void blockUrl() {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.setProperty(“webdriver.chrome.driver”, “path to chromedriver”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ChromeDriver driver = new ChromeDriver();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 DevTools devTool = driver.getDevTools();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.createSession();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.send(Network.setBlockedURLs(List.of(“*.css”))); \/\/ Blocks all css files<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/*<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0* Block request by URL below code<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0devTool.send(Network.setBlockedURLs( List.of(<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0“https:\/\/www.google.com\/images\/branding\/googlelogo\/1x\/googlelogo_color_272x92dp.png”<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0 )));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0*\/<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.addListener(Network.loadingFailed(), loadingFailed -> {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.out.println(“Blocking reason: ” + loadingFailed.getBlockedReason().get());<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 });<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 driver.get(“https:\/\/rahulshettyacademy.com\/#\/index”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/span><\/p>\n
}<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
After Executing the above code it blocks all the styles and the Website will be loaded like below.<\/p>\n
Output : Blocking URL in Selenium with CDP<\/strong><\/p>\n
$\"\"$ <\/p>\n
Loading Insecure Website using CDP in Selenium 4<\/h3>\n
The browser usually blocks, we are trying to load the HTTPS website if the certificate has some errors. Many times, we will not be able to proceed with such website automation. CDP provides the option to ignore those certificate errors and we can load that website on the browser and test it.<\/p>\n
The setIgnoreCertificateErrors<\/strong> command in CDP can be used with Selenium 4 and we can proceed with testing.<\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
Security.setIgnoreCertificateErrors(true)<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
Example : Load Insecure webpage with CDP in Selenium 4<\/strong><\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
import org.junit.Test;<\/span><\/p>\n
import org.openqa.selenium.chrome.ChromeDriver;<\/span><\/p>\n
import org.openqa.selenium.devtools.DevTools;<\/span><\/p>\n
import org.openqa.selenium.devtools.v94.security.Security;<\/span><\/p>\n
public class InsecureWebsite {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 @Test<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 public void ignoreCertificate() {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.setProperty(“webdriver.chrome.driver”, “path to chromedriver”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ChromeDriver driver = new ChromeDriver();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 DevTools devTool = driver.getDevTools();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.createSession();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.send(Security.setIgnoreCertificateErrors(true));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 driver.get(“https:\/\/untrusted-root.badssl.com\/”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/span><\/p>\n
}<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
The above code loads the website though it’s not secure and has an HTTPS certificate error.<\/p>\n
Network Emulation and Controlling Network Speed using CDP in Selenium 4<\/h3>\n
Consider we have a scenario, we need to test our website how it loads under slow internet connection, like 2G, 3G, 4G, etc. If our website is tested under slow bandwidth conditions and if it is optimized to work in slow bandwidth it works normally. The Selenium 4 with Chrome DevTools Protocol provides option to control the network bandwidth it is called network emulation.<\/p>\n
Network emulation can be done using the command Network.emulateNetworkConditions<\/strong>, The selenium DevTools wrapper takes argument such as offline, latency, downloadThroughput, uploadThroughput, connectionType. We need to call this method to emulate network conditions.<\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
import java.util.Optional;<\/span><\/p>\n
import org.junit.Test;<\/span><\/p>\n
import org.openqa.selenium.chrome.ChromeDriver;<\/span><\/p>\n
import org.openqa.selenium.devtools.DevTools;<\/span><\/p>\n
import org.openqa.selenium.devtools.v94.network.Network;<\/span><\/p>\n
import org.openqa.selenium.devtools.v94.network.model.ConnectionType;<\/span><\/p>\n
public class NetworkSpeed {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 @Test<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 public void networkSpeed() {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.setProperty(“webdriver.chrome.driver”, “path to chromedriver”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ChromeDriver driver = new ChromeDriver();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 DevTools devTool = driver.getDevTools();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.createSession();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devTool.send(Network.emulateNetworkConditions(false, 20, 20, 50, Optional.of(ConnectionType.CELLULAR3G)));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 driver.get(“https:\/\/rahulshettyacademy.com\/#\/index”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/span><\/p>\n
}<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
Once we execute the above code, it emulates the network as per said parameters and loads the website. This helps to test website performance under slow network conditions.<\/p>\n
Mock API using Chrome DevTools Protocol in Selenium 4<\/h3>\n
Consider the example, we have a website which internally calls some API, now what happens if we change the API parameters, what happens if we change the request information. Mocking can be done in selenium using CDP commands<\/p>\n
Let\u2019s consider the example,<\/p>\n
Navigate to <\/em>https:\/\/rahulshettyacademy.com\/angularAppdemo\/<\/em><\/a><\/p>\n
Click on Virtual Library<\/strong><\/em><\/p>\n
It loads the table with book details.<\/p>\n
If you open the Chrome Network Tab, internally it is making call to \/GetBook.php?AuthorName=Shetty<\/strong><\/p>\n
$\"\"$ <\/strong><\/p>\n
Now, let\u2019s change the network URL parameters programmatically,<\/p>\n
We have \/GetBook.php?AuthorName=Shetty <\/strong>API call for that lets replace Shetty <\/strong>with Unkown <\/strong>and lets see what happens<\/p>\n
Example : Mock API Requests in Selenium 4 Using CDP<\/strong><\/p>\n<\/div>\n
\n
<\/div>\n
\n
\n
import java.util.Optional;<\/span><\/p>\n
import org.junit.Test;<\/span><\/p>\n
import org.openqa.selenium.By;<\/span><\/p>\n
import org.openqa.selenium.chrome.ChromeDriver;<\/span><\/p>\n
import org.openqa.selenium.devtools.DevTools;<\/span><\/p>\n
import org.openqa.selenium.devtools.v94.fetch.Fetch;<\/span><\/p>\n
public class MockNetwork {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 @Test<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 public void mockAPISelenium() {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 System.setProperty(“webdriver.chrome.driver”, “path to chromedriver”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 ChromeDriver driver = new ChromeDriver();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 DevTools devtools = driver.getDevTools();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devtools.createSession();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devtools.send(Fetch.enable(Optional.empty(), Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devtools.addListener(Fetch.requestPaused(), req -> {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 if (req.getRequest().getUrl().contains(“=Shetty”)) {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 String mock = req.getRequest().getUrl().replace(“=shetty”, “=Unknown”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devtools.send(Fetch.continueRequest(req.getRequestId(), Optional.of(mock), Optional.empty(),<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 Optional.empty(), Optional.empty(), Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 } else {<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 devtools.send(Fetch.continueRequest(req.getRequestId(), Optional.of(req.getRequest().getUrl()),<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 Optional.empty(), Optional.empty(), Optional.empty(), Optional.empty()));<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 });<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 driver.get(“https:\/\/www.rahulshettyacademy.com\/angularAppdemo\/”);<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 driver.findElement(By.xpath(“\/\/button[contains(text(),’Virtual Library’)] “)).click();<\/span><\/p>\n
\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/span><\/p>\n
}<\/span><\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n
Let\u2019s understand the Code,<\/p>\n
devtools.send(Fetch.enable(Optional.empty(), Optional.empty())); :<\/strong> We are enabling Featch<\/p>\n
devtools.addListener(Fetch.requestPaused(), req -> { :<\/strong> In this line we are adding listener to the CDP evernt Fetch.requestPaused, this helps to get the each request that is made from the browser.<\/p>\n
if (req.getRequest().getUrl().contains(“=Shetty”)) { :<\/strong> Our scenario is monitor only request having parameter \u201cShetty\u201d, and we are going to replace that with Unkown, so we are verifuing the request is having parameter \u201cShetty\u201d<\/p>\n
String mock = req.getRequest().getUrl().replace(“=shetty”, “=Unknown”); :<\/strong> If the URL is having Shetty then we need replace original url with Unknown that is what we are doing here, this is mock URL we are building from orginal URL<\/p>\n
devtools.send(Fetch.continueRequest(req.getRequestId(), Optional.of(mock), Optional.empty(),Optional.empty(), Optional.empty(), Optional.empty()));<\/strong> : Now, we need to continue with Mock Request, we have replaced original request with mock request in this line and continuing with mock request. That means browser sends the mocked request in place of original request.<\/p>\n
else {devtools.send(Fetch.continueRequest(req.getRequestId(), Optional.of(req.getRequest().getUrl()),Optional.empty(), Optional.empty(), Optional.empty(), Optional.empty())); }<\/strong><\/p>\n
We are not bothered about the request if the request doesn\u2019t contain the \u201cShetty\u201d parameter so else part we are just continuing with the original URL<\/p>\n
Let\u2019s execute the above code see what happens<\/p>\n
Output : Mock API Requests in Selenium CDP<\/strong><\/p>\n
$\"\"$ <\/p>\n
In this tutorial we have learned a lot about CDP with Selenium 4, Chrome DevTools Protocol has a lot of features, we tried to help you to understand some basics which help you to perform testing seamlessly in your organization.<\/p>\n
The Rahul Shetty Academy<\/a> continues to bring articles<\/a>, courses that help you to upskill your knowledge. Rahul Shetty Academy has designed many courses on trending automation tools. Every topic is covered in depth and detail, whenever Rahul Shetty Academy design courses it also considers Beginner, Intermediate and Advanced level and cost-effective.<\/p>\n
Author: <\/strong>Ganesh Hegde | LinkedIn<\/a><\/p>\n
Ganesh Hegde is a Professional SDET\/QA he has expertise in many automation tools such as Selenium, Cypress, TestCafe, Playwright, WebdriverIO. He is passionate about Blog Writing and Technical Content Writing.<\/p>\n<\/div>\n<\/div>\n<\/div>\n
<\/div>\n<\/section>\n
<\/body><\/html><\/p>\n","protected":false},"excerpt":{"rendered":"
Table of Contents Capture Network Request in Selenium 4 Capturing Network Response with CDP in Selenium 4 Blocking URL using Chrome DevTools Protocol in Selenium Loading Insecure Website using CDP in Selenium 4 Network Emulation and Controlling Network Speed using CDP in Selenium 4 Mock API using Chrome DevTools Protocol in Selenium 4 Selenium is […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-1281","post","type-post","status-publish","format-standard","hentry","category-selenium","post-wrapper","thrv_wrapper"],"_links":{"self":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/1281","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=1281"}],"version-history":[{"count":0,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/1281\/revisions"}],"wp:attachment":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=1281"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=1281"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=1281"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}