PoC: Run E2E tests with WP Playground

.github/workflows/end2end-test.yml

@@ -41,15 +41,41 @@ jobs:
               run: |
                   npx playwright install chromium firefox webkit --with-deps
 
-            - name: Install WordPress and start the server
+            - name: Checkout Playground repository
+              uses: actions/checkout@a5ac7e51b41094c92402da3b24376905380afc29 # v4.1.6
+              with:
+                  repository: WordPress/wordpress-playground
+                  path: playground
+
+            - name: Setup Playground
+              run: |
+                  # Install Bun
+                  curl -fsSL https://bun.sh/install | bash # install bun
+
+                  # Install the dependencies
+                  cd playground
+                  npm install
+
+            - name: Start the server
               run: |
-                  npm run wp-env start
+                  cd playground
+                  ~/.bun/bin/bun packages/playground/cli/src/cli.ts server \
+                      --wp=6.5 \
+                      --mount=../:/wordpress/wp-content/plugins/gutenberg \
+                      --mount=../test/emptytheme:/wordpress/wp-content/themes/emptytheme \
+                      --mount=../test/gutenberg-test-themes:/wordpress/wp-content/themes/gutenberg-test-themes \
+                      --mount=../packages/e2e-tests/mu-plugins:/wordpress/wp-content/mu-plugins \
+                      --mount=../packages/e2e-tests/plugins:/wordpress/wp-content/plugins/gutenberg-test-plugins \
+                      --blueprint=../test/e2e/playground.blueprint.json \
+                      &
 
             - name: Run the tests
               env:
                   PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 1
               run: |
-                  xvfb-run --auto-servernum --server-args="-screen 0 1280x960x24" -- npm run test:e2e -- --shard=${{ matrix.part }}/${{ matrix.totalParts }}
+                  WP_BASE_URL=http://127.0.0.1:9400/ \
+                  xvfb-run --auto-servernum --server-args="-screen 0 1280x960x24" -- \
+                  npm run test:e2e -- --shard=${{ matrix.part }}/${{ matrix.totalParts }}
 
             - name: Archive debug artifacts (screenshots, traces)
               uses: actions/upload-artifact@65462800fd760344b1a7b4382951275a0abb4808 # v4.3.3

test/e2e/config/global-setup.ts

@@ -25,19 +25,6 @@ async function globalSetup( config: FullConfig ) {
 	// Authenticate and save the storageState to disk.
 	await requestUtils.setupRest();
 
-	// Reset the test environment before running the tests.
-	await Promise.all( [
-		requestUtils.activateTheme( 'twentytwentyone' ),
-		// Disable this test plugin as it's conflicting with some of the tests.
-		// We already have reduced motion enabled and Playwright will wait for most of the animations anyway.
-		requestUtils.deactivatePlugin(
-			'gutenberg-test-plugin-disables-the-css-animations'
-		),
-		requestUtils.deleteAllPosts(),
-		requestUtils.deleteAllBlocks(),
-		requestUtils.resetPreferences(),
-	] );
-
 	await requestContext.dispose();
 }
 

test/e2e/playground.blueprint.json

@@ -0,0 +1,37 @@
+{
+	"$schema": "https://playground.wordpress.net/blueprint-schema.json",
+	"siteOptions": {
+		"blogname": "Gutenberg E2E Tests"
+	},
+	"steps": [
+		{
+			"step": "installTheme",
+			"themeZipFile": {
+				"resource": "wordpress.org/themes",
+				"slug": "twentytwenty"
+			}
+		},
+		{
+			"step": "installTheme",
+			"themeZipFile": {
+				"resource": "wordpress.org/themes",
+				"slug": "twentytwentyone"
+			}
+		},
+		{
+			"step": "installTheme",
+			"themeZipFile": {
+				"resource": "wordpress.org/themes",
+				"slug": "twentytwentythree"
+			}
+		},
+		{
+			"step": "activateTheme",
+			"themeFolderName": "twentytwentyone"
+		},
+		{
+			"step": "activatePlugin",
+			"pluginPath": "gutenberg/gutenberg.php"
+		}
+	]
+}

test/e2e/playwright.config.ts

@@ -13,9 +13,11 @@ const baseConfig = require( '@wordpress/scripts/config/playwright.config' );
 const config = defineConfig( {
 	...baseConfig,
 	reporter: process.env.CI
-		? [ [ 'github' ], [ './config/flaky-tests-reporter.ts' ] ]
+		? [ [ 'github' ], [ 'list' ], [ './config/flaky-tests-reporter.ts' ] ]
 		: 'list',
 	workers: 1,
+	retries: 0,
+	webServer: undefined,
 	globalSetup: fileURLToPath(
 		new URL( './config/global-setup.ts', 'file:' + __filename ).href
 	),