import { test, expect } from "@playwright/test";
import { headerTest } from "@/playwright/tests/components/header/headerTest";
import { navTest } from "@/playwright/tests/components/navigation/navTest";
import { footerTest } from "@/playwright/tests/components/footer/footerTest";

test.use({
  viewport: {
    height: 800,
    width: 1280,
  },
});

test("System", async ({ page }) => {
  await page.goto("/system");
  // Gemeinsame Layout-Checks
  await headerTest(page);
  await navTest(page);
  await footerTest(page);
  await expect(
    page.getByRole("heading", { name: "System Spannungen &" })
  ).toBeVisible();
  await expect(page.getByRole("heading", { name: "+15V" })).toBeVisible();
  await expect(page.getByText("15.06 VDetailansicht")).toBeVisible();
  await expect(page.getByRole("heading", { name: "+5V" })).toBeVisible();
  await expect(page.getByText("4.98 VDetailansicht")).toBeVisible();
  await expect(page.getByRole("heading", { name: "-15V" })).toBeVisible();
  await expect(page.getByText("-15.09 VDetailansicht")).toBeVisible();
  await expect(page.getByRole("heading", { name: "-96V" })).toBeVisible();
  await expect(page.getByText("-96.48 VDetailansicht")).toBeVisible();
  await expect(page.getByRole("heading", { name: "ADC Temp" })).toBeVisible();
  await expect(page.getByText("59.78 °CDetailansicht")).toBeVisible();
  await expect(page.getByRole("heading", { name: "CPU Temp" })).toBeVisible();
  await expect(page.getByText("56.92 °CDetailansicht")).toBeVisible();
  await expect(page.getByRole("img").nth(2)).toBeVisible();
  await expect(page.getByRole("img").nth(3)).toBeVisible();
  await page
    .getByRole("paragraph")
    .filter({ hasText: "15.06 VDetailansicht" })
    .getByRole("button")
    .click();
  await expect(page.getByRole("dialog")).toMatchAriaSnapshot(`
    - 'heading "Detailansicht: +15V" [level=2]'
    - button "Vollbild"
    - button "Modal schließen"
    `);
  await expect(page.getByRole("dialog")).toMatchAriaSnapshot(`
    - text: Von
    - textbox: /\\d+\\.\\d+\\.\\d+/
    - text: Bis
    - textbox: /\\d+\\.\\d+\\.\\d+/
    - text: "Zeitraum:"
    - button "Alle Messwerte":
      - img
    - button "Daten laden"
    `);
  await expect(page.getByRole("dialog")).toMatchAriaSnapshot(`
    - text: Von
    - textbox: /\\d+\\.\\d+\\.\\d+/
    - text: Bis
    - textbox: /\\d+\\.\\d+\\.\\d+/
    - text: "Zeitraum:"
    - button "Alle Messwerte":
      - img
    - button "Daten laden"
    - img
    `);
  await page.getByRole("button", { name: "Alle Messwerte" }).click();
  await page.getByRole("option", { name: "Stündlich" }).click();
  await expect(page.getByRole("button", { name: "Stündlich" })).toBeVisible();
  await page.getByRole("button", { name: "Stündlich" }).click();
  await page.getByRole("option", { name: "Täglich" }).click();
  await expect(page.getByRole("button", { name: "Täglich" })).toBeVisible();
  await page
    .locator("div")
    .filter({ hasText: /^Von$/ })
    .getByRole("textbox")
    .click();
  await expect(page.getByLabel("Sunday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Monday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Tuesday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Wednesday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Thursday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Friday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Saturday", { exact: true })).toBeVisible();
  await page
    .locator("div")
    .filter({ hasText: /^Bis$/ })
    .getByRole("textbox")
    .click();
  await expect(page.getByLabel("Sunday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Monday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Tuesday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Wednesday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Thursday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Friday", { exact: true })).toBeVisible();
  await expect(page.getByLabel("Saturday", { exact: true })).toBeVisible();
  await page
    .locator("header")
    .filter({ hasText: "Detailansicht: +15V" })
    .click();
  await page.getByRole("button", { name: "Vollbild" }).click();
  await page.getByRole("button", { name: "Vollbild verlassen" }).click();
  await page.getByRole("button", { name: "Modal schließen" }).click();
});