From e5e69aadf6df93c8f1bdeb44498495ba40ca5454 Mon Sep 17 00:00:00 2001
From: "Morten V. Christiansen" <mvoetmann@gmail.com>
Date: Sun, 5 Apr 2026 12:13:25 +0200
Subject: [PATCH] Add Playwright regression tests

---
 kort7/.gitignore           |  3 ++
 kort7/package.json         | 11 +++++++
 kort7/playwright.config.js | 17 +++++++++++
 kort7/tests/kort7.spec.js  | 62 ++++++++++++++++++++++++++++++++++++++
 4 files changed, 93 insertions(+)
 create mode 100644 kort7/.gitignore
 create mode 100644 kort7/package.json
 create mode 100644 kort7/playwright.config.js
 create mode 100644 kort7/tests/kort7.spec.js

diff --git a/kort7/.gitignore b/kort7/.gitignore
new file mode 100644
index 0000000..945fcd0
--- /dev/null
+++ b/kort7/.gitignore
@@ -0,0 +1,3 @@
+node_modules/
+playwright-report/
+test-results/
diff --git a/kort7/package.json b/kort7/package.json
new file mode 100644
index 0000000..c272bb5
--- /dev/null
+++ b/kort7/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "kort7",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "test:e2e": "playwright test"
+  },
+  "devDependencies": {
+    "playwright": "^1.52.0"
+  }
+}
\ No newline at end of file
diff --git a/kort7/playwright.config.js b/kort7/playwright.config.js
new file mode 100644
index 0000000..4d1d84f
--- /dev/null
+++ b/kort7/playwright.config.js
@@ -0,0 +1,17 @@
+const { defineConfig } = require('@playwright/test');
+
+module.exports = defineConfig({
+  testDir: './tests',
+  timeout: 30000,
+  use: {
+    baseURL: 'http://127.0.0.1:4173',
+    headless: true,
+    viewport: { width: 1440, height: 900 }
+  },
+  webServer: {
+    command: 'python3 -m http.server 4173 --bind 127.0.0.1',
+    port: 4173,
+    reuseExistingServer: true,
+    timeout: 10000
+  }
+});
\ No newline at end of file
diff --git a/kort7/tests/kort7.spec.js b/kort7/tests/kort7.spec.js
new file mode 100644
index 0000000..5dd227b
--- /dev/null
+++ b/kort7/tests/kort7.spec.js
@@ -0,0 +1,62 @@
+const { test, expect } = require('@playwright/test');
+
+async function waitForVehicleMarkers(page) {
+  await page.waitForSelector('.leaflet-marker-icon', { state: 'attached' });
+  await expect(page.locator('.leaflet-marker-icon')).toHaveCount(5, { timeout: 10000 });
+}
+
+test.describe('kort7 vehicle map', () => {
+  test('loads map and renders vehicles', async ({ page }) => {
+    await page.goto('/kort7.html');
+    await expect(page.locator('#map')).toBeVisible();
+    await waitForVehicleMarkers(page);
+    await expect(page.locator('#status')).toContainText('Simuleret tid');
+  });
+
+  test('shows vehicle popup with details when clicking a marker', async ({ page }) => {
+    await page.goto('/kort7.html');
+    await waitForVehicleMarkers(page);
+
+    const firstMarker = page.locator('.leaflet-marker-icon').first();
+    await firstMarker.click();
+
+    const popup = page.locator('.leaflet-popup');
+    await expect(popup).toBeVisible();
+    await expect(popup).toContainText(/Bil \d/);
+    await expect(popup).toContainText('Tid:');
+    await expect(popup).toContainText('Lat:');
+    await expect(popup).toContainText('Lon:');
+    await expect(popup).toContainText('Hastighed:');
+    await expect(popup).toContainText('Retning:');
+    await expect(popup).toContainText('Usikkerhed:');
+    await expect(popup).toContainText('På kortet:');
+  });
+
+  test('renders uncertainty circles for vehicles with uncertainty', async ({ page }) => {
+    await page.goto('/kort7.html');
+    await waitForVehicleMarkers(page);
+
+    await expect.poll(async () => {
+      return await page.locator('path.leaflet-interactive').evaluateAll((nodes) =>
+        nodes.filter((node) => {
+          const strokeDasharray = node.getAttribute('stroke-dasharray');
+          return strokeDasharray && strokeDasharray.length > 0;
+        }).length
+      );
+    }).toBeGreaterThan(0);
+  });
+
+  test('playback updates simulation status over time', async ({ page }) => {
+    await page.goto('/kort7.html');
+
+    const status = page.locator('#status');
+    await expect(status).toContainText('Simuleret tid: 0.0 s');
+
+    await page.waitForTimeout(1800);
+
+    const text = await status.textContent();
+    const match = text.match(/Simuleret tid: ([\d.]+) s/);
+    expect(match).not.toBeNull();
+    expect(Number(match[1])).toBeGreaterThan(0.5);
+  });
+});
\ No newline at end of file