@wordpress/e2e-tests 7.9.0 → 7.11.0

package/specs/performance/site-editor.test.js

@@ -1,188 +0,0 @@
-/**
- * External dependencies
- */
-import path from 'path';
-
-/**
- * WordPress dependencies
- */
-import {
-	activateTheme,
-	canvas,
-	createNewPost,
-	visitSiteEditor,
-	saveDraft,
-	insertBlock,
-	deleteAllTemplates,
-	enterEditMode,
-} from '@wordpress/e2e-test-utils';
-
-/**
- * Internal dependencies
- */
-import {
-	readFile,
-	deleteFile,
-	saveResultsFile,
-	getTraceFilePath,
-	getTypingEventDurations,
-	getLoadingDurations,
-	sequence,
-} from './utils';
-
-jest.setTimeout( 1000000 );
-
-const results = {
-	serverResponse: [],
-	firstPaint: [],
-	domContentLoaded: [],
-	loaded: [],
-	firstContentfulPaint: [],
-	firstBlock: [],
-	type: [],
-	typeContainer: [],
-	focus: [],
-	inserterOpen: [],
-	inserterHover: [],
-	inserterSearch: [],
-	listViewOpen: [],
-};
-
-let postId;
-
-describe( 'Site Editor Performance', () => {
-	beforeAll( async () => {
-		await activateTheme( 'emptytheme' );
-		await deleteAllTemplates( 'wp_template' );
-		await deleteAllTemplates( 'wp_template_part' );
-
-		const html = readFile(
-			path.join( __dirname, '../../assets/large-post.html' )
-		);
-
-		await createNewPost( { postType: 'page' } );
-
-		await page.evaluate( ( _html ) => {
-			const { parse } = window.wp.blocks;
-			const { dispatch } = window.wp.data;
-			const blocks = parse( _html );
-
-			blocks.forEach( ( block ) => {
-				if ( block.name === 'core/image' ) {
-					delete block.attributes.id;
-					delete block.attributes.url;
-				}
-			} );
-
-			dispatch( 'core/block-editor' ).resetBlocks( blocks );
-		}, html );
-		await saveDraft();
-
-		postId = await page.evaluate( () =>
-			new URL( document.location ).searchParams.get( 'post' )
-		);
-	} );
-
-	afterAll( async () => {
-		saveResultsFile( __filename, results );
-		await deleteAllTemplates( 'wp_template' );
-		await deleteAllTemplates( 'wp_template_part' );
-	} );
-
-	// Number of loading measurements to take.
-	const loadingSamples = 3;
-	// Number of throwaway measurements to perform before recording samples.
-	// Having at least one helps ensure that caching quirks don't manifest
-	// in the results.
-	const loadingSamplesThrowaway = 1;
-	const loadingIterations = sequence(
-		1,
-		loadingSamples + loadingSamplesThrowaway
-	);
-	it.each( loadingIterations )(
-		`Loading (%i of ${ loadingIterations.length })`,
-		async ( i ) => {
-			// Open the test page in Site Editor.
-			await visitSiteEditor( {
-				postId,
-				postType: 'page',
-			} );
-
-			// Wait for the first block.
-			await canvas().waitForSelector( '.wp-block' );
-
-			// Save results.
-			if ( i > loadingSamplesThrowaway ) {
-				const {
-					serverResponse,
-					firstPaint,
-					domContentLoaded,
-					loaded,
-					firstContentfulPaint,
-					firstBlock,
-				} = await getLoadingDurations();
-
-				results.serverResponse.push( serverResponse );
-				results.firstPaint.push( firstPaint );
-				results.domContentLoaded.push( domContentLoaded );
-				results.loaded.push( loaded );
-				results.firstContentfulPaint.push( firstContentfulPaint );
-				results.firstBlock.push( firstBlock );
-			}
-
-			expect( true ).toBe( true );
-		}
-	);
-
-	it( 'Typing', async () => {
-		// Open the test page in Site Editor.
-		await visitSiteEditor( {
-			postId,
-			postType: 'page',
-		} );
-
-		// Wait for the first block to be ready.
-		await canvas().waitForSelector( '.wp-block' );
-
-		// Get inside the post content.
-		await enterEditMode();
-
-		// Select the post content block wrapper.
-		await canvas().click( '.wp-block-post-content' );
-
-		// Select the first paragraph in the post content block.
-		const firstParagraph = await canvas().waitForXPath(
-			'//p[contains(text(), "Lorem ipsum dolor sit amet")]'
-		);
-		await firstParagraph.click();
-
-		await insertBlock( 'Paragraph' );
-
-		// Start tracing.
-		const traceFilePath = getTraceFilePath();
-		await page.tracing.start( {
-			path: traceFilePath,
-			screenshots: false,
-			categories: [ 'devtools.timeline' ],
-		} );
-
-		// Type "x" 200 times.
-		await page.keyboard.type( new Array( 200 ).fill( 'x' ).join( '' ) );
-
-		// Stop tracing and save results.
-		await page.tracing.stop();
-		const traceResults = JSON.parse( readFile( traceFilePath ) );
-		const [ keyDownEvents, keyPressEvents, keyUpEvents ] =
-			getTypingEventDurations( traceResults );
-		for ( let i = 0; i < keyDownEvents.length; i++ ) {
-			results.type.push(
-				keyDownEvents[ i ] + keyPressEvents[ i ] + keyUpEvents[ i ]
-			);
-		}
-
-		// Delete the original trace file.
-		deleteFile( traceFilePath );
-
-		expect( true ).toBe( true );
-	} );
-} );

package/specs/performance/utils.js

@@ -1,146 +0,0 @@
-/**
- * External dependencies
- */
-import path from 'path';
-import { existsSync, readFileSync, unlinkSync, writeFileSync } from 'fs';
-
-export function readFile( filePath ) {
-	return existsSync( filePath )
-		? readFileSync( filePath, 'utf8' ).trim()
-		: '';
-}
-
-export function deleteFile( filePath ) {
-	if ( existsSync( filePath ) ) {
-		unlinkSync( filePath );
-	}
-}
-
-export function getTraceFilePath() {
-	return path.join( process.env.WP_ARTIFACTS_PATH, '/trace.json' );
-}
-
-export function saveResultsFile( testFilename, results ) {
-	const resultsFilename =
-		process.env.RESULTS_FILENAME ||
-		path.basename( testFilename, '.js' ) + '.performance-results.json';
-
-	return writeFileSync(
-		path.join( process.env.WP_ARTIFACTS_PATH, resultsFilename ),
-		JSON.stringify( results, null, 2 )
-	);
-}
-
-function isEvent( item ) {
-	return (
-		item.cat === 'devtools.timeline' &&
-		item.name === 'EventDispatch' &&
-		item.dur &&
-		item.args &&
-		item.args.data
-	);
-}
-
-function isKeyDownEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'keydown';
-}
-
-function isKeyPressEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'keypress';
-}
-
-function isKeyUpEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'keyup';
-}
-
-function isFocusEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'focus';
-}
-
-function isFocusInEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'focusin';
-}
-
-function isClickEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'click';
-}
-
-function isMouseOverEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'mouseover';
-}
-
-function isMouseOutEvent( item ) {
-	return isEvent( item ) && item.args.data.type === 'mouseout';
-}
-
-function getEventDurationsForType( trace, filterFunction ) {
-	return trace.traceEvents
-		.filter( filterFunction )
-		.map( ( item ) => item.dur / 1000 );
-}
-
-export function getTypingEventDurations( trace ) {
-	return [
-		getEventDurationsForType( trace, isKeyDownEvent ),
-		getEventDurationsForType( trace, isKeyPressEvent ),
-		getEventDurationsForType( trace, isKeyUpEvent ),
-	];
-}
-
-export function getSelectionEventDurations( trace ) {
-	return [
-		getEventDurationsForType( trace, isFocusEvent ),
-		getEventDurationsForType( trace, isFocusInEvent ),
-	];
-}
-
-export function getClickEventDurations( trace ) {
-	return [ getEventDurationsForType( trace, isClickEvent ) ];
-}
-
-export function getHoverEventDurations( trace ) {
-	return [
-		getEventDurationsForType( trace, isMouseOverEvent ),
-		getEventDurationsForType( trace, isMouseOutEvent ),
-	];
-}
-
-export async function getLoadingDurations() {
-	return await page.evaluate( () => {
-		const [
-			{
-				requestStart,
-				responseStart,
-				responseEnd,
-				domContentLoadedEventEnd,
-				loadEventEnd,
-			},
-		] = performance.getEntriesByType( 'navigation' );
-		const paintTimings = performance.getEntriesByType( 'paint' );
-		return {
-			// Server side metric.
-			serverResponse: responseStart - requestStart,
-			// For client side metrics, consider the end of the response (the
-			// browser receives the HTML) as the start time (0).
-			firstPaint:
-				paintTimings.find( ( { name } ) => name === 'first-paint' )
-					.startTime - responseEnd,
-			domContentLoaded: domContentLoadedEventEnd - responseEnd,
-			loaded: loadEventEnd - responseEnd,
-			firstContentfulPaint:
-				paintTimings.find(
-					( { name } ) => name === 'first-contentful-paint'
-				).startTime - responseEnd,
-			// This is evaluated right after Puppeteer found the block selector.
-			firstBlock: performance.now() - responseEnd,
-		};
-	} );
-}
-
-export function sum( arr ) {
-	return arr.reduce( ( a, b ) => a + b, 0 );
-}
-
-export function sequence( start, length ) {
-	return Array.from( { length }, ( _, i ) => i + start );
-}