settings.spec.ts

1import { test, expect, type BrowserContext, type Page } from "@playwright/test";2import { addEntry, loadPopup, makeContext, openSettings, setupVault } from "./helpers/vault";34// Real vault creation runs Argon2id (≈12s with the recovery confirmation).5test.describe.configure({ timeout: 90_000 });67/** Settings is a card deck — only the active card's rows are on screen. */8async function openCard(popup: Page, id: string) {9  await popup.locator(`[data-settings-card-id="${id}"]`).click();10  await expect(popup.locator(`[data-settings-card-id="${id}"][data-active="true"]`)).toBeVisible();11}1213test.describe("Settings & Appearance", () => {14  let ctx: BrowserContext;15  test.afterEach(async () => { await ctx.close(); });16  test.beforeEach(async () => { ctx = await makeContext("peach-settings"); });1718  test("ST01 - settings panel opens from the chrome bar", async () => {19    const { popup } = await setupVault(ctx);20    await openSettings(popup);21    await expect(popup.locator(".stk-mast-title")).toHaveText("Settings");22  });2324  test("ST02 - the deck carries all seven cards", async () => {25    const { popup } = await setupVault(ctx);26    await openSettings(popup);27    await expect(popup.locator("[data-settings-card-id]")).toHaveCount(7);28    await expect(popup.locator(".stk-mast-counter")).toHaveText("1 / 7");29  });3031  test("ST03 - protection card carries lock-on-close, auto-lock and breach monitoring", async () => {32    const { popup } = await setupVault(ctx);33    await openSettings(popup);34    await openCard(popup, "protection");35    for (const label of ["Lock on close", "Auto-lock after", "Breach monitoring"]) {36      await expect(popup.locator(".peach-settings-row", { hasText: label })).toHaveCount(1);37    }38  });3940  test("ST04 - the vault card reports the entry count", async () => {41    const { popup } = await setupVault(ctx);42    await addEntry(popup, { title: "CountMe", url: "https://count.test", username: "u", password: "p" });43    await openSettings(popup);44    await expect(45      popup.locator('[data-settings-card-id="vault"]'),46    ).toContainText(/\d+ (entry|entries)/);47  });4849  test("ST05 - accent swatches are all clickable", async () => {50    const { popup } = await setupVault(ctx);51    await openSettings(popup);52    await openCard(popup, "appearance");53    const swatches = popup.locator(".peach-swatch");54    const count = await swatches.count();55    expect(count).toBeGreaterThanOrEqual(6);56    for (let i = 0; i < count; i++) {57      await swatches.nth(i).click();58      await popup.waitForTimeout(100);59    }60  });6162  test("ST06 - import passwords opens the import view", async () => {63    const { popup } = await setupVault(ctx);64    await openSettings(popup);65    await openCard(popup, "vault");66    await popup.locator(".peach-settings-row", { hasText: "Import passwords" }).getByRole("button").click();67    await expect(popup.locator(".peach-overlay-title")).toHaveText(/import/i, { timeout: 10000 });68  });6970  test("ST07 - export backup opens the export view", async () => {71    const { popup } = await setupVault(ctx);72    await openSettings(popup);73    await openCard(popup, "vault");74    await popup.locator(".peach-settings-row", { hasText: "Export backup" }).getByRole("button").click();75    await expect(popup.locator(".peach-overlay-title")).toHaveText(/export/i, { timeout: 10000 });76  });7778  test("ST08 - onboarding shows the peach wordmark", async () => {79    const { popup } = await loadPopup(ctx);80    await expect(popup.locator(".peach-wordmark-wrap").first()).toBeVisible();81    await expect(popup.locator(".peach-onboarding-card-headline")).toBeVisible();82  });83});