import { test, expect, BrowserContext } from "@playwright/test";
import { fileURLToPath } from "url";
import { dirname, join } from "path";
import os from "os";
import fs from "fs/promises";

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
const EXTENSION_PATH = join(__dirname, "..", "dist");

async function makeContext() {
  const { chromium } = await import("playwright");
  const userDataDir = join(os.tmpdir(), `peach-entry-${Date.now()}`);
  await fs.mkdir(userDataDir, { recursive: true });
  return chromium.launchPersistentContext(userDataDir, {
    headless: false,
    args: [`--load-extension=${EXTENSION_PATH}`, `--disable-extensions-except=${EXTENSION_PATH}`],
  });
}

async function waitForSW(ctx: BrowserContext, maxWait = 15000): Promise<string> {
  const start = Date.now();
  let sw = ctx.serviceWorkers()[0];
  while (!sw && Date.now() - start < maxWait) {
    await new Promise(r => setTimeout(r, 500));
    sw = ctx.serviceWorkers()[0];
  }
  if (!sw) throw new Error(`No SW after ${maxWait}ms`);
  return new URL(sw.url()).host;
}

async function setupVault(ctx: BrowserContext): Promise<{ popup: any, extId: string }> {
  const extId = await waitForSW(ctx);
  const popup = await ctx.newPage();
  await popup.goto(`chrome-extension://${extId}/src/popup/index.html`);
  await popup.waitForTimeout(3000);
  const pw = popup.locator("#master-password");
  if (await pw.isVisible()) {
    await pw.fill("password123");
    await popup.locator("#confirm-password").fill("password123");
    await popup.getByRole("button", { name: /create vault/i }).click();
    await popup.waitForTimeout(2000);
  }
  return { popup, extId };
}

test.describe("Entry Field Validation", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF01 - entry requires name", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator('input[placeholder="domain.com"]').fill("https://noname.com");
    await popup.locator('input[placeholder="username or email"]').fill("user@test.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(500);
    const nameInput = popup.locator(".peach-new-name-input");
    const value = await nameInput.inputValue();
    expect(value).toBe("");
    await ctx.close();
  });

  test("EF02 - entry allows empty domain", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("NoDomain");
    await popup.locator('input[placeholder="domain.com"]').fill("");
    await popup.locator('input[placeholder="username or email"]').fill("user@test.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=NoDomain")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF03 - entry allows empty username", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("NoUsername");
    await popup.locator('input[placeholder="domain.com"]').fill("https://nouser.com");
    await popup.locator('input[placeholder="username or email"]').fill("");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=NoUsername")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF04 - entry requires password", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("NoPass");
    await popup.locator('input[placeholder="domain.com"]').fill("https://nopass.com");
    await popup.locator('input[placeholder="username or email"]').fill("user@test.com");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(500);
    const passField = popup.locator(".peach-new-field-input[placeholder='password']");
    const value = await passField.inputValue();
    expect(value).toBe("");
    await ctx.close();
  });

  test("EF05 - entry truncates very long names", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    const longName = "A".repeat(500);
    await popup.locator(".peach-new-name-input").fill(longName);
    await popup.locator('input[placeholder="domain.com"]').fill("https://long.com");
    await popup.locator('input[placeholder="username or email"]').fill("long@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    const nameInList = popup.locator(".peach-entry-name").first();
    const text = await nameInList.textContent();
    expect(text?.length).toBeLessThanOrEqual(200);
    await ctx.close();
  });
});

test.describe("Notes Field", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF06 - notes field accepts multiline text", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("MultiLine");
    await popup.locator('input[placeholder="domain.com"]').fill("https://multi.com");
    await popup.locator('input[placeholder="username or email"]').fill("multi@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    const notes = popup.locator("textarea");
    await notes.fill("Line 1\nLine 2\nLine 3");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const noteContent = popup.locator(".peach-note-content");
    await expect(noteContent).toBeVisible({ timeout: 3000 });
    const text = await noteContent.textContent();
    expect(text).toContain("Line 1");
    expect(text).toContain("Line 2");
    await ctx.close();
  });

  test("EF07 - notes field accepts special characters", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("SpecialNotes");
    await popup.locator('input[placeholder="domain.com"]').fill("https://special.com");
    await popup.locator('input[placeholder="username or email"]').fill("special@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    const notes = popup.locator("textarea");
    await notes.fill('<script>alert("xss")</script>&"\'<>@#$%^&*()_+-=[]{}|;:,./<>?');
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const noteContent = popup.locator(".peach-note-content");
    const html = await noteContent.innerHTML();
    expect(html).not.toContain("<script>");
    await ctx.close();
  });

  test("EF08 - notes field supports unicode", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("UnicodeNotes");
    await popup.locator('input[placeholder="domain.com"]').fill("https://unicode.com");
    await popup.locator('input[placeholder="username or email"]').fill("unicode@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    const notes = popup.locator("textarea");
    await notes.fill("日本語한국어中文العربيةहिन्दी🎉🎊💻⌨️");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=UnicodeNotes")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF09 - very long notes are saved", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("LongNotes");
    await popup.locator('input[placeholder="domain.com"]').fill("https://longnotes.com");
    await popup.locator('input[placeholder="username or email"]').fill("long@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    const notes = popup.locator("textarea");
    const longText = "A".repeat(5000);
    await notes.fill(longText);
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const noteContent = popup.locator(".peach-note-content");
    const text = await noteContent.textContent();
    expect(text?.length).toBeGreaterThan(4000);
    await ctx.close();
  });

  test("EF10 - notes field shows correct label", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("NotesLabel");
    await popup.locator('input[placeholder="domain.com"]').fill("https://label.com");
    await popup.locator('input[placeholder="username or email"]').fill("label@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.locator("textarea").fill("test notes");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const label = popup.locator(".peach-label").filter({ hasText: "notes" }).first();
    await expect(label).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });
});

test.describe("URL Field", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF11 - URL field accepts https://", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("HTTPSURL");
    await popup.locator('input[placeholder="domain.com"]').fill("https://https.com");
    await popup.locator('input[placeholder="username or email"]').fill("https@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=HTTPSURL")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF12 - URL field accepts http://", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("HTTPURL");
    await popup.locator('input[placeholder="domain.com"]').fill("http://http.com");
    await popup.locator('input[placeholder="username or email"]').fill("http@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=HTTPURL")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF13 - URL field accepts ftp://", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("FTPURL");
    await popup.locator('input[placeholder="domain.com"]').fill("ftp://ftp.com");
    await popup.locator('input[placeholder="username or email"]').fill("ftp@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=FTPURL")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF14 - URL with path is saved correctly", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("PathURL");
    await popup.locator('input[placeholder="domain.com"]').fill("https://example.com/path/to/page?query=value#anchor");
    await popup.locator('input[placeholder="username or email"]').fill("path@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=PathURL")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF15 - URL with port is saved correctly", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("PortURL");
    await popup.locator('input[placeholder="domain.com"]').fill("https://example.com:8443/login");
    await popup.locator('input[placeholder="username or email"]').fill("port@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=PortURL")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });
});

test.describe("Username Field", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF16 - email format username", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("EmailUser");
    await popup.locator('input[placeholder="domain.com"]').fill("https://email.com");
    await popup.locator('input[placeholder="username or email"]').fill("user.name@example.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=EmailUser")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF17 - username with special characters", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("SpecialUser");
    await popup.locator('input[placeholder="domain.com"]').fill("https://special.com");
    await popup.locator('input[placeholder="username or email"]').fill("user+tag@domain.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=SpecialUser")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF18 - very long username", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("LongUser");
    await popup.locator('input[placeholder="domain.com"]').fill("https://long.com");
    await popup.locator('input[placeholder="username or email"]').fill("a".repeat(200) + "@test.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=LongUser")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF19 - username with unicode", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("UnicodeUser");
    await popup.locator('input[placeholder="domain.com"]').fill("https://unicode.com");
    await popup.locator('input[placeholder="username or email"]').fill("用户@例子.测试");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=UnicodeUser")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });
});

test.describe("Password Field", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF20 - emoji password", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("EmojiPass");
    await popup.locator('input[placeholder="domain.com"]').fill("https://emoji.com");
    await popup.locator('input[placeholder="username or email"]').fill("emoji@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("🔐🔑🌟💻🖥️⌨️");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=EmojiPass")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF21 - whitespace-only password", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("SpacePass");
    await popup.locator('input[placeholder="domain.com"]').fill("https://space.com");
    await popup.locator('input[placeholder="username or email"]').fill("space@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("     ");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=SpacePass")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF22 - very long password", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("LongPass");
    await popup.locator('input[placeholder="domain.com"]').fill("https://long.com");
    await popup.locator('input[placeholder="username or email"]').fill("long@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("a".repeat(1000));
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=LongPass")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF23 - password reveal button works", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("RevealPass");
    await popup.locator('input[placeholder="domain.com"]').fill("https://reveal.com");
    await popup.locator('input[placeholder="username or email"]').fill("reveal@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("secretpass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const eyeBtn = popup.locator("button[aria-label='Reveal password']");
    if (await eyeBtn.isVisible({ timeout: 2000 }).catch(() => false)) {
      await eyeBtn.click();
      await popup.waitForTimeout(300);
    }
    await ctx.close();
  });
});

test.describe("Entry Editing", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF24 - edit entry changes name", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("OriginalName");
    await popup.locator('input[placeholder="domain.com"]').fill("https://original.com");
    await popup.locator('input[placeholder="username or email"]').fill("original@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    await popup.locator("button[aria-label='Edit']").first().click();
    await popup.waitForTimeout(500);
    await popup.locator(".peach-new-name-input").fill("ChangedName");
    await popup.getByRole("button", { name: /save/i }).click();
    await popup.waitForTimeout(1500);
    await expect(popup.locator("text=ChangedName")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF25 - edit entry preserves other fields", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("PreserveFields");
    await popup.locator('input[placeholder="domain.com"]').fill("https://preserve.com");
    await popup.locator('input[placeholder="username or email"]').fill("preserve@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("originalpass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    await popup.locator("button[aria-label='Edit']").first().click();
    await popup.waitForTimeout(500);
    await popup.locator(".peach-new-name-input").fill("PreserveFieldsChanged");
    await popup.getByRole("button", { name: /save/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const username = popup.locator(".peach-field-value").filter({ hasText: "preserve@user.com" }).first();
    await expect(username).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF26 - cancel edit reverts changes", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("CancelEdit");
    await popup.locator('input[placeholder="domain.com"]').fill("https://cancel.com");
    await popup.locator('input[placeholder="username or email"]').fill("cancel@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    await popup.locator("button[aria-label='Edit']").first().click();
    await popup.waitForTimeout(500);
    await popup.locator(".peach-new-name-input").fill("ShouldNotChange");
    await popup.keyboard.press("Escape");
    await popup.waitForTimeout(300);
    await expect(popup.locator("text=CancelEdit")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF27 - delete entry from detail view", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("DeleteMeEntry");
    await popup.locator('input[placeholder="domain.com"]').fill("https://delete.com");
    await popup.locator('input[placeholder="username or email"]').fill("delete@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const deleteLink = popup.locator("text=delete entry");
    await deleteLink.click();
    await popup.waitForTimeout(1000);
    await expect(popup.locator("text=DeleteMeEntry")).not.toBeVisible({ timeout: 3000 });
    await ctx.close();
  });
});

test.describe("Entry State Transitions", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF28 - list to detail transition", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("ListDetail");
    await popup.locator('input[placeholder="domain.com"]').fill("https://listdetail.com");
    await popup.locator('input[placeholder="username or email"]').fill("ld@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    const usernameField = popup.locator(".peach-field-value").filter({ hasText: "ld@user.com" }).first();
    await expect(usernameField).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF29 - detail to list back transition", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("DetailBack");
    await popup.locator('input[placeholder="domain.com"]').fill("https://back.com");
    await popup.locator('input[placeholder="username or email"]').fill("back@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    await popup.locator("button[aria-label='Back']").first().click();
    await popup.waitForTimeout(300);
    await expect(popup.locator("text=DetailBack")).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF30 - entry to edit mode transition", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("EditMode");
    await popup.locator('input[placeholder="domain.com"]').fill("https://edit.com");
    await popup.locator('input[placeholder="username or email"]').fill("edit@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    await popup.locator("button[aria-label='Edit']").first().click();
    await popup.waitForTimeout(500);
    const nameInput = popup.locator(".peach-new-name-input");
    await expect(nameInput).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });

  test("EF31 - edit to detail transition after save", async () => {
    const { popup } = await setupVault(ctx);
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("EditSave");
    await popup.locator('input[placeholder="domain.com"]').fill("https://editsave.com");
    await popup.locator('input[placeholder="username or email"]').fill("es@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    await popup.locator(".peach-entry-name-button").first().click();
    await popup.waitForTimeout(500);
    await popup.locator("button[aria-label='Edit']").first().click();
    await popup.waitForTimeout(500);
    await popup.locator(".peach-new-name-input").fill("EditSaveChanged");
    await popup.getByRole("button", { name: /save/i }).click();
    await popup.waitForTimeout(1500);
    const usernameField = popup.locator(".peach-field-value").filter({ hasText: "es@user.com" }).first();
    await expect(usernameField).toBeVisible({ timeout: 3000 });
    await ctx.close();
  });
});

test.describe("Entry List Behavior", () => {
  let ctx: BrowserContext;
  test.afterEach(async () => { await ctx.close(); });
  test.beforeEach(async () => { ctx = await makeContext(); });

  test("EF32 - entries sorted alphabetically", async () => {
    const { popup } = await setupVault(ctx);
    for (const name of ["Zebra", "Apple", "Mango"]) {
      await popup.locator('input[placeholder="search vault..."]').click();
      await popup.getByRole("button", { name: /new entry/i }).click();
      await popup.locator(".peach-new-name-input").fill(name);
      await popup.locator('input[placeholder="domain.com"]').fill(`https://${name.toLowerCase()}.com`);
      await popup.locator('input[placeholder="username or email"]').fill(`${name.toLowerCase()}@user.com`);
      await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
      await popup.getByRole("button", { name: /create/i }).click();
      await popup.waitForTimeout(800);
    }
    const entries = popup.locator(".peach-entry-row-name");
    const count = await entries.count();
    expect(count).toBeGreaterThanOrEqual(3);
    await ctx.close();
  });

  test("EF33 - breach indicator shows for compromised entry", async () => {
    const { popup } = await setupVault(ctx);
    await popup.waitForTimeout(500);
    const breachRow = popup.locator(".peach-entry-row.is-breach, .peach-entry-row-dot");
    await breachRow.isVisible({ timeout: 2000 }).catch(() => false);
    await ctx.close();
  });

  test("EF34 - entry count updates after add", async () => {
    const { popup } = await setupVault(ctx);
    const counter = popup.locator(".peach-search-counter");
    const initial = await counter.textContent();
    await popup.locator('input[placeholder="search vault..."]').click();
    await popup.getByRole("button", { name: /new entry/i }).click();
    await popup.locator(".peach-new-name-input").fill("CountTest");
    await popup.locator('input[placeholder="domain.com"]').fill("https://count.com");
    await popup.locator('input[placeholder="username or email"]').fill("count@user.com");
    await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
    await popup.getByRole("button", { name: /create/i }).click();
    await popup.waitForTimeout(1500);
    const final = await counter.textContent();
    expect(initial).not.toEqual(final);
    await ctx.close();
  });

  test("EF35 - next/prev navigation works", async () => {
    const { popup } = await setupVault(ctx);
    for (const name of ["FirstEntry", "SecondEntry", "ThirdEntry"]) {
      await popup.locator('input[placeholder="search vault..."]').click();
      await popup.getByRole("button", { name: /new entry/i }).click();
      await popup.locator(".peach-new-name-input").fill(name);
      await popup.locator('input[placeholder="domain.com"]').fill(`https://${name.toLowerCase()}.com`);
      await popup.locator('input[placeholder="username or email"]').fill(`${name.toLowerCase()}@user.com`);
      await popup.locator(".peach-new-field-input[placeholder='password']").fill("pass");
      await popup.getByRole("button", { name: /create/i }).click();
      await popup.waitForTimeout(800);
    }
    const nextBtn = popup.getByRole("button", { name: /next/i });
    if (await nextBtn.isVisible({ timeout: 2000 }).catch(() => false)) {
      await nextBtn.click();
      await popup.waitForTimeout(300);
      const prevBtn = popup.getByRole("button", { name: /prev/i });
      if (await prevBtn.isVisible({ timeout: 1000 }).catch(() => false)) {
        await prevBtn.click();
        await popup.waitForTimeout(300);
      }
    }
    await ctx.close();
  });
});