MobilityOps/frontend/e2e/_capture-demo-screenshots.spec.ts

import { expect, test } from "@playwright/test";

// One-off tooling to capture demo-productization evidence screenshots for
// artifacts/demo-release/final-summary.md. Not part of the regular test suite
// (prefixed with `_` and excluded from the configured test run via testIgnore).

const OUT = "../artifacts/demo-release/screenshots";

test("capture demo-release evidence screenshots", async ({ page, request }) => {
  await request.post("/api/v1/demo/login", { data: { role: "operations_manager" } });
  await request.post("/api/v1/demo/reset");

  await page.goto("/login");
  await expect(page.getByText(/Northstar Mobility/)).toBeVisible();
  await page.screenshot({ path: `${OUT}/01-demo-entry-desktop.png`, fullPage: true });

  await page.setViewportSize({ width: 390, height: 844 });
  await page.screenshot({ path: `${OUT}/02-demo-entry-mobile.png` });
  await page.setViewportSize({ width: 1280, height: 900 });

  await page.getByRole("button", { name: "Verken als Operations Manager" }).click();
  await expect(page).toHaveURL(/\/dashboard$/);
  await expect(page.getByText("Probeer een demonstratiescenario")).toBeVisible();
  await page.screenshot({ path: `${OUT}/03-dashboard-with-scenarios.png`, fullPage: true });

  await page.getByRole("button", { name: /Demo-gids/ }).click();
  await expect(page.getByRole("dialog", { name: "Gegidste demo" })).toBeVisible();
  await page.screenshot({ path: `${OUT}/04-demo-guide.png` });
  await page.getByRole("button", { name: "Sluiten" }).click();

  await page.goto("/bookings/BK-DEMO-RETURN");
  await expect(page.getByText("Demonstratiescenario: afwijkende kilometerstand")).toBeVisible();
  await page.getByRole("button", { name: "Review return" }).click();
  await expect(page.getByText(/Expected fleet state/)).toBeVisible();
  await page.screenshot({ path: `${OUT}/05-return-preview.png`, fullPage: true });
  await page.getByRole("button", { name: "Confirm return" }).click();
  await expect(page.getByRole("heading", { name: "Return registered" })).toBeVisible();
  await page.screenshot({ path: `${OUT}/06-return-result.png`, fullPage: true });

  await page.goto("/data-quality");
  await expect(page.locator(".data-table tbody tr").first()).toBeVisible();
  await page.locator(".data-table tbody tr").first().locator("a").click();
  await expect(page.getByText("What's wrong")).toBeVisible();
  await page.screenshot({ path: `${OUT}/07-data-quality-resolution.png`, fullPage: true });
  await page.getByRole("radio", { name: /Retain canonical/ }).check();
  await page.getByRole("button", { name: "Resolve issue" }).click();
  await expect(page.getByText(/Issue .* resolved/)).toBeVisible();

  await page.goto("/data-quality/DQ-DEMO-DUPLICATE");
  await expect(page.getByRole("heading", { name: "Compare and merge" })).toBeVisible();
  await page.screenshot({ path: `${OUT}/08-duplicate-customer-merge.png`, fullPage: true });

  await page.goto("/knowledge");
  await page.getByRole("button", { name: "What must I do when a vehicle returns with damage?" }).click();
  await expect(page.getByText("Grounded in cited procedures")).toBeVisible();
  await page.screenshot({ path: `${OUT}/09-knowledge-assistant.png`, fullPage: true });

  await page.goto("/automation");
  await expect(page.locator(".integration-cards")).toBeVisible();
  await page.screenshot({ path: `${OUT}/10-integration-status.png`, fullPage: true });
  const failedRetry = page.locator(".data-table tbody tr", { hasText: "failed" }).first();
  if (await failedRetry.count()) {
    await page.screenshot({ path: `${OUT}/11-automation-retry-before.png`, fullPage: true });
    await failedRetry.getByRole("button", { name: "Retry" }).click();
    await page.waitForTimeout(500);
    await page.screenshot({ path: `${OUT}/11-automation-retry-after.png`, fullPage: true });
  }

  await page.goto("/audit");
  await expect(page.locator(".data-table tbody tr").first()).toBeVisible();
  await page.screenshot({ path: `${OUT}/12-audit-trail.png`, fullPage: true });
  await page.locator(".data-table tbody tr").first().getByRole("button", { name: "View related events" }).click();
  await page.screenshot({ path: `${OUT}/13-audit-related-events.png`, fullPage: true });

  await page.goto("/about");
  await expect(page.getByRole("heading", { name: "Wat MobilityOps wel en niet is" })).toBeVisible();
  await page.screenshot({ path: `${OUT}/14-about-demo.png`, fullPage: true });

  await page.goto("/dashboard");
  await page.getByRole("button", { name: /Synthetische demo/ }).click();
  await expect(page.getByRole("dialog", { name: "Over deze demo-omgeving" })).toBeVisible();
  await page.screenshot({ path: `${OUT}/15-demo-badge-popover.png` });

  // Final reset, captured, to leave the environment fully restored.
  await page.keyboard.press("Escape");
  const resetButton = page.getByRole("button", { name: "Reset demo data" });
  if (await resetButton.count()) {
    await resetButton.click();
    await expect(page.getByRole("button", { name: "Yes, reset" })).toBeVisible();
    await page.screenshot({ path: `${OUT}/16-reset-confirm.png` });
    await page.getByRole("button", { name: "Yes, reset" }).click();
    await expect(page).toHaveURL(/\/login$/);
  }
});