import { expect, test, type Page } from "@playwright/test";
import { Buffer } from "node:buffer";
import { strToU8, zipSync } from "fflate";

const ORIGIN = "http://127.0.0.1:4201";
async function watchLocalOnly(page: Page) {
  const external: string[] = [];
  await page.route("**/*", async (route) => {
    const url = new URL(route.request().url());
    if (url.origin !== ORIGIN) {
      external.push(url.href);
      await route.abort();
    } else await route.continue();
  });
  return external;
}

function docx(chapter = "hello") {
  return zipSync({
    "[Content_Types].xml": strToU8(
      '<Types><Default Extension="xml" ContentType="application/xml"/><Override PartName="/word/document.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.document.main+xml"/></Types>',
    ),
    "_rels/.rels": strToU8(
      '<Relationships><Relationship Id="rId1" Type="officeDocument" Target="word/document.xml"/></Relationships>',
    ),
    "word/document.xml": strToU8(`<document>${chapter}</document>`),
    "word/media/pixel.png": new Uint8Array([137, 80, 78, 71]),
  });
}

test("runs at a nested path, stays local, and uses the shared width", async ({
  page,
}) => {
  await page.setViewportSize({ width: 1800, height: 1000 });
  const external = await watchLocalOnly(page);
  await page.goto("/deep/nested/package/");
  await expect(
    page.getByRole("heading", { name: "Package Tools" }),
  ).toBeVisible();
  expect(external).toEqual([]);
  expect(
    await page
      .locator(".toolbox-shell__main")
      .evaluate((node) => getComputedStyle(node).width),
  ).toBe("1440px");
});

test("inspects OOXML, navigates relationships and downloads an entry", async ({
  page,
}) => {
  await page.goto("/deep/nested/package/");
  await page.getByTestId("package-input").setInputFiles({
    name: "sample.docx",
    mimeType:
      "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
    buffer: Buffer.from(docx()),
  });
  await expect(page.getByText("1 package inspected locally.")).toBeVisible();
  await expect(
    page.getByRole("heading", { name: "OOXML document (DOCX)" }),
  ).toBeVisible();
  await page.getByRole("button", { name: "Relationships" }).click();
  await expect(
    page.getByRole("cell", { name: "word/document.xml" }),
  ).toBeVisible();
  await page.getByRole("button", { name: "Package tree" }).click();
  await page.getByRole("button", { name: "document.xml 26 B" }).click();
  await expect(page.getByText(/<document>hello<\/document>/u)).toBeVisible();
  const download = page.waitForEvent("download");
  await page.getByRole("button", { name: "Download verified entry" }).click();
  expect((await download).suggestedFilename()).toBe("document.xml");
});

test("compares two local package inventories", async ({ page }) => {
  await page.goto("/deep/nested/package/");
  await page.getByTestId("package-input").setInputFiles([
    {
      name: "left.docx",
      mimeType: "application/zip",
      buffer: Buffer.from(docx("old")),
    },
    {
      name: "right.docx",
      mimeType: "application/zip",
      buffer: Buffer.from(docx("new and larger")),
    },
  ]);
  await expect(page.getByText("2 packages inspected locally.")).toBeVisible();
  await expect(
    page.getByRole("heading", { name: "Compare packages" }),
  ).toBeVisible();
  await expect(
    page.getByRole("row", { name: /changed word\/document\.xml/u }),
  ).toBeVisible();
  await page
    .getByRole("button", { name: "Verify comparable contents" })
    .click();
  await expect(
    page.getByText(/Verified \d+ comparable entries/u),
  ).toBeVisible();
  await expect(
    page.getByRole("row", { name: /changed word\/document\.xml/u }),
  ).toContainText(/[0-9a-f]{12} ↔ [0-9a-f]{12}/u);
});

test("integrates help, theme, PWA identity and hardened headers", async ({
  page,
  request,
}) => {
  await page.goto("/deep/nested/package/");
  await page.getByRole("button", { name: "Help" }).click();
  await expect(
    page.getByRole("dialog", { name: "About Package Tools" }),
  ).toContainText("inventoried—not validated");
  await page.keyboard.press("Escape");
  await page.getByRole("button", { name: "Personalize" }).click();
  await page.getByRole("button", { name: "Dark" }).click();
  await expect(page.locator(".toolbox-shell").first()).toHaveAttribute(
    "data-toolbox-theme",
    "dark",
  );
  expect(
    await page.evaluate(async () =>
      Boolean(await navigator.serviceWorker.ready),
    ),
  ).toBe(true);
  const index = await request.get("/deep/nested/package/");
  expect(index.headers()["content-security-policy"]).toContain(
    "connect-src 'self'",
  );
  expect(await index.text()).not.toMatch(/\b(?:src|href)=["']\//u);
  const manifest = await request.get("/deep/nested/package/toolbox-app.json");
  await expect(manifest.json()).resolves.toMatchObject({
    id: "de.add-ideas.package-tools",
    version: "0.2.0",
    privacy: { processing: "local", telemetry: false },
  });
});