From be7d4f8b469c4575027e2ea8c735da607214aafa Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Mon, 2 Dec 2024 17:18:24 +0000
Subject: [PATCH] Use headed mode for Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 .github/workflows/end-to-end-tests.yaml | 9 +++++++--
 playwright.config.ts                    | 1 +
 playwright/Dockerfile                   | 2 +-
 playwright/docker-entrypoint.sh         | 2 +-
 4 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/end-to-end-tests.yaml b/.github/workflows/end-to-end-tests.yaml
index 1a31f75065..a3108b292f 100644
--- a/.github/workflows/end-to-end-tests.yaml
+++ b/.github/workflows/end-to-end-tests.yaml
@@ -83,7 +83,7 @@ jobs:
         name: "Run Tests ${{ matrix.runner }}/${{ strategy.job-total }}"
         needs: build
         if: inputs.skip != true
-        runs-on: ubuntu-22.04
+        runs-on: ubuntu-24.04
         permissions:
             actions: read
             issues: read
@@ -131,7 +131,12 @@ jobs:
               run: yarn playwright install --with-deps
 
             - name: Run Playwright tests
-              run: yarn playwright test --shard ${{ matrix.runner }}/${{ strategy.job-total }}
+              uses: coactions/setup-xvfb@6b00cf1889f4e1d5a48635647013c0508128ee1a
+              timeout-minutes: 30
+              with:
+                  run: "yarn playwright test --shard ${{ matrix.runner }}/${{ strategy.job-total }}"
+              env:
+                  HEADED: 1
 
             - name: Upload blob report to GitHub Actions Artifacts
               if: always()
diff --git a/playwright.config.ts b/playwright.config.ts
index 1c1d380042..bd0bf8d539 100644
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -21,6 +21,7 @@ export default defineConfig({
             args: ["--use-fake-ui-for-media-stream", "--use-fake-device-for-media-stream", "--mute-audio"],
         },
         trace: "on-first-retry",
+        headless: !!process.env.HEADED,
     },
     webServer: {
         command: process.env.CI ? "npx serve -p 8080 -L ./webapp" : "yarn start",
diff --git a/playwright/Dockerfile b/playwright/Dockerfile
index 2b30c416f7..e5cea391e3 100644
--- a/playwright/Dockerfile
+++ b/playwright/Dockerfile
@@ -3,7 +3,7 @@ FROM mcr.microsoft.com/playwright:v1.49.0-jammy
 WORKDIR /work
 
 # fonts-dejavu is needed for the same RTL rendering as on CI
-RUN apt-get update && apt-get -y install docker.io fonts-dejavu
+RUN apt-get update && apt-get -y install docker.io fonts-dejavu xvfb
 
 COPY docker-entrypoint.sh /opt/docker-entrypoint.sh
 ENTRYPOINT ["bash", "/opt/docker-entrypoint.sh"]
diff --git a/playwright/docker-entrypoint.sh b/playwright/docker-entrypoint.sh
index 241528a29a..51161297a3 100644
--- a/playwright/docker-entrypoint.sh
+++ b/playwright/docker-entrypoint.sh
@@ -2,4 +2,4 @@
 
 set -e
 
-npx playwright test --update-snapshots --reporter line $@
+HEADED=1 xvfb-run npx playwright test --update-snapshots --reporter line $@