data-tools/tests/browser/app.spec.ts

import { expect, test, type Page, type Response } from "@playwright/test";

const ORIGIN = "http://127.0.0.1:4173";

async function localOnly(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 collectErrors(page: Page): string[] {
  const errors: string[] = [];
  page.on("pageerror", (error) => errors.push(error.message));
  page.on("console", (message) => {
    if (message.type() === "error") errors.push(message.text());
  });
  return errors;
}

test("runs its parser worker from a nested path without external requests", async ({
  page,
}) => {
  const errors = collectErrors(page);
  const external = await localOnly(page);
  const workerResponses: Response[] = [];
  page.on("response", (response) => {
    if (/data\.worker-[^/]+\.js$/u.test(new URL(response.url()).pathname))
      workerResponses.push(response);
  });

  await page.goto("/deep/nested/data/");
  await expect(page.locator(".workbench h1")).toHaveText("Data Tools");
  await expect(page.getByText(/Parsed as JSON/iu)).toBeVisible();
  expect(external).toEqual([]);
  expect(errors).toEqual([]);
  expect(workerResponses).toHaveLength(1);
  const worker = workerResponses[0];
  expect(worker).toBeDefined();
  expect(new URL(worker!.url()).pathname).toMatch(
    /^\/deep\/nested\/data\/assets\/data\.worker-[^/]+\.js$/u,
  );
  expect(worker!.headers()["content-type"]).toContain("text/javascript");
  expect(worker!.headers()["cache-control"]).toContain("immutable");
});

test("navigates tree and safe query views", async ({ page }) => {
  await page.goto("/deep/nested/data/");
  await expect(page.getByText(/Parsed as JSON/iu)).toBeVisible();
  await page.getByRole("tab", { name: /Tree/iu }).click();
  await expect(
    page.getByRole("treeitem").filter({ hasText: "exactInteger" }),
  ).toBeVisible();

  await page.getByRole("tab", { name: /Query/iu }).click();
  await page.getByLabel("Query syntax").selectOption("path");
  await expect(page.getByText("4 matches")).toBeVisible();
  await expect(page.getByText("detect", { exact: true })).toBeVisible();
});

test("opens CSV locally, projects a table and neutralises spreadsheet formulas", async ({
  page,
}) => {
  await page.goto("/deep/nested/data/");
  await page.getByTestId("data-file-input").setInputFiles({
    name: "records.csv",
    mimeType: "text/csv",
    buffer: Buffer.from("name,value\nAda,001\nFormula,=2+2", "utf8"),
  });
  await expect(page.getByText(/Parsed as CSV/iu)).toBeVisible();

  await page.getByRole("tab", { name: /Table/iu }).click();
  await page.getByText("Use first row as headings").click();
  const table = page.getByRole("region", { name: "Tabular data preview" });
  await expect(table.getByRole("columnheader", { name: "name" })).toBeVisible();
  await expect(table.getByRole("cell", { name: "001" })).toBeVisible();

  await page.getByRole("tab", { name: /Convert/iu }).click();
  await page.getByLabel("Output format").selectOption("csv");
  await expect(page.getByTestId("conversion-output")).toHaveValue(
    /Formula,'=2\+2/u,
  );
  await expect(
    page.getByText(/Potential spreadsheet formulas/iu),
  ).toBeVisible();
  const downloadPromise = page.waitForEvent("download");
  await page.getByRole("button", { name: "Download" }).click();
  expect((await downloadPromise).suggestedFilename()).toBe("converted.csv");
});

test("shows a hardened XML error while retaining the last successful model", async ({
  page,
}) => {
  await page.goto("/deep/nested/data/");
  await expect(page.getByText(/Parsed as JSON/iu)).toBeVisible();
  await page.getByTestId("format-select").selectOption("xml");
  await page
    .getByTestId("source-editor")
    .fill('<!DOCTYPE root [<!ENTITY x "bad">]><root>&x;</root>');
  await expect(page.getByText("xml.doctype-rejected")).toBeVisible();
  await page.getByRole("tab", { name: /Tree/iu }).click();
  await expect(
    page.getByRole("treeitem").filter({ hasText: "project" }),
  ).toBeVisible();
});

test("infers a schema and applies a reviewed exact-number edit", async ({
  page,
}) => {
  await page.goto("/deep/nested/data/");
  await expect(page.getByText(/Parsed as JSON/iu)).toBeVisible();
  await page.getByRole("tab", { name: /Schema & edit/iu }).click();
  await expect(
    page.getByRole("heading", { name: "Schema inference" }),
  ).toBeVisible();
  await expect(page.getByRole("rowheader", { name: "/project" })).toBeVisible();
  await page.getByLabel(/JSON Pointer/iu).fill("/exactInteger");
  await page.getByLabel("Value type").selectOption("number");
  await page
    .locator(".edit-value-field textarea")
    .fill("9007199254740993123456790");
  await page.getByRole("button", { name: "Preview edit" }).click();
  await expect(
    page.getByText("No known loss or coercion in this conversion."),
  ).toBeVisible();
  await page.getByRole("button", { name: "Apply preview to source" }).click();
  await expect(page.getByTestId("source-editor")).toHaveValue(
    /9007199254740993123456790/u,
  );
  await expect(page.getByText(/Parsed as JSON/iu)).toBeVisible();
});

test("serves the release identity and hardened headers", async ({
  request,
}) => {
  const index = await request.get("/deep/nested/data/");
  expect(index.ok()).toBe(true);
  expect(index.headers()["content-security-policy"]).toContain(
    "default-src 'self'",
  );
  expect(index.headers()["content-security-policy"]).toContain(
    "worker-src 'self' blob:",
  );
  expect(await index.text()).not.toMatch(/\b(?:src|href)=["']\//u);
  const manifest = await request.get("/deep/nested/data/toolbox-app.json");
  await expect(manifest.json()).resolves.toMatchObject({
    id: "de.add-ideas.data-tools",
    version: "0.2.0",
    entry: "./",
  });
});