Performance: improve focus metric (diff between focus start and type …

…start)

packages/e2e-tests/specs/performance/post-editor.test.js

@@ -162,24 +162,16 @@ describe( 'Post Editor Performance', () => {
 			// The timeout should be big enough to allow all async tasks tor run.
 			// And also to allow Rich Text to mark the change as persistent.
 			// eslint-disable-next-line no-restricted-syntax
-			await page.waitForTimeout( 2000 );
 			await page.keyboard.type( 'x' );
 		}
+		await page.keyboard.type( 'x' );
 		await page.tracing.stop();
 		traceResults = JSON.parse( readFile( traceFile ) );
-		const [ keyDownEvents, keyPressEvents, keyUpEvents ] =
-			getTypingEventDurations( traceResults );
-		if (
-			keyDownEvents.length === keyPressEvents.length &&
-			keyPressEvents.length === keyUpEvents.length
-		) {
-			// The first character typed triggers a longer time (isTyping change)
-			// It can impact the stability of the metric, so we exclude it.
-			for ( let j = 1; j < keyDownEvents.length; j++ ) {
-				results.type.push(
-					keyDownEvents[ j ] + keyPressEvents[ j ] + keyUpEvents[ j ]
-				);
-			}
+		const [ keyDownEvents ] = getTypingEventDurations( traceResults );
+		// The first character typed triggers a longer time (isTyping change)
+		// It can impact the stability of the metric, so we exclude it.
+		for ( let j = 1; j < keyDownEvents.length; j++ ) {
+			results.type.push( keyDownEvents[ j ] - keyDownEvents[ j - 1 ] );
 		}
 	} );
 
@@ -247,14 +239,12 @@ describe( 'Post Editor Performance', () => {
 				categories: [ 'devtools.timeline' ],
 			} );
 			await paragraphs[ j ].click();
+			await page.keyboard.type( 'a' );
 			await page.tracing.stop();
 			traceResults = JSON.parse( readFile( traceFile ) );
-			const allDurations = getSelectionEventDurations( traceResults );
-			results.focus.push(
-				allDurations.reduce( ( acc, eventDurations ) => {
-					return acc + sum( eventDurations );
-				}, 0 )
-			);
+			const [ focusEvents, keyDownEvents ] =
+				getSelectionEventDurations( traceResults );
+			results.focus.push( keyDownEvents[ 0 ] - focusEvents[ 0 ] );
 		}
 	} );
 

packages/e2e-tests/specs/performance/utils.js

@@ -29,22 +29,10 @@ 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';
 }
@@ -63,18 +51,20 @@ function getEventDurationsForType( trace, filterFunction ) {
 		.map( ( item ) => item.dur / 1000 );
 }
 
+function getEventStartForType( trace, filterFunction ) {
+	return trace.traceEvents
+		.filter( filterFunction )
+		.map( ( item ) => item.ts / 1000 );
+}
+
 export function getTypingEventDurations( trace ) {
-	return [
-		getEventDurationsForType( trace, isKeyDownEvent ),
-		getEventDurationsForType( trace, isKeyPressEvent ),
-		getEventDurationsForType( trace, isKeyUpEvent ),
-	];
+	return [ getEventStartForType( trace, isKeyDownEvent ) ];
 }
 
 export function getSelectionEventDurations( trace ) {
 	return [
-		getEventDurationsForType( trace, isFocusEvent ),
-		getEventDurationsForType( trace, isFocusInEvent ),
+		getEventStartForType( trace, isFocusEvent ),
+		getEventStartForType( trace, isKeyDownEvent ),
 	];
 }