Determine the number of network requests being made on a webpage

In my quest to develop a universal method using selenium, I am seeking a way to ensure that all background network activities, including Ajax, Angular, and API calls, have completed. While I am aware of the option to determine the number of active Ajax calls using JQuery.active, this method is limited to applications built on the JQuery framework. My goal is to create a solution that can monitor and wait for all types of network calls to conclude, not just those specific to Ajax.

My approach involves identifying the current number of ongoing network calls in the background and waiting for this count to reach zero.

This is my proposed strategy, but I am open to any alternative ideas or suggestions on how to handle this challenge.

Answer №1

Below is a code snippet to ensure there are no pending Ajax requests in Chrome:

from selenium import webdriver
from selenium.webdriver.remote.webdriver import WebDriver
from selenium.webdriver.support.ui import WebDriverWait
import json

# Function to send command to Chrome
def send_chrome(driver, cmd, params={}):
  resource = "/session/%s/chromium/send_command_and_get_result" % driver.session_id
  url = driver.command_executor._url + resource
  body = json.dumps({'cmd': cmd, 'params': params})
  response = driver.command_executor._request('POST', url, body)
  if response.get('status'):
    raise Exception(response.get('value'))
  return response.get('value')

# Extend XHR in Chrome
def extend_xhr_chrome(driver):
  send_chrome(driver, "Page.addScriptToEvaluateOnNewDocument", {
      "source":
        "(function(){"
        "  var send = XMLHttpRequest.prototype.send;"
        "  var release = function(){ --XMLHttpRequest.active };"
        "  var onloadend = function(){ setTimeout(release, 1) };"
        "  XMLHttpRequest.active = 0;"
        "  XMLHttpRequest.prototype.send = function() {"
        "    ++XMLHttpRequest.active;"
        "    this.addEventListener('loadend', onloadend, true);"
        "    send.apply(this, arguments);"
        "  };"
        "})();"
    })

# Check if XHR is idle in Chrome
def is_xhr_idle_chrome(driver):
    return send_chrome(driver, 'Runtime.evaluate', {
      'returnByValue': True,
      'expression': "XMLHttpRequest.active == 0"
    })['result']['value']

# Launch Chrome
driver = webdriver.Chrome()

# Extend XMLHttpRequest
extend_xhr_chrome(driver)

driver.get("https://stackoverflow.com")

# Wait for no pending request
WebDriverWait(driver, 20, 0.08) \
  .until(is_xhr_idle_chrome)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Locate the div in the array that includes ValueA, and save ValueB from it into a new variable

When the button is clicked, I retrieve the current value of a Select control using the following code... $('#myBtn').on('click', function (clickEvent) { var nameSelected = document.getElementById('mySelectControl').getEle ...

Invoke the click handlers consecutively following the initial click handler using ajax requests

I have a button on my webpage that triggers multiple click events. The button code looks like this: <input type="button" id="myButton"/> There are several functions bound to the button's click event using jQuery: $("#mybutton").on("click", f ...

Steps for configuring jQuery hide(), adding Class, and remove Class for flawless execution

My HTML Code is structured as follows : ... @foreach($hotel as $key=>$value) ... <div class="iteration"> <input type='hidden' value='<?php echo $value['HCode'].'#' ...

What are the steps involved in converting a MERN application into a desktop application?

As a beginner in front-end application development, I recently created a MERN application in React with separate frontend and backend parts. Everything is working smoothly, but now I want to convert it into a desktop application that can run independently ...

The function io.sockets.in(roomName) does not seem to be properly listening for myEvent after joining the

I am looking to dynamically create rooms based on incoming requests from the front end. I found guidance in this gist. My goal is for a specific room to listen for events and communicate with other members within that room. However, I am experiencing an i ...

Adjusting the height of a flexbox column to fit three rows within the space of two

Exploring the wonders of Flexbox and delving into its functionality. I have shared a Code Sandbox link showcasing my React /bootstrap code in progress... Currently, I am developing a clock component with two buttons for adjusting time (increase/decrease). ...

Methods for adding a new object to an array in Angular: Explained

How can I insert a new object in Angular? Here is the current data: data = [ { title: 'Book1' }, { title: 'Book2' }, { title: 'Book3' }, { title: 'Book4' } ] I would like to update the obje ...

Include new items in the li tag using JavaScript

Hello, I am looking to dynamically add elements to an LI element when a link is clicked. I have successfully added elements to a DIV using the following code snippet: I came across a similar question on Which "href" value should I use for JavaScript links ...

Warning: Next.js is throwing a hydration error because the server HTML does not include a matching <main> element within a <div>

I have been encountering hydration issues in my next.js application. After extensive troubleshooting, I have found that the culprit might be the higher order component called withAuth.js The error message displayed is: Warning: Expected server HTML to con ...

Obtaining an attribute of a row in a table using Selenium and Python

I've been trying to figure out how to check if this button (image) has been clicked: It's crucial for me to interact with this button, as it allows me to modify the price of certain items and protect them when necessary. However, I need a way to ...

Ways to modify the color of cells in a table generated from JSON

In developing an HTML table based on JSON data, I have created a university semester map that displays student information including their ID, year, term, and required courses for graduation. While the table is successfully created, I aim to customize the ...

A guide on transferring data to an external JavaScript script that is asynchronously loaded

I came across this solution on Stack Overflow here to load JavaScript asynchronously. However, I am wondering how can I pass some data to the external file? This is my current code: <script id="js-widget-o2ba1y" type='text/javascript'> ...

How can I merge my two custom filters into a single, more efficient custom filter?

I have developed two custom filters that are quite similar. The only distinction between these filters is the array they utilize. Therefore, I am considering creating a single custom filter and passing an array as a parameter to it. The arrays I intend to ...

Mastering hot reloading in React when using Dotnet and DockerorAchieving seamless hot reloading in

I have been working on getting hot reloading to function properly with React, Docker, and Dotnet. However, my research has shown that only static rendering is compatible with Docker. As a result, I find myself having to run the command docker -t build {Na ...

Change the structure of the JavaScript object into a new format

I humbly ask for forgiveness as I am struggling with figuring out how to accomplish this task. It seems like we need to utilize a map function or something similar, but I am having difficulty grasping it. Below is the object 'data' that I am wor ...

Blend express router by chaining the (.route) method with other HTTP methods like (.get, .post, etc) to create

Here is my code structure: let router = require( 'express' ).Router(); Later on, I define my routes like this: router .route( '/' ) .get( listMiddleware ); router .route( '/:id' ) .get( getOneByIdMiddleware ...

Incorporating the non-typescript npm package "pondjs" into Meteor applications using typescript files

Implementing the Pondjs library into my project seemed straightforward at first: meteor npm install --save pondjs However, I'm encountering difficulties when trying to integrate it with my Typescript files. The documentation suggests: In order ...

Import the information into a td tag's data-label property

I have implemented a responsive table design that collapses for smaller screens and displays the table header before each cell. body { font-family: "Open Sans", sans-serif; line-height: 1.25; } table { border: 1px solid #ccc; border-collapse: co ...

sophisticated HTML navigation bar

I am looking for a way to create a menu where the drop-down items overlay the rest of the menu when the screen width is small. Here is my current code: nav{ line-height:100%; opacity:.9; }nav ul{ background: #999; padding: 0px; border-radius: 20px; ...

Is it possible for me to hand over control to a child process and retrieve the result in Node.js?

Recently, I encountered an issue where multiple simultaneous GET requests to my Node.js server caused it to become overwhelmed and unresponsive, leading to timeouts for clients (503, service unavailable). Upon thorough performance analysis, I discovered t ...