M7: portfolio polish and final acceptance

Automated migrations on container startup (backend/entrypoint.sh), scripted n8n workflow activation (make n8n-setup), Playwright E2E test covering the full 9-step demo script (verified passing against the live stack, including the previously-unverified 360px responsive layout), evidence screenshots of all main pages, architecture diagram, and artifacts/evidence/final-summary.md with commit/commands/test counts/RAGcore and n8n evidence/MCP sample calls/known limitations/portfolio wording. Verified the complete clean-checkout path from a genuinely wiped-volumes state: automatic migrations, seed, 66 backend tests passing, and a live S1 return round-tripped through a freshly-activated n8n instance. Added .gitattributes to force LF line endings on shell scripts, preventing a real cross-platform breakage of entrypoint.sh's shebang.

frontend/e2e/_capture-screenshots.spec.ts

@@ -0,0 +1,53 @@
+import { expect, test } from "@playwright/test";
+
+// One-off tooling to capture evidence screenshots for artifacts/evidence/final-summary.md.
+// Not part of the regular test suite (prefixed with `_` and excluded from CI runs).
+
+const OUT = "../artifacts/evidence/screenshots";
+
+test("capture the seven main pages", async ({ page, request }) => {
+  await request.post("http://localhost:8128/api/v1/demo/login", {
+    data: { role: "operations_manager" },
+  });
+  await request.post("http://localhost:8128/api/v1/demo/reset");
+
+  await page.goto("/login");
+  await page.screenshot({ path: `${OUT}/1-login.png` });
+
+  await page.getByRole("button", { name: "Open as Operations Manager" }).click();
+  await expect(page.getByRole("heading", { name: "Operational metrics" })).toBeVisible();
+  await page.screenshot({ path: `${OUT}/2-dashboard.png`, fullPage: true });
+
+  await page.goto("/vehicles");
+  await expect(page.locator(".data-table")).toBeVisible();
+  await page.screenshot({ path: `${OUT}/3-vehicles.png`, fullPage: true });
+
+  await page.goto("/bookings");
+  await expect(page.locator(".data-table")).toBeVisible();
+  await page.screenshot({ path: `${OUT}/4-bookings.png`, fullPage: true });
+
+  await page.goto("/data-quality");
+  await expect(page.locator(".data-table")).toBeVisible();
+  await page.screenshot({ path: `${OUT}/5-data-quality.png`, fullPage: true });
+
+  await page.goto("/knowledge");
+  await page
+    .getByPlaceholder(/What must I do when a vehicle returns with damage/)
+    .fill("What must I do when a vehicle returns with damage?");
+  await page.getByRole("button", { name: "Ask" }).click();
+  await expect(page.getByText("Grounded in cited procedures")).toBeVisible();
+  await page.screenshot({ path: `${OUT}/6-knowledge.png`, fullPage: true });
+
+  await page.goto("/automation");
+  await expect(page.locator(".data-table")).toBeVisible();
+  await page.screenshot({ path: `${OUT}/7-automation.png`, fullPage: true });
+
+  await page.goto("/audit");
+  await expect(page.locator(".data-table")).toBeVisible();
+  await page.screenshot({ path: `${OUT}/8-audit.png`, fullPage: true });
+
+  await page.setViewportSize({ width: 360, height: 800 });
+  await page.goto("/dashboard");
+  await expect(page.getByRole("heading", { name: "Operational metrics" })).toBeVisible();
+  await page.screenshot({ path: `${OUT}/9-mobile-dashboard.png` });
+});

frontend/e2e/demo.spec.ts

@@ -0,0 +1,98 @@
+import { expect, test, type APIRequestContext } from "@playwright/test";
+
+const API_BASE = process.env.MOBILITYOPS_API_URL ?? "http://localhost:8128";
+
+async function resetDemoData(request: APIRequestContext) {
+  const login = await request.post(`${API_BASE}/api/v1/demo/login`, {
+    data: { role: "operations_manager" },
+  });
+  expect(login.ok()).toBeTruthy();
+  const reset = await request.post(`${API_BASE}/api/v1/demo/reset`);
+  expect(reset.ok()).toBeTruthy();
+}
+
+test.describe.configure({ mode: "serial" });
+
+test("five-minute demo script end to end", async ({ page, request }) => {
+  // Reset via a throwaway API session so the UI test starts from the deterministic seed
+  // regardless of what earlier test runs mutated (S1 return, S2 merge, etc.).
+  await resetDemoData(request);
+
+  await test.step("1. login as Operations Manager", async () => {
+    await page.goto("/login");
+    await expect(page.getByText("Synthetic demo environment")).toBeVisible();
+    await page.getByRole("button", { name: "Open as Operations Manager" }).click();
+    await expect(page).toHaveURL(/\/dashboard$/);
+  });
+
+  await test.step("2. verify dashboard metrics are loaded", async () => {
+    await expect(page.getByRole("heading", { name: "Operational metrics" })).toBeVisible();
+    const metricValues = page.locator(".metric-value");
+    await expect(metricValues.first()).toBeVisible();
+    const values = await metricValues.allTextContents();
+    expect(values.length).toBeGreaterThan(0);
+    expect(values.some((v) => Number(v) > 0)).toBeTruthy();
+  });
+
+  await test.step("3. open active demo booking", async () => {
+    await page.goto("/bookings/BK-DEMO-RETURN");
+    await expect(page.getByRole("heading", { name: "BK-DEMO-RETURN" })).toBeVisible();
+    await expect(page.getByText("active", { exact: true })).toBeVisible();
+  });
+
+  await test.step("4. register an odometer-regression return (S1)", async () => {
+    const vehicleOdometerText = await page
+      .locator(".detail-grid div", { hasText: "Start odometer" })
+      .locator("dd")
+      .textContent();
+    const startOdometer = parseInt((vehicleOdometerText ?? "0").replace(/\D/g, ""), 10);
+    const lowReading = Math.max(0, startOdometer - 500);
+
+    await page.getByLabel("End odometer (km)").fill(String(lowReading));
+    await page.getByLabel("Fuel level (%)").fill("55");
+    await page.getByRole("button", { name: "Register return" }).click();
+
+    await expect(page.getByRole("heading", { name: "Return registered" })).toBeVisible();
+  });
+
+  await test.step("5. verify quality issue and queued automation event", async () => {
+    await expect(page.getByText(/DQ-RET-|None created/)).toBeVisible();
+    await expect(page.getByText(/Queued \(/)).toBeVisible();
+  });
+
+  await test.step("6. resolve the duplicate customer scenario (S2)", async () => {
+    await page.goto("/data-quality/DQ-DEMO-DUPLICATE");
+    await expect(page.getByRole("heading", { name: "Compare and merge" })).toBeVisible();
+    await page.getByRole("button", { name: /Merge into CUS-0012/ }).click();
+    await page.getByRole("button", { name: "Yes, merge" }).click();
+    await expect(page.getByText("resolved", { exact: true })).toBeVisible();
+  });
+
+  await test.step("7. ask the damage question and inspect citations (S6)", async () => {
+    await page.goto("/knowledge");
+    await page
+      .getByPlaceholder(/What must I do when a vehicle returns with damage/)
+      .fill("What must I do when a vehicle returns with damage?");
+    await page.getByRole("button", { name: "Ask" }).click();
+    await expect(page.getByText("Grounded in cited procedures")).toBeVisible();
+    await expect(page.getByText("Damage handling procedure").first()).toBeVisible();
+    await expect(page.getByText("Vehicle return procedure").first()).toBeVisible();
+  });
+
+  await test.step("8. inspect audit entries", async () => {
+    await page.goto("/audit");
+    await page.getByLabel("Action").fill("return_registered");
+    await expect(page.locator(".data-table tbody tr").first()).toBeVisible();
+    await expect(page.getByText("return_registered").first()).toBeVisible();
+  });
+
+  await test.step("9. verify responsive navigation at mobile width", async () => {
+    await page.setViewportSize({ width: 360, height: 800 });
+    await page.goto("/dashboard");
+    await expect(page.getByText("Synthetic demo environment")).toBeVisible();
+    await expect(page.getByRole("link", { name: "Dashboard" })).toBeVisible();
+    const scrollWidth = await page.evaluate(() => document.documentElement.scrollWidth);
+    const clientWidth = await page.evaluate(() => document.documentElement.clientWidth);
+    expect(scrollWidth).toBeLessThanOrEqual(clientWidth + 1);
+  });
+});

frontend/package-lock.json

@@ -13,6 +13,7 @@
         "react-router-dom": "7.18.2"
       },
       "devDependencies": {
+        "@playwright/test": "1.62.1",
         "@types/react": "18.3.12",
         "@types/react-dom": "18.3.1",
         "@vitejs/plugin-react": "4.3.4",
@@ -763,6 +764,22 @@
         "node": "^22.20 || ^24.12 || >=25"
       }
     },
+    "node_modules/@playwright/test": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.62.1.tgz",
+      "integrity": "sha512-DTcUc8qii+cpHvtOwggMtBRMjKZHXYWdw8syRYu2vtzuq4Wxphqq4NfCs5Zt44L6mA8rfDfj+PHnxFc/FeK6mQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "playwright": "1.62.1"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
     "node_modules/@rollup/rollup-android-arm-eabi": {
       "version": "4.62.4",
       "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.62.4.tgz",
@@ -1543,6 +1560,53 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/playwright": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.62.1.tgz",
+      "integrity": "sha512-0M+L3LAD8/nm554LOla9Ayx0j0tmFZ0FBcoQ7F1VuVHpM/XpiC8RcDzBQB8W5+hA8L22THxELzeF+2WcUzvcLg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "playwright-core": "1.62.1"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "optionalDependencies": {
+        "fsevents": "2.3.2"
+      }
+    },
+    "node_modules/playwright-core": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.62.1.tgz",
+      "integrity": "sha512-wPYSwEBJY9GHraISXqyqtx0na0LpO3XEX7jNDhntbex7tzUS7kLnZsOlFruFJB4Hi/rhDMjXGqHewDZ68nYZVw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "playwright-core": "cli.js"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/playwright/node_modules/fsevents": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.5.25",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.25.tgz",

frontend/package.json

@@ -7,7 +7,8 @@
     "dev": "vite --host 0.0.0.0",
     "build": "tsc -b && vite build",
     "preview": "vite preview --host 0.0.0.0",
-    "lint": "tsc -b --noEmit"
+    "lint": "tsc -b --noEmit",
+    "test:e2e": "playwright test"
   },
   "dependencies": {
     "react": "18.3.1",
@@ -15,6 +16,7 @@
     "react-router-dom": "7.18.2"
   },
   "devDependencies": {
+    "@playwright/test": "1.62.1",
     "@types/react": "18.3.12",
     "@types/react-dom": "18.3.1",
     "@vitejs/plugin-react": "4.3.4",

frontend/playwright.config.ts

@@ -0,0 +1,23 @@
+import { defineConfig, devices } from "@playwright/test";
+
+export default defineConfig({
+  testDir: "./e2e",
+  // _capture-screenshots.spec.ts is evidence-generation tooling, not a regression test —
+  // it mutates demo data via a reset and is run explicitly, not as part of the suite.
+  testIgnore: "**/_*.spec.ts",
+  timeout: 30_000,
+  fullyParallel: false,
+  workers: 1,
+  reporter: [["list"], ["html", { open: "never", outputFolder: "playwright-report" }]],
+  use: {
+    baseURL: process.env.MOBILITYOPS_PUBLIC_URL ?? "http://localhost:1228",
+    trace: "retain-on-failure",
+    screenshot: "only-on-failure",
+  },
+  projects: [
+    {
+      name: "chromium",
+      use: { ...devices["Desktop Chrome"] },
+    },
+  ],
+});