vault.ts

1/**2 * Shared vault setup for the Playwright specs.3 *4 * Every spec used to carry its own copy of this flow, and most copies still5 * filled "password123" — which fails the create-vault gate (12 chars AND6 * zxcvbn score >= 2), so the button stayed disabled, no vault was created, and7 * the rest of the spec ran against a locked popup while still reporting green.8 * setupVault() below asserts it reached the unlocked vault, so that failure9 * mode is now a loud error instead of a silent pass.10 */11import { chromium, expect, type BrowserContext, type Page } from "@playwright/test";12import { fileURLToPath } from "node:url";13import { dirname, join } from "node:path";14import os from "node:os";15import fs from "node:fs/promises";1617const __filename = fileURLToPath(import.meta.url);18const __dirname = dirname(__filename);19export const EXTENSION_PATH = join(__dirname, "..", "..", "dist-chrome");20/** Passes both the 12-character minimum and the zxcvbn strength gate. */21export const VAULT_PASSWORD = "correct horse battery staple";2223/** The unlocked vault's tell — present only once the vault view is mounted. */24export const UNLOCKED = ".peach-lock-btn[aria-label='Lock vault']";2526export async function makeContext(prefix = "peach"): Promise<BrowserContext> {27  const userDataDir = join(28    os.tmpdir(),29    `${prefix}-${Date.now()}-${Math.random().toString(36).slice(2)}`,30  );31  await fs.mkdir(userDataDir, { recursive: true });32  return chromium.launchPersistentContext(userDataDir, {33    executablePath: process.env.PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH,34    headless: process.env.PEACH_RELEASE_BROWSER_GATE === "1",35    args: [36      `--load-extension=${EXTENSION_PATH}`,37      `--disable-extensions-except=${EXTENSION_PATH}`,38    ],39  });40}4142export async function waitForSW(ctx: BrowserContext, maxWait = 15000): Promise<string> {43  const start = Date.now();44  let sw = ctx.serviceWorkers()[0];45  while (!sw && Date.now() - start < maxWait) {46    await new Promise((r) => setTimeout(r, 500));47    sw = ctx.serviceWorkers()[0];48  }49  if (!sw) throw new Error(`No SW after ${maxWait}ms`);50  return new URL(sw.url()).host;51}5253export async function loadPopup(ctx: BrowserContext): Promise<{ popup: Page; extId: string }> {54  const extId = await waitForSW(ctx);55  const popup = await ctx.newPage();56  await popup.goto(`chrome-extension://${extId}/src/popup/index.html`);57  await popup.waitForTimeout(3000);58  return { popup, extId };59}6061/** Click through the intro carousel until the create-vault form is on screen. */62export async function reachCreateScreen(popup: Page): Promise<void> {63  const advanceButton = popup.getByRole("button", { name: /next|get started|create vault/i });64  const pw = popup.locator("#master-password");65  for (let i = 0; i < 5 && !(await pw.isVisible().catch(() => false)); i++) {66    await expect(advanceButton).toBeVisible({ timeout: 5000 });67    await advanceButton.click();68    await popup.waitForTimeout(300);69  }70  if (!(await pw.isVisible().catch(() => false))) {71    throw new Error("setupVault: never reached the create-vault screen (#master-password)");72  }73}7475/**76 * Create a vault and land in the unlocked view.77 *78 * confirmRecovery: false stops on the recovery-words screen instead — only for79 * specs that assert on that screen itself.80 */81export async function setupVault(82  ctx: BrowserContext,83  password = VAULT_PASSWORD,84  opts: { confirmRecovery?: boolean } = {},85): Promise<{ popup: Page; extId: string }> {86  const { confirmRecovery = true } = opts;87  const { popup, extId } = await loadPopup(ctx);88  await reachCreateScreen(popup);89  await popup.locator("#master-password").fill(password);90  await popup.locator("#confirm-password").fill(password);91  // The submit button's label is replaced by the blocker message while the92  // gate is unmet ("need 4 more characters"), so locate it by class rather93  // than by name — and surface that label if it never becomes enabled.94  const createBtn = popup.locator(".peach-newvault-submit");95  if (!(await createBtn.isEnabled().catch(() => false))) {96    await expect(createBtn, `create-vault gate not met: "${await createBtn.textContent()}"`)97      .toBeEnabled({ timeout: 5000 });98  }99  await createBtn.click();100  // Vault creation runs Argon2id, which can exceed a few seconds under load —101  // give the recovery display room so this doesn't flake.102  await expect(popup.locator(".lock-screen--recovery-display")).toBeVisible({ timeout: 30000 });103  if (confirmRecovery) await completeRecoveryConfirmation(popup);104  return { popup, extId };105}106107export async function completeRecoveryConfirmation(popup: Page): Promise<void> {108  const recoveryWords = popup.locator(".peach-recovery-word-text");109  const confirmInputs = popup.locator(".peach-recovery-confirm-input");110  const confirmButton = popup.getByRole("button", { name: /i wrote them down/i });111112  await expect(confirmInputs).toHaveCount(3);113  // The confirmation inputs stay disabled until the 12 words render, which114  // is slow when several browsers derive Argon2 at once.115  await expect(confirmInputs.first()).toBeEnabled({ timeout: 30000 });116117  const words = await recoveryWords.allTextContents();118  // The three positions are randomized per mount, so read each field's119  // "word N" label rather than assuming fixed slots.120  const fields = popup.locator(".peach-recovery-confirm-field");121  const fieldCount = await fields.count();122  if (fieldCount !== 3) throw new Error(`expected 3 confirm fields, saw ${fieldCount}`);123  for (let i = 0; i < fieldCount; i++) {124    const field = fields.nth(i);125    const numText = await field.locator(".peach-recovery-confirm-num").innerText();126    const pos = parseInt(numText.replace(/\D/g, ""), 10);127    const word = words[pos - 1]?.trim();128    if (!word) throw new Error(`missing recovery word for position ${pos}`);129    await field.locator(".peach-recovery-confirm-input").fill(word);130  }131132  await expect(confirmButton).toBeEnabled({ timeout: 2000 });133  await confirmButton.click();134  await expect(135    popup.locator(UNLOCKED),136    "setupVault: recovery confirmation did not land in the unlocked vault",137  ).toBeVisible({ timeout: 10000 });138}139140export async function lockVault(popup: Page): Promise<void> {141  const lockBtn = popup.locator(UNLOCKED);142  await expect(lockBtn).toBeVisible({ timeout: 15000 });143  await lockBtn.click();144  await expect(popup.locator("#unlock-password")).toBeVisible({ timeout: 15000 });145}146147export async function unlockVault(popup: Page, password = VAULT_PASSWORD): Promise<void> {148  await popup.locator("#unlock-password").fill(password);149  await popup.getByRole("button", { name: /unlock/i }).click();150  await expect(popup.locator(UNLOCKED)).toBeVisible({ timeout: 20000 });151}152153export async function openSettings(popup: Page): Promise<void> {154  await popup.locator(".peach-icon-btn[aria-label='Settings']").click();155  await expect(popup.locator(".stk-shell")).toBeVisible({ timeout: 10000 });156}157158export async function setLockOnClose(popup: Page, enabled: boolean): Promise<void> {159  const response = await popup.evaluate(async (lockOnClose) => {160    return new Promise<{ ok?: boolean; error?: string }>((resolve) => {161      chrome.runtime.sendMessage({ type: "UPDATE_SETTINGS", payload: { lockOnClose } }, resolve);162    });163  }, enabled);164  if (!response?.ok) throw new Error(`setLockOnClose failed: ${response?.error ?? "no response"}`);165}166167export async function waitForLocked(ctx: BrowserContext): Promise<void> {168  await expect.poll(async () => {169    const worker = ctx.serviceWorkers()[0];170    if (!worker) return false;171    return worker.evaluate(async () => {172      const stored = await chrome.storage.session.get("peach_session_dk");173      return stored.peach_session_dk === undefined;174    });175  }).toBe(true);176}177178/**179 * Open the entry list. The top search bar is readOnly — clicking it is what180 * mounts the list overlay, which is where the real search input and the181 * new-entry button live.182 */183export async function openList(popup: Page): Promise<void> {184  if (await popup.locator(".peach-overlay-view .peach-search-input").isVisible().catch(() => false)) return;185  await popup.locator(".peach-search-wrap .peach-search-input").click();186  await expect(popup.locator(".peach-overlay-view .peach-search-input")).toBeVisible({ timeout: 5000 });187}188189/** The editable search field, inside the list overlay. */190export function listSearch(popup: Page) {191  return popup.locator(".peach-overlay-view .peach-search-input");192}193194/**195 * Fill and submit the new-entry form. Selectors follow Add.tsx: the title field196 * is .peach-new-title-input (it was .peach-new-name-input in an older UI, which197 * is why the specs that still use that class fail to find it).198 */199export async function createEntryViaForm(200  popup: Page,201  entry: { title: string; url?: string; username?: string; password?: string; totp?: string; notes?: string },202): Promise<void> {203  await openList(popup);204  await popup.locator(".peach-new-entry-row").click();205  await popup.locator(".peach-new-title-input").fill(entry.title);206  if (entry.url) await popup.locator(".peach-domain-value--edit").fill(entry.url);207  if (entry.username) await popup.locator('input[placeholder="johndoe"]').fill(entry.username);208  if (entry.password) await popup.locator('input[placeholder="password"]').fill(entry.password);209  // 2FA and notes are behind "+ add" links until they hold a value.210  if (entry.totp) {211    await popup.getByRole("button", { name: /add 2FA/i }).click();212    await popup.locator('input[placeholder*="BASE32" i]').fill(entry.totp);213  }214  if (entry.notes) {215    await popup.getByRole("button", { name: /add notes/i }).click();216    await popup.locator(".peach-new-textarea").fill(entry.notes);217  }218  const create = popup.getByRole("button", { name: /^create$/i });219  await expect(create, "create button stayed disabled — the entry form rejected the input").toBeEnabled();220  await create.click();221  await expect(popup.locator(".peach-new-title-input")).toHaveCount(0, { timeout: 10000 });222}223224/** Add an entry through the background message API (faster than the new-entry form). */225export async function addEntry(226  popup: Page,227  entry: { title: string; url?: string; username?: string; password?: string; totp?: string },228): Promise<void> {229  const result = await popup.evaluate(async (payload) => {230    return new Promise<{ ok?: boolean; error?: string }>((resolve) => {231      chrome.runtime.sendMessage({ type: "ADD_ENTRY", payload: { type: "login", ...payload } }, resolve);232    });233  }, entry);234  // A locked vault answers { ok: false, error: "vault_locked" } — without this235  // check the entry silently never exists and the spec asserts nothing.236  if (!result?.ok) throw new Error(`addEntry(${entry.title}) failed: ${result?.error ?? "no response"}`);237}