Chore(ci): Migrate E2E tests to docker compose template

.github/workflows/e2e.yml

@@ -66,7 +66,7 @@ jobs:
         run: echo "site_url=${{ env.NETLIFY_DEPLOYED_URL }}" >> "$GITHUB_OUTPUT"
 
       - name: Run Playwright tests
-        uses: docker://mcr.microsoft.com/playwright:v1.49.1-jammy
+        uses: docker://mcr.microsoft.com/playwright:v1.49.1-noble
         with:
           args: 'sh -c "corepack install && corepack enable && yarn test:e2e"'
         env:

bin/make/e2e.sh

@@ -1,7 +1,9 @@
-#!/bin/sh
+#!/usr/bin/env bash
 
 set -o errexit
 
+project_root=$(cd $(dirname "${BASH_SOURCE}")/../..; pwd)
+
 if ! command -v jq &> /dev/null; then
   echo "jq could not be found, please install it."
   exit 1
@@ -35,4 +37,15 @@ while [[ $# -gt 0 ]]; do
     shift
 done
 
-docker run --rm --network=host --ipc=host  -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v$PLAYWRIGHT_VERSION-$UBUNTU_VERSION $XVFB sh -c "corepack install && corepack enable && yarn test:e2e$E2E_FLAG"
+if [ "$(uname)" = "MINGW64_NT" ] || [ "$(uname)" = "MINGW32_NT" ]; then
+    # Convert Windows path to Unix path for Docker
+    WORK_DIR=$(cygpath -u "$(pwd)")
+else
+    WORK_DIR=$(pwd)
+fi
+
+export PLAYWRIGHT_VERSION
+export E2E_FLAG
+export XVFB
+
+docker compose --file "${project_root}/docker/docker-compose-e2e.yml" run --rm e2e

docker/docker-compose-e2e.yml

@@ -0,0 +1,17 @@
+services:
+  e2e:
+    init: true
+    image: mcr.microsoft.com/playwright:v1.49.1-noble
+    working_dir: /work/
+    volumes:
+      - ${PWD}:/work/
+    ipc: host
+    network_mode: host
+    environment:
+      - NODE_OPTIONS="--experimental-modules"
+    command: >
+      bash -c "set -x &&
+      corepack enable && corepack install &&
+      echo 'Starting xvfb-run' &&
+      xvfb-run --auto-servernum --server-args='-screen 0 1920x1080x24' bash -c 'echo Xvfb started && PWDEBUG=1 yarn playwright test --ui-host=0.0.0.0 --debug' &&
+      echo 'Finished xvfb-run'"

package.json

@@ -34,10 +34,10 @@
     "storybook": "lerna run start --scope=@lmc-eu/spirit-storybook",
     "test": "yarn packages:test",
     "test:unit": "yarn packages:test:unit",
-    "test:e2e": "yarn playwright test",
-    "test:e2e:update": "yarn playwright test --update-snapshots",
-    "test:e2e:report": "yarn playwright show-report",
-    "test:e2e:ui": "yarn playwright test --ui",
+    "test:e2e": "PW_EXPERIMENTAL_TS_ESM=1 yarn playwright test",
+    "test:e2e:update": "yarn test:e2e --update-snapshots",
+    "test:e2e:report": "yarn test:e2e -- show-report",
+    "test:e2e:ui": "PWDEBUG=1 yarn test:e2e --ui",
     "types": "yarn packages:types",
     "lint": "npm-run-all --parallel es:lint lint:markdown packages:lint",
     "lint:fix": "npm-run-all --parallel es:lint:fix packages:lint:fix",