feat(ai): add minimal reproducers for known issues (agent)

Add minimal Playwright reproducers for:
- Popover demo 404 error (missing module)
- Sidebar layout regression on mobile
- Video Modal height regression on mobile

These scripts are located in `examples/reproducers/` and use a dedicated configuration file.

examples/reproducers/001-popover-404/repro.spec.ts

@@ -0,0 +1,16 @@
+import { test } from "@playwright/test";
+import {
+  applyReducedMotion,
+  failOnConsoleErrors,
+} from "../../../tests/e2e/helpers/uiTestUtils";
+
+test.describe("repro popover 404", () => {
+  test.beforeEach(async ({ page }) => {
+    await applyReducedMotion(page);
+    failOnConsoleErrors(page);
+  });
+
+  test("fails to load popover demo due to 404", async ({ page }) => {
+    await page.goto("/views/dev/popover-demo.html", { waitUntil: "networkidle" });
+  });
+});

examples/reproducers/002-sidebar-layout/repro.spec.ts

@@ -0,0 +1,26 @@
+import { expect, test } from "@playwright/test";
+
+test("mobile sidebar layout regression", async ({ page }) => {
+  await page.setViewportSize({ width: 390, height: 844 });
+  await page.goto("/index.html", { waitUntil: "networkidle" });
+
+  // Dismiss disclaimer
+  await page.evaluate(() => {
+    window.localStorage?.setItem("hasSeenDisclaimer", "true");
+    document.getElementById("disclaimerModal")?.remove();
+    document.documentElement.classList.remove("modal-open");
+  });
+
+  const toggle = page.locator("#sidebarCollapseToggle");
+  await toggle.click({ force: true });
+
+  await expect(page.locator("#sidebar")).toHaveClass(/sidebar-expanded/);
+
+  const marginLeft = await page.evaluate(() => {
+    const app = document.getElementById("app");
+    return parseFloat(window.getComputedStyle(app!).marginLeft);
+  });
+
+  // It should be 0 on mobile even if expanded (overlay mode).
+  expect(marginLeft).toBe(0);
+});

examples/reproducers/003-video-modal-reg/repro.spec.ts

@@ -0,0 +1,25 @@
+import { expect, test } from "@playwright/test";
+
+test("video modal mobile regression", async ({ page }) => {
+  await page.setViewportSize({ width: 390, height: 844 });
+  await page.goto("/components/video-modal.html", { waitUntil: "networkidle" });
+
+  await page.evaluate(() => {
+    const modal = document.getElementById("playerModal");
+    if (modal) {
+      modal.classList.remove("hidden");
+      modal.removeAttribute("hidden");
+      modal.setAttribute("data-ds", "new");
+    }
+  });
+
+  const modal = page.locator("#playerModal");
+  await expect(modal).toBeVisible();
+
+  // Wait a bit for layout
+  await page.waitForTimeout(100);
+
+  // Check height which was failing (1561 vs 1554)
+  const box = await modal.boundingBox();
+  expect(box?.height).toBe(1554);
+});

examples/reproducers/playwright.config.ts

@@ -0,0 +1,13 @@
+import { defineConfig } from "@playwright/test";
+import baseConfig from "../../playwright.config";
+
+export default defineConfig({
+  ...baseConfig,
+  testDir: ".",
+  projects: [
+    {
+      name: "repro",
+      testMatch: "**/*.spec.ts",
+    },
+  ],
+});