Guide on how to postpone an XMLHttpRequest in GreaseMonkey until the destination page has completed loading

I have a specific request related to GreaseMonkey. I am trying to make a GET request using GM_xmlhttpRequest to fetch content from a page that loads some of its content after an initial progress bar (due to AJAX). My goal is to retrieve the complete contents of the page only after everything has been fully loaded, so I am seeking a way to introduce a delay in the request. Is it possible? If so, how can I achieve this?

To clarify further, my current code is similar to this:

    GM_xmlhttpRequest({
        method: "GET",
        url: "http://example.com",
        onload: function(response) {
            if(response.responseText.length > 0)
            {
                callBack(response.responseText);
            }
        },
        onerror: function(response) {
            log("Error in fetching contents: " + response.responseText);
        }

    });

Instead of "example.com," the actual page I am dealing with initially loads but then dynamically loads its main contents after a delay. However, the response.responseText only captures the initial load HTML.

Thank you!

Answer №1

If you want to introduce a delay before running a script on your webpage, consider utilizing the setTimeout function with a specified time interval (e.g. 2 seconds for faster loading pages or longer to ensure accuracy).

Alternatively, you can implement mutation observers on the body element to detect when nodes are added or removed, triggering your script accordingly and then ceasing the observer.

I found inspiration and guidance from the MDN website when learning how to effectively use mutation observers for enhancing userscripts.

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

Imagine a scenario where clicking on an image causes it to be rotated or

Could use some assistance figuring out what's missing here. I've added a random photo from Wiki, similar in size to the images I'll be working with. The images will vary in size, but I want them to always remain visible within the browser w ...

Issues have arisen with the execution of JavaScript code inside a callback function

When the warnBeforeNew variable is set to false in the JavaScript code below, the file open function works as expected. However, when warnBeforeNew is true, an error occurs stating "Uncaught TypeError: Cannot read property 'root' of undefined". ...

Tips on toggling between slides with Bootstrap Carousel

I am in the process of designing a portfolio website and have encountered a challenge. I want to divide it into two sections - a brief introduction and a carousel for showcasing projects. While I have managed to set up both sections, I'm facing an iss ...

Tips for re-establishing event listeners on elements after a page transition

As a developer working with vuejs and laravel, my task is to retain the original design and animations provided by the designer without making any changes. However, when I incorporate vue.js into the template and alter the route, I find that the entire pa ...

angularJs ng-hide using the $index value within an ng-repeat directive

I have a list of items that need to be displayed with serial numbers. I tried using $index with ng-repeat, but when an element is hidden, the index increases unexpectedly. The code I attempted is as follows: <div ng-repeat="itemRow in salesitem" class ...

Has Chrome's console disappeared?

After reinstalling Chrome and opening the dev tools with F12, I encountered an error with the following code: console.debug('test'); The error message displayed was Uncaught ReferenceError: console is not defined(…) This issue persisted acro ...

Displaying and hiding collapsible items in Bootstrap 4: A guide to showing one item at a time

I'm working on collapsible menus and I need them to completely hide when one is clicked, instead of just collapsing. This behavior is different from an accordion setup. To achieve this, I incorporated the following function into my code: $('#bo ...

The computed function in Vue.js fails to provide a return value

I'm currently experimenting with a basic to-do list using vue.js. My goal is to calculate the total sum of all price values within an array. I created a small function under computed, but it seems like something isn't working correctly. Here&apos ...

Switch between toggling tasks in Vue does not seem to be functioning as

I'm reaching out again because I'm struggling to figure out what I'm doing wrong. I followed a tutorial step by step but the code isn't working as expected. My goal is to toggle between marking tasks as done and not done. When I test th ...

After attempting to publish my NPM package, I encountered an issue where I received an empty object. This occurred despite utilizing a setup that includes ES6, Babel,

Is there anyone out there who can assist me with this issue? I am attempting to publish an npm package with the following configuration: webpack: production: { entry: [ './src', './src/app.scss', 'draft- ...

Validating data for Telegram Web Bots using JavaScript

Struggling with creating a user verification script for my Telegram web app bots. Need help troubleshooting. import sha256 from 'js-sha256' const telegram = window.Telegram.WebApp const bot_token = '<bot-token>' const data_check_ ...

Increase variable i by one after a given interval using the jQuery setTimeout function

I have been struggling with implementing a setTimeout function within a Wordpress loop to increment eq(i) for each individual post. Despite trying various approaches, nothing seems to be working as intended. Here is the snippet of my code: jQuery(document ...

Refresh component when mobx store is modified

I am utilizing chart.js to display real-time price changes from the backend. The backend updates the frontend with new prices as they change, and stores the priceData (array) in a mobx store named priceChartStore. I need to continuously update the chart as ...

Guide to implementing tooltips for disabled <li> elements in AngularJS

I have a list of items that are displayed using the following code: <li class="dropdown-item" data-toggle="tooltip" uib-tooltip="tooltip goes here" data-placement="left" data-ng-repeat="result in items.results.contextValues.rows " ...

js-libp2p works by establishing connections between nodes without initiating a new stream

To access the complete source code, visit this link: https://github.com/Gbr22/p2ptunnel listener: $ node listener.js The listener is ready and actively listening on: /ip4/192.168.0.101/tcp/10333/p2p/QmcrQZ6RJdpYuGvZqD5QEHAv6qX4BrQLJLQPQUrTrzdcgm /ip4/1 ...

Update an object within an array in MongoDB, ensuring that only the first object is modified

Currently, I am following a tutorial on the node.js framework. You can check it out here: https://www.w3schools.com/nodejs/nodejs_mongodb.asp I've encountered a peculiar issue that I can't seem to figure out. To give you a better idea, I've ...

Connecting a Vue js model data to a Select2 select box

Utilizing select2 to improve an html select element, I am facing challenges in binding the value of the select element to a Vue variable because Select2 appears to be causing interference. Is there an optimal approach to achieve this data binding and even ...

Hover over with your mouse to open and close the dropdown menu in React JS

Just starting out with React JS and encountering a small issue. I'm trying to make the menu disappear when the mouse leaves that area, so I used onMouseOut and onMouseLeave to close it. However, I noticed that having these options in place prevents th ...

What is the procedure for invoking the delete route via ajax in Laravel?

When attempting to call a route resource with AJAX using the 'DELETE' method, an error is encountered (Exception: "Symfony\Component\HttpKernel\Exception\MethodNotAllowedHttpException") along with the message "The DELETE metho ...

Utilizing jQuery UI Slider for Calculating Percentage

I recently worked on an example where I incorporated 5 sliders, which you can see here: Example: http://jsfiddle.net/redsunsoft/caPAb/2/ My Example: http://jsfiddle.net/9azJG/ var sliders = $("#sliders .slider"); var availableTotal = 100; ...