Add a simple Playwright test

.github/workflows/test.yml

@@ -62,6 +62,29 @@ jobs:
           load: true
       - name: Run Perl tests
         run: docker run -i ${{ steps.docker-build-test.outputs.imageid }}
+  playwright:
+    runs-on: ubuntu-24.04
+    name: playwright test
+    steps:
+      - uses: actions/checkout@v4
+      - name: Build test image
+        id: docker-build-test
+        uses: docker/build-push-action@v6
+        with:
+          target: server
+          push: false
+          load: true
+      - name: Run Perl tests
+        run: >
+          docker run -d -i -p 8000:80
+          ${{ steps.docker-build-test.outputs.imageid }}
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+      - name: Install Playwright Browsers
+        run: ./bin/install-playwright
+      - name: Run Playwright tests
+        run: npx playwright test
   test:
     runs-on: ubuntu-24.04
     name: Dockerless

.gitignore

@@ -12,6 +12,7 @@
 /metacpan_web_local.*
 /node_modules/
 /perltidy.LOG
+/playwright
 /pm_to_blib
 /tidyall.ERR
 /var

bin/install-playwright

@@ -0,0 +1,5 @@
+#!/bin/bash
+
+set -eu -o pipefail
+npm i
+npx playwright install chromium --with-deps

e2e/home.spec.ts

@@ -0,0 +1,6 @@
+import { test, expect } from '@playwright/test';
+
+test('home page', async ({ page }) => {
+  await page.goto('/');
+  await expect(page).toHaveTitle(/Search the CPAN - metacpan.org/, { timeout: 10 });
+});

package.json

@@ -18,6 +18,7 @@
   "homepage": "https://github.com/metacpan/metacpanweb#readme",
   "devDependencies": {
     "@eslint/js": "^9.5.0",
+    "@playwright/test": "^1.52.0",
     "eslint": "^9.25.1",
     "globals": "^16.0.0",
     "js-beautify": "^1.15.4",

playwright.config.ts

@@ -0,0 +1,52 @@
+import { defineConfig, devices } from "@playwright/test";
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+    testDir: "./e2e",
+    outputDir: "./playwright/test-results",
+    /* Run tests in files in parallel */
+    fullyParallel: true,
+    /* Fail the build on CI if you accidentally left test.only in the source code. */
+    // forbidOnly: !!process.env.CI,
+    /* Retry on CI only */
+    retries: 0,
+    /* Opt out of parallel tests on CI. */
+    // workers: process.env.CI ? 1 : undefined,
+    workers: 1,
+    /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+    reporter: [["html", { outputFolder: "./playwright/report" }]],
+    /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+    use: {
+        /* Base URL to use in actions like `await page.goto('/')`. */
+        baseURL: "http://127.0.0.1:8000",
+
+        /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+        trace: "on-first-retry",
+    },
+
+    /* Configure projects for major browsers */
+    projects: [
+        {
+            name: "chromium",
+            use: { ...devices["Desktop Chrome"] },
+        },
+
+        // {
+        // name: 'firefox',
+        // use: { ...devices['Desktop Firefox'] },
+        // },
+        //
+        // {
+        // name: 'webkit',
+        // use: { ...devices['Desktop Safari'] },
+        // },
+    ],
+});