CODEWITHSUNDEEP
google-chrometabsloadgoogle-chrome-extensiondelay
raviparikh
raviparikh

Reputation: 295

Introduce load time delay in chrome extension

For a research project, I am coding a chrome extension where when I go to a certain url, it should introduce a load delay of 2 seconds. So basically I'd like the effect where the user types in "example.com", they have to wait 2 extra seconds before the page begins to load. Is there any way to do this with chrome extensions? I've scoured the documentation but can't seem to find anything like this.

Upvotes: 4

Views: 10959

Answers (3)

bob chen
bob chen

Reputation: 57

Both Chris's and Yonran's solution didn't work for me. What worked for me: What is the JavaScript version of sleep()?

Upvotes: -1

yonran
yonran

Reputation: 19174

Chris's solution would work but it locks up the UI. You might also try this simple content script:

content_script.js:

document.documentElement.style.display = 'none';
setTimeout(function() {document.documentElement.style.display = '';}, 1000);

manifest.json:

{
  "name": "Delay webpage displays",
  "version": "1.0",
  "content_scripts": [
    {
      "matches": ["http://*/*"],
      "js": ["content_script.js"],
      "run_at": "document_start"
    }
  ]  
}

I must say though that it's very annoying. Furthermore, an astute user will know that something's up because it will show a blank page even when there is no "Waiting for www.example.com..." status line.

If you want to perfectly mimic a slow network, I think the best way would be to create a HTTP/HTTPS (or maybe SOCKS5) proxy that introduces the delay. You can make the browser use the proxy only on certain URLs by creating a proxy.pac file or by using the Chrome experimental proxy API.

So what do you want to simulate? If you want to simulate high-CPU JS or rendering, then use Chris's solution. If you want to simulate slow network, use a proxy. My solution kind of simulates a slow network but it's not a perfect disguise.

Upvotes: 4

Chris McFarland
Chris McFarland

Reputation: 6169

In your manifest.json file, add in:

"content_scripts": [{
    "matches": ["http://*.example.com/*"], // add in different URLs here
    "js": ["sleep.js"],
    "run_at": "document_start"
}]

And create a sleep.js file containing:

function sleep (seconds) {
    var start = new Date().getTime();
    while (new Date() < start + seconds*1000) {}
    return 0;
}
sleep(2);

(found from phpjs)

So if someone goes to www.example.com, the page will wait 2 seconds before loading. However, this won't work if the page redirects to another page (which example.com does, so a different site would be better to try on :))

Check the manifest docs for more info.

Upvotes: 1

Related Questions