import { readFileSync } from "node:fs";
import { createRequire } from "node:module";

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

test.use({ bypassCSP: true, reducedMotion: "reduce" });

const require = createRequire(import.meta.url);
const axeSource = readFileSync(require.resolve("axe-core/axe.min.js"), "utf8");

type AxeViolation = {
  id: string;
  impact: string | null;
  help: string;
  nodes: Array<{ target: string[] }>;
};

async function seriousViolations(page: import("@playwright/test").Page): Promise<AxeViolation[]> {
  await page.addStyleTag({
    content: "*,*::before,*::after{animation:none!important;transition:none!important}",
  });
  await page.addScriptTag({ content: axeSource });
  return page.evaluate(async () => {
    const axe = (window as Window & {
      axe: {
        run: (
          context: Document,
          options: object,
        ) => Promise<{ violations: AxeViolation[] }>;
      };
    }).axe;
    const result = await axe.run(document, {
      runOnly: { type: "tag", values: ["wcag2a", "wcag2aa", "wcag21aa"] },
    });
    return result.violations.filter(
      (violation) => violation.impact === "critical" || violation.impact === "serious",
    );
  });
}

test("principal routes have no serious automated accessibility violations", async ({ page }) => {
  await page.goto("/login");
  expect(await seriousViolations(page)).toEqual([]);

  await page.getByRole("button", { name: "Verken als Operationsmanager" }).click();
  await expect(page).toHaveURL(/\/dashboard$/);
  for (const route of ["/dashboard", "/data-quality", "/knowledge", "/automation", "/audit"] as const) {
    await page.goto(route);
    const violations = await seriousViolations(page);
    expect(violations, `${route}: ${JSON.stringify(violations)}`).toEqual([]);
  }
});