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

const screenshotRoot = "../../../../specs/develop/20260623_2/m6_full_e2e";

function collectConsoleErrors(page: import("@playwright/test").Page) {
  const consoleErrors: string[] = [];
  page.on("console", (message) => {
    if (message.type() === "error") {
      const text = message.text();
      if (!text.includes("Failed to load resource")) {
        consoleErrors.push(text);
      }
    }
  });
  return consoleErrors;
}

test("opens the RPKI Explorer overview", async ({ page }) => {
  const consoleErrors = collectConsoleErrors(page);

  await page.goto("/");

  await expect(page.getByRole("heading", { name: "RPKI Explorer" })).toBeVisible();
  await expect(page.getByRole("heading", { name: "Global RPKI validation health" })).toBeVisible();
  await expect(page.getByRole("button", { name: /Overview/i })).toBeVisible();
  await expect(page.getByLabel("Current run")).toContainText("latest indexed run");
  await expect(page.getByPlaceholder("Exact URI lookup planned in M2")).toBeDisabled();
  await expect(page.getByText("Top repositories by workload")).toBeVisible();
  await expect(page.getByText("Recent validation issues")).toBeVisible();
  await page.screenshot({ path: `${screenshotRoot}/rpki-explorer-overview.png`, fullPage: true });
  expect(consoleErrors).toEqual([]);
});

test("collapses sidebar to icon-only navigation on desktop", async ({ page }) => {
  const consoleErrors = collectConsoleErrors(page);

  await page.goto("/");
  await expect(page.getByRole("heading", { name: "RPKI Explorer" })).toBeVisible();

  await page.getByRole("button", { name: "Collapse navigation" }).click();
  await expect(page.locator(".app-shell")).toHaveClass(/sidebar-collapsed/);
  await expect(page.getByRole("button", { name: "Expand navigation" })).toBeVisible();
  await expect(page.locator(".brand-copy")).toHaveCSS("position", "absolute");
  await expect(page.locator(".nav-item").first().locator("span")).toHaveCSS("position", "absolute");
  await expect(page.getByRole("button", { name: "Repositories" })).toBeVisible();
  await page.screenshot({ path: `${screenshotRoot}/rpki-explorer-sidebar-collapsed.png`, fullPage: true });

  await page.getByRole("button", { name: "Repositories" }).click();
  await expect(page.getByRole("heading", { name: "Repository / publication point / object browser" })).toBeVisible();

  await page.getByRole("button", { name: "Expand navigation" }).click();
  await expect(page.locator(".app-shell")).not.toHaveClass(/sidebar-collapsed/);
  await expect(page.getByRole("heading", { name: "RPKI Explorer" })).toBeVisible();
  expect(consoleErrors).toEqual([]);
});

test("opens truthful placeholders for unfinished navigation", async ({ page }) => {
  const consoleErrors = collectConsoleErrors(page);
  await page.goto("/");

  for (const name of ["Publication Points", "Validation", "Exports", "Runs", "API"]) {
    await page.getByRole("button", { name }).click();
    await expect(page.locator("#coming-soon-heading")).toHaveText(name);
    await expect(page.getByText("Coming soon", { exact: true })).toBeVisible();
    await expect(page.getByRole("heading", { name: "Global RPKI validation health" })).toHaveCount(0);
  }

  await page.screenshot({ path: `${screenshotRoot}/rpki-explorer-coming-soon.png`, fullPage: true });
  expect(consoleErrors).toEqual([]);
});

test("objects page starts from explicit empty state", async ({ page }) => {
  const consoleErrors = collectConsoleErrors(page);

  await page.goto("/");
  await page.getByRole("button", { name: /Objects/i }).click();

  await expect(page.getByRole("heading", { name: "Object object" })).toBeVisible();
  await expect(page.getByText("Search an exact URI or open an object from Repository Browser.")).toBeVisible();
  await expect(page.locator("body")).not.toContainText("sample PP");
  await page.screenshot({ path: `${screenshotRoot}/rpki-explorer-objects-empty.png`, fullPage: true });
  expect(consoleErrors).toEqual([]);
});