import { expect, test, type Page } from "@playwright/test"; async function ensureSignedIn(page: Page) { await page.goto("/"); const devLogin = page.getByRole("button", { name: "Dev login" }); if (await devLogin.isVisible().catch(() => false)) { await devLogin.click(); await page.waitForURL((url) => url.pathname === "/"); } await expect(page.getByRole("heading", { name: "Dashboard" })).toBeVisible(); } async function openFabAction(page: Page, actionLabel: string) { await page.getByRole("button", { name: "Quick add" }).click(); await expect(page.getByRole("dialog", { name: "Quick add" })).toBeVisible(); await page.getByRole("button", { name: actionLabel, exact: true }).click(); await expect(page).toHaveURL("/"); } type FabQuickAddCase = { action: string; dialog: string; assertCreateControls: (page: Page) => Promise; }; const fabQuickAddCases: FabQuickAddCase[] = [ { action: "New event", dialog: "New event", assertCreateControls: async (page) => { await expect(page.getByLabel("Title")).toBeVisible(); await expect(page.getByRole("button", { name: "Save event" })).toBeVisible(); }, }, { action: "New calendar", dialog: "New calendar", assertCreateControls: async (page) => { await expect(page.getByLabel("Name")).toBeVisible(); await expect(page.getByRole("button", { name: "Create calendar" })).toBeVisible(); }, }, { action: "Add to shopping", dialog: "Add to shopping", assertCreateControls: async (page) => { await expect(page.getByLabel("Item")).toBeVisible(); await expect(page.getByRole("button", { name: "Add" })).toBeVisible(); }, }, { action: "Add to tasks", dialog: "Add to tasks", assertCreateControls: async (page) => { await expect(page.getByLabel("Task")).toBeVisible(); await expect(page.getByRole("button", { name: "Add" })).toBeVisible(); }, }, { action: "New list", dialog: "New list", assertCreateControls: async (page) => { await expect(page.getByLabel("Type")).toBeVisible(); await expect(page.getByLabel("Name")).toBeVisible(); await expect(page.getByRole("button", { name: "Create list" })).toBeVisible(); }, }, { action: "New note", dialog: "New note", assertCreateControls: async (page) => { await expect(page.getByLabel("Title")).toBeVisible(); await expect(page.getByLabel("Body")).toBeVisible(); await expect(page.getByRole("button", { name: "Save note" })).toBeVisible(); }, }, { action: "Add plant", dialog: "Add plant", assertCreateControls: async (page) => { await expect(page.getByLabel("Name")).toBeVisible(); await expect(page.getByRole("button", { name: "Create" })).toBeVisible(); }, }, { action: "Add container", dialog: "Add container", assertCreateControls: async (page) => { await expect(page.getByLabel("Name")).toBeVisible(); await expect(page.getByLabel("Type")).toBeVisible(); await expect(page.getByRole("button", { name: "Create" })).toBeVisible(); }, }, { action: "Log plant care", dialog: "Log plant care", assertCreateControls: async (page) => { const plantField = page.getByLabel("Plant"); const noPlants = page.getByText("No plants yet"); await expect(plantField.or(noPlants)).toBeVisible(); if (await plantField.isVisible()) { await expect(page.getByRole("button", { name: "Log care" })).toBeVisible(); } }, }, { action: "Record bang", dialog: "Record a bang", assertCreateControls: async (page) => { await expect(page.getByLabel("Date")).toBeVisible(); await expect(page.getByRole("button", { name: "Record it" })).toBeVisible(); }, }, ]; test.describe("quick-add create UI", () => { for (const { action, dialog, assertCreateControls } of fabQuickAddCases) { test(`FAB opens ${action} create dialog on dashboard`, async ({ page }) => { await ensureSignedIn(page); await openFabAction(page, action); await expect(page.getByRole("dialog", { name: dialog })).toBeVisible(); await assertCreateControls(page); }); } test("command palette opens new event dialog on dashboard", async ({ page }) => { await ensureSignedIn(page); const isMac = await page.evaluate(() => /Mac|iPhone|iPad|iPod/.test(navigator.platform)); await page.keyboard.press(isMac ? "Meta+k" : "Control+k"); await expect(page.getByRole("dialog", { name: "Command palette" })).toBeVisible(); await page.getByRole("option", { name: /New event/i }).click(); await expect(page).toHaveURL("/"); await expect(page.getByRole("dialog", { name: "New event" })).toBeVisible(); await expect(page.getByLabel("Title")).toBeVisible(); await expect(page.getByRole("button", { name: "Save event" })).toBeVisible(); }); });