DataViews: add performance test for pages

test/performance/config/performance-reporter.ts

@@ -34,6 +34,7 @@ export interface WPRawPerformanceResults {
 	inserterSearch: number[];
 	inserterHover: number[];
 	loadPatterns: number[];
+	loadPages: number[];
 	listViewOpen: number[];
 	navigate: number[];
 	wpBeforeTemplate: number[];
@@ -69,6 +70,7 @@ export interface WPPerformanceResults {
 	inserterSearch?: PerformanceStats;
 	inserterHover?: PerformanceStats;
 	loadPatterns?: PerformanceStats;
+	loadPages?: PerformanceStats;
 	listViewOpen?: PerformanceStats;
 	navigate?: PerformanceStats;
 	wpBeforeTemplate?: PerformanceStats;
@@ -106,6 +108,7 @@ export function curateResults(
 		inserterSearch: stats( results.inserterSearch ),
 		inserterHover: stats( results.inserterHover ),
 		loadPatterns: stats( results.loadPatterns ),
+		loadPages: stats( results.loadPages ),
 		listViewOpen: stats( results.listViewOpen ),
 		navigate: stats( results.navigate ),
 		wpBeforeTemplate: stats( results.wpBeforeTemplate ),

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

@@ -29,6 +29,7 @@ const results = {
 	listViewOpen: [],
 	navigate: [],
 	loadPatterns: [],
+	loadPages: [],
 };
 
 test.describe( 'Site Editor Performance', () => {
@@ -384,6 +385,68 @@ test.describe( 'Site Editor Performance', () => {
 			}
 		} );
 	} );
+
+	test.describe( 'Loading Pages', () => {
+		test.beforeAll( async ( { requestUtils } ) => {
+			await requestUtils.activateTheme( 'twentytwentyfour' );
+		} );
+
+		test.afterAll( async ( { requestUtils } ) => {
+			await requestUtils.activateTheme( 'twentytwentyfour' );
+		} );
+
+		const perPage = 20;
+
+		test( 'Run the test', async ( { page, admin, requestUtils } ) => {
+			await Promise.all(
+				Array.from( { length: perPage }, async ( el, index ) => {
+					const { id } = await requestUtils.createPage( {
+						status: 'publish',
+						title: `Page (${ index })`,
+						content: `
+<!-- wp:heading -->
+<p>Hello</p>
+<!-- /wp:heading -->
+<!-- wp:paragraph -->
+<p>Post content</p>
+<!-- /wp:paragraph -->`,
+					} );
+
+					return id;
+				} )
+			);
+
+			const samples = 10;
+			for ( let i = 1; i <= samples; i++ ) {
+				// Start from the trash view, then navigate to all pages, so we
+				// test item loading rather than site editor load as a whole.
+				// For some reason `visiSiteEditor` does not work with these
+				// parameters.
+				await admin.visitAdminPage(
+					'site-editor.php?postType=page&layout=table&activeView=trash'
+				);
+
+				const startTime = performance.now();
+
+				await page.getByRole( 'button', { name: 'All Pages' } ).click();
+
+				// Wait for all pages to be rendered.
+				await Promise.all(
+					Array.from( { length: perPage }, async ( el, index ) => {
+						return await page
+							.getByRole( 'link', {
+								name: `Page (${ index })`,
+							} )
+							.waitFor( { state: 'attached' } );
+					} )
+				);
+
+				const endTime = performance.now();
+
+				results.loadPages.push( endTime - startTime );
+			}
+		} );
+	} );
 } );
 
 /* eslint-enable playwright/no-conditional-in-test, playwright/expect-expect */