jest-puppeteer icon indicating copy to clipboard operation
jest-puppeteer copied to clipboard

Add a way to simulate slow network or CPU

Open gziolo opened this issue 5 years ago β€’ 1 comments

πŸš€ Feature Proposal

In https://github.com/WordPress/gutenberg project (the block editor for WordPress) we are using jest-puppeteer with Travis for continues integration. This environment is much slower than what you usually observe when running test locally on machines with fast CPU and network. When working on the upgrade to the latest version of Puppeteer (https://github.com/WordPress/gutenberg/pull/14986) we figured out that some fragile tests might which fail 1 of 5 times can be only reproduced with slow CPU or network. Those are real issues mostly related to keyboard and mouse interactions.

In the PR we are using the following snippet to simulate a slower environment:

	const client = await page.target().createCDPSession();
	await client.send( 'Network.emulateNetworkConditions', {
		// Whether chrome should simulate
		// the absence of connectivity
		offline: false,
		// Simulated download speed (bytes/s)
		downloadThroughput: 1.5 * 1024 * 1024 / 8,
		// Simulated upload speed (bytes/s)
		uploadThroughput: 750 * 1024 / 8,
		// Simulated latency (ms)
		latency: 40,
	} );
	await client.send( 'Emulation.setCPUThrottlingRate', { rate: 4 } );

Motivation

I would like to propose that we add a way to enforce this behavior as a configuration option in jest-puppeteer.config.js (https://github.com/smooth-code/jest-puppeteer#configure-puppeteer) to add more tools for developers to make debugging failing tests easier.

Example

// jest-puppeteer.config.js
module.exports = {
  debug: {
    cpuThrottling: 4,
    emulateNetwork: 'Good3G'
  },
};

Related articles which cover in-depth both settings that can be set through Dev Tools:

  • https://medium.com/@dalvifahim/network-throttling-in-puppeteer-e23170ff18f0
  • https://michaljanaszek.com/blog/test-website-performance-with-puppeteer

They can be used to create presets for network conditions.

Pitch

As of today, the only way to debug tests is with global.jestPuppeteer.debug() which is fine when you write tests. However, it's nearly impossible to detect regressions on tests which fail only in very specific conditions like slow network or slow CPU. I think this proposal fits perfectly fine into the overall picture where jest-puppeteer provides great experience for those using Jest and Puppeteer. I personally update slowMo and headless fields in jest-puppeteer.config.js a lot in my daily workflow.

gziolo avatar May 15 '19 10:05 gziolo

Hello @gziolo, thanks for submitting this issue! I think it is a great feature! I am OK for it! PR are welcome ☺️

gregberge avatar May 17 '19 12:05 gregberge

Hello @gziolo why resolved?

gregberge avatar Jun 01 '23 05:06 gregberge