[Feature] Implement Network Throttling

[uchagani]

I couldn't find anything regarding this in the documentation but could we get the ability to throttle the network throughput?

[mxschmitt]

We don't support this at the moment. You can defer your network via awaiting time in page.route as a quick and dirty solution:

await page.route('**/*', async route => {
  await new Promise(f => setTimeout(f, 100));
  await route.continue();
});

That won't be accurate in terms of latency and throughput, but you can simulate delays in network responses that way.

See here #6038

If you want to enable it on Chromium only, see here: #6038 (comment)

[pavelfeldman]

@uchagani: what is your use case?

[uchagani]

a couple use cases but they might be handled by the workaround above:

1. introduce delays to ensure application handles that properly.
2. defect recreations that are caused by network delays.

[yury-s]

Since the solution above works for you use case, let's collect more feedback on this.

[hatufacci]

I think it works for puppeteer :) i used it in codeceptjs wrapper.
public async slowInternet(NETWORK_PRESETS): Promise {
const page = this.helpers['Puppeteer'].page;
const client = await page.target().createCDPSession();
await client.send('Network.emulateNetworkConditions', NETWORK_PRESETS);
console.log('-------------Slow Internet emulation---------');
}
export let NETWORK_PRESETS = {
GPRS: {
offline: false,
downloadThroughput: (50 * 1024) / 8,
uploadThroughput: (20 * 1024) / 8,
latency: 500,
},
Regular2G: {
offline: false,
downloadThroughput: (250 * 1024) / 8,
uploadThroughput: (50 * 1024) / 8,
latency: 300,
},
Good2G: {
offline: false,
downloadThroughput: (450 * 1024) / 8,
uploadThroughput: (150 * 1024) / 8,
latency: 150,
},
Regular3G: {
offline: false,
downloadThroughput: (750 * 1024) / 8,
uploadThroughput: (250 * 1024) / 8,
latency: 100,
},
Good3G: {
offline: false,
downloadThroughput: (1.5 * 1024 * 1024) / 8,
uploadThroughput: (750 * 1024) / 8,
latency: 40,
},
Regular4G: {
offline: false,
downloadThroughput: (4 * 1024 * 1024) / 8,
uploadThroughput: (3 * 1024 * 1024) / 8,
latency: 20,
},
DSL: {
offline: false,
downloadThroughput: (2 * 1024 * 1024) / 8,
uploadThroughput: (1 * 1024 * 1024) / 8,
latency: 5,
},
WiFi: {
offline: false,
downloadThroughput: (30 * 1024 * 1024) / 8,
uploadThroughput: (15 * 1024 * 1024) / 8,
latency: 2,
},
};

[mxschmitt]

If you want to enable it via CDP, see here: #6038 (comment)

[AntouanK]

I tried the solution @mxschmitt gave earlier.

I've found that for high values ( >200 ) the Page closes and almost all my tests fail ( it's a bit random which ones fail! ).
With a low value ( <100 ) they pass and the delay works ( I have a test where I check a loading element just before the API call resolves ).

Anyone seen something similar?
It's a bit strange.

To implement the chrome solution that was posted earlier, I need to access the browser instance.
I'm a bit confused on how to do this, since I don't have a browser instance anywhere.
I just run npx playwright test --config=playwright.config.dev.ts and the tests run.
How do we access the default browser that playwright launches?
If I try to make a new one, all the tests fail.

[AntouanK]

to answer my question, I realised it's part of the arguments of test()

so

test('My example test', async ({page, browser}) => {
  //console.log(browser)
  ...
})

I cannot get it to work though.
I get a

    page.goto: Navigation failed because page was closed!
    =========================== logs ===========================
    navigating to "http://localhost:4001/", waiting until "load"

without the context/cdpSession part, the tests work. :/

edit:
seems like with the wifi preset they do, with the 3G one they don't 🤷‍♂️

[pavelfeldman]

Why was this issue closed?

We are prioritizing the features based on the upvotes, recency and activity in the issue thread. It looks like this issue only has a handful of upvotes, has not been touched recently and/or we lack sufficient feedback to act on it. We are closing issues like this one to keep our bug database maintainable. Please feel free to open a new issue and link this one to it if you think this is a mistake.

[Feroza22]

Added report with articles page testcases

[mbUSC]

This would be very useful

[DrSammyD]

We don't support this at the moment. You can defer your network via awaiting time in page.route as a quick and dirty solution:

await page.route('**/*', async route => {
  await new Promise(f => setTimeout(f, 100));
  await route.continue();
});

That won't be accurate in terms of latency and throughput, but you can simulate delays in network responses that way.

See here #6038

If you want to enable it on Chromium only, see here: #6038 (comment)

How do you do this with routeFromHar?