import { test, expect, clickSpaLink, waitForSpaReady } from "./fixtures"
import { SEEDED_TEST_CONTENT } from "../fixtures/test-constants"

async function revealAll(page: import("@playwright/test").Page) {
    await page.evaluate(() => document.querySelectorAll(".reveal").forEach((entry) => entry.classList.add("revealed")))
}

test.describe("Seeded Public Frontend", () => {
    test.beforeEach(async ({ page }) => {
        await page.goto(`/de${SEEDED_TEST_CONTENT.home.path}`)
        await waitForSpaReady(page)
        await revealAll(page)
    })

    test("renders hero, features, richtext and accordion blocks on the seeded home page", async ({ page }) => {
        const hero = page.locator("[data-block='hero']").first()
        await expect(hero).toBeVisible()
        await expect(hero.locator("h1")).toHaveText("Playwright Seed Startseite")
        await expect(hero.locator("a").first()).toBeVisible()

        const features = page.locator("[data-block='features']")
        await expect(features).toBeVisible()
        await expect(features.locator(".feature-card")).toHaveCount(3)

        const richtext = page.locator("[data-block='richtext']").first()
        await expect(richtext).toBeVisible()
        await expect(richtext).toContainText("formatierter HTML-Inhalt")

        const accordion = page.locator("[data-block='accordion']")
        await expect(accordion).toBeVisible()

        const buttons = accordion.locator("button")
        await expect(buttons.first()).toHaveAttribute("aria-expanded", "true")
        const secondButton = buttons.nth(1)
        await expect(secondButton).toHaveAttribute("aria-expanded", "false")
        await secondButton.click()
        await expect(secondButton).toHaveAttribute("aria-expanded", "true")
    })

    test("renders the seeded contact page and validates the current form UI", async ({ page }) => {
        await page.goto(`/en${SEEDED_TEST_CONTENT.contact.path}`)
        await waitForSpaReady(page)
        await revealAll(page)

        const hero = page.locator("[data-block='hero']").first()
        await expect(hero).toBeVisible()
        await expect(hero.locator("h1")).toHaveText("Contact for the test run")

        const form = page.locator("[data-block='contact-form']")
        await expect(form).toBeVisible()
        await expect(page.getByLabel("Name")).toBeVisible()
        await expect(page.getByLabel("Email")).toBeVisible()
        await expect(page.locator("select, [role='combobox']").first()).toBeVisible()
        await expect(page.getByLabel("Message")).toBeVisible()

        const submitBtn = page.locator("button[type='submit'], button:has-text('Send')").first()
        await expect(submitBtn).toBeVisible()
        await submitBtn.click()
        await expect(page.locator("[data-block='contact-form']")).toBeVisible()
    })

    test("shows the 404 state for inactive seeded routes and can return home", async ({ page }) => {
        await page.goto(`/de${SEEDED_TEST_CONTENT.inactive.path}`)
        await waitForSpaReady(page)

        await expect(page.locator("main")).toContainText("404")

        const homeLink = page.locator("main").getByRole("link", { name: "Zur Startseite" })
        await expect(homeLink).toBeVisible()
        await homeLink.click()
        await waitForSpaReady(page)
        await expect(page).toHaveURL(/\/de\/?$/)
    })

    test("uses SPA navigation for the seeded CTA without a full reload", async ({ page }) => {
        await page.goto(`/en${SEEDED_TEST_CONTENT.home.path}`)
        await waitForSpaReady(page)

        await clickSpaLink(page, "[data-block='hero'] a")
        await expect(page).toHaveURL(new RegExp(`/en${SEEDED_TEST_CONTENT.contact.path}$`))
        await expect(page.locator("[data-block='contact-form']")).toBeVisible()
    })
})