[CI] Speed up E2E tests (#2961)

## Motivation for the change, related issues

E2E tests take ~30 minutes. Let's see how fast we can make them.

This PR:

* Inlines the "prepare e2e tests" job, which takes 14 minutes but only
does ~5 minutes of meaningful work.
* Uses 3 worker for Chromium E2E tests and 3 workers for Firefox E2E
tests.

As a result, Chromium finishes in 10-14 minutes, and Firefox in ~20
minutes (compared to ~30 minutes before this PR).

Author: adamziel

.github/workflows/ci.yml

@@ -181,8 +181,36 @@ jobs:
               with:
                   name: cypress-screenshots
                   path: dist/cypress/packages/playground/website/screenshots
-    test-e2e-playwright-prepare:
+    # E2E Playwright tests - builds inline per runner for faster parallel execution
+    # Previously used a prepare job + artifact sharing, but inline builds allow
+    # all shards to start immediately in parallel, reducing total wall time.
+    test-e2e-playwright:
         runs-on: ubuntu-latest
+        strategy:
+            fail-fast: false
+            matrix:
+                # 3 shards per browser for balanced parallel execution
+                # (4 shards caused uneven distribution due to serial test files)
+                # WebKit disabled - random failures, see PR #2475
+                include:
+                    - browser: 'chromium'
+                      shard: '1/3'
+                      shard_name: '1-of-3'
+                    - browser: 'chromium'
+                      shard: '2/3'
+                      shard_name: '2-of-3'
+                    - browser: 'chromium'
+                      shard: '3/3'
+                      shard_name: '3-of-3'
+                    - browser: 'firefox'
+                      shard: '1/3'
+                      shard_name: '1-of-3'
+                    - browser: 'firefox'
+                      shard: '2/3'
+                      shard_name: '2-of-3'
+                    - browser: 'firefox'
+                      shard: '3/3'
+                      shard_name: '3-of-3'
         steps:
             - name: Free up runner disk space
               shell: bash
@@ -201,68 +229,33 @@ jobs:
               with:
                   submodules: true
             - uses: ./.github/actions/prepare-playground
-            - name: Install Playwright Browsers
-              run: sudo npx playwright install --with-deps
-            - name: Prepare app deploy and offline mode
-              run: CORS_PROXY_URL=http://127.0.0.1:5263/cors-proxy.php? npx nx e2e:playwright:prepare-app-deploy-and-offline-mode playground-website
-            - name: Zip dist
-              run: zip -r dist.zip dist
-            - name: Upload dist
-              uses: actions/upload-artifact@v4
-              with:
-                  name: playwright-dist
-                  path: dist.zip
-    test-e2e-playwright:
-        runs-on: ubuntu-latest
-        needs: [test-e2e-playwright-prepare]
-        strategy:
-            fail-fast: false
-            matrix:
-                # WebKit runner is disabled in CI – it used to be enabled but the tests
-                # failed randomly without any obvious reason.
-                # @see https://github.com/WordPress/wordpress-playground/pull/2475
-                part: ['chromium', 'firefox']
-        steps:
-            - uses: actions/checkout@v4
-              with:
-                  submodules: true
-            - uses: ./.github/actions/prepare-playground
-            - name: Download dist
-              uses: actions/download-artifact@v4
-              with:
-                  name: playwright-dist
-            - name: Unzip dist
-              run: unzip dist.zip
             - name: Install Playwright Browser
-              run: sudo npx playwright install ${{ matrix.part }} --with-deps
-            - name: Run Playwright tests - ${{ matrix.part }}
+              run: sudo npx playwright install ${{ matrix.browser }} --with-deps
+            - name: Build app for E2E tests
+              run: CORS_PROXY_URL=http://127.0.0.1:5263/cors-proxy.php? npx nx e2e:playwright:prepare-app-deploy-and-offline-mode playground-website
+            - name: Run Playwright tests - ${{ matrix.browser }}${{ matrix.shard && format(' (shard {0})', matrix.shard) || '' }}
               run: |
-                  if [ "${{ matrix.part }}" = "firefox" ]; then
-                    sudo -E HOME=/root XDG_RUNTIME_DIR=/root CI=true npx playwright test --config=packages/playground/website/playwright/playwright.ci.config.ts --project=${{ matrix.part }}
+                  SHARD_ARG=""
+                  if [ -n "${{ matrix.shard }}" ]; then
+                    SHARD_ARG="--shard=${{ matrix.shard }}"
+                  fi
+                  if [ "${{ matrix.browser }}" = "firefox" ]; then
+                    sudo -E HOME=/root XDG_RUNTIME_DIR=/root CI=true npx playwright test --config=packages/playground/website/playwright/playwright.ci.config.ts --project=${{ matrix.browser }} $SHARD_ARG
                   else
-                    sudo CI=true npx playwright test --config=packages/playground/website/playwright/playwright.ci.config.ts --project=${{ matrix.part }}
+                    sudo CI=true npx playwright test --config=packages/playground/website/playwright/playwright.ci.config.ts --project=${{ matrix.browser }} $SHARD_ARG
                   fi
             - uses: actions/upload-artifact@v4
               if: ${{ !cancelled() }}
               with:
-                  name: playwright-report-${{ matrix.part }}
+                  name: playwright-report-${{ matrix.browser }}${{ matrix.shard_name && format('-shard-{0}', matrix.shard_name) || '' }}
                   path: packages/playground/website/playwright-report/
                   if-no-files-found: ignore
             - uses: actions/upload-artifact@v4
               if: ${{ !cancelled() }}
               with:
-                  name: playwright-snapshots-${{ matrix.part }}
+                  name: playwright-snapshots-${{ matrix.browser }}${{ matrix.shard_name && format('-shard-{0}', matrix.shard_name) || '' }}
                   path: packages/playground/website/playwright/e2e/deployment.spec.ts-snapshots/
                   if-no-files-found: ignore
-    test-e2e-playwright-cleanup:
-        runs-on: ubuntu-latest
-        needs: [test-e2e-playwright]
-        steps:
-            - name: Delete playwright-dist artifact
-              uses: geekyeggo/delete-artifact@v5
-              if: ${{ success() }}
-              with:
-                  name: playwright-dist
 
     test-e2e-components:
         runs-on: ubuntu-latest

packages/playground/website/playwright/e2e/deployment.spec.ts

@@ -3,6 +3,10 @@ import path from 'path';
 import { test, expect } from '../playground-fixtures.ts';
 import { startVersionSwitchingServer as startServer } from '../version-switching-server.ts';
 
+// Tests in this file share a server on port 7999, so they must run serially
+// to avoid EADDRINUSE errors from multiple tests trying to bind the same port.
+test.describe.configure({ mode: 'serial' });
+
 const port = 7999;
 const url = new URL(`http://localhost:${port}`);
 // Disable login because an old WP build used in this test