12

I am trying to work out how to use Google Chrome DevTools to simulate a timeout on a JavaScript file on my site.

I can use the 'Toggle Device Mode' to introduce throttling but that doesn't target a specific script.

Is there a way to do this with DevTools?

I am using Chrome 38.

crmpicco
  • 16,605
  • 26
  • 134
  • 210

2 Answers2

5

In Chrome you can setup a new network profile with custom download/upload bandwidth and latency time.

Use a long enough latency value to trigger a request timeout.

Joe Lewis
  • 1,970
  • 2
  • 18
  • 20
4

DevTools technical writer and developer advocate here. As of January 2018:

  • You can't network-throttle individual requests in DevTools. You can block them, though, which is what I assume you mean by "timeout". See Block Requests.
  • You could use a service worker to network-throttle individual requests.

Haven't tested this code, but something like this might work for the service-worker-based throttling:

self.addEventListener('fetch', event => {
  const TARGET = 'example.com';
  const DELAY_MS = 1000;
  if (event.request.url === TARGET) {
    setTimeout(() => {
      event.respondWith(caches.match(event.request));
    }, DELAY_MS);
  }
});
Kayce Basques
  • 23,849
  • 11
  • 86
  • 120
  • This didn't work for me, and injecting log statements within the callback and `if` block didn't output anything when the calls were fired. Is there some small tweak that would make this work in the latest version of Chrome (78.x)? – Greg Venech Dec 04 '19 at 17:46