const { test, expect } = require("@playwright/test")

async function openApp(page) {
  await page.goto("/index.html")
  await page.evaluate(() => {
    localStorage.clear()
    sessionStorage.clear()
  })
  await page.goto("/index.html")
}

async function skipIntro(page) {
  await expect(page.locator("#intro-overlay")).toBeVisible()
  await page.locator("#intro-skip").click()
  await expect(page.locator("#intro-overlay")).toBeHidden()
  await expect(page.locator("[data-guess-grid] .tile")).toHaveCount(30)
  await expect(page.locator("[data-key]")).toHaveCount(26)
}

test("loads the intro and reveals the game board", async ({ page }) => {
  await openApp(page)

  await expect(page.locator("#intro-overlay")).toBeVisible()
  await expect(page.locator("#intro-tiles .intro-tile")).toHaveCount(6)
  await skipIntro(page)
  await expect(page.locator("#round-status")).not.toContainText("Loading")
})

test("uses dark mode by default and preserves a light preference", async ({ page }) => {
  await openApp(page)
  await skipIntro(page)

  await expect(page.locator("body")).toHaveClass(/dark-theme/)
  await page.locator("#theme-button").click()
  await expect(page.locator("body")).not.toHaveClass(/dark-theme/)
  await expect(page.locator("#theme-button")).toHaveAttribute("aria-label", "Switch to dark mode")

  await page.reload()
  await skipIntro(page)
  await expect(page.locator("body")).not.toHaveClass(/dark-theme/)
})

test("pressing Enter after changing theme does not re-trigger the theme button", async ({ page }) => {
  await openApp(page)
  await skipIntro(page)

  await page.locator("#theme-button").click()
  await expect(page.locator("body")).not.toHaveClass(/dark-theme/)

  await page.keyboard.press("Enter")
  await expect(page.locator("body")).not.toHaveClass(/dark-theme/)
})

test("keyboard input fills and deletes board tiles", async ({ page }) => {
  await openApp(page)
  await skipIntro(page)

  const firstTile = page.locator("[data-guess-grid] .tile").first()
  await page.keyboard.press("A")
  await expect(firstTile).toHaveText("a")
  await expect(firstTile).toHaveAttribute("data-state", "active")

  await page.keyboard.press("Backspace")
  await expect(firstTile).toHaveText("")
  await expect(firstTile).not.toHaveAttribute("data-letter", /./)
})

test("incomplete guesses show feedback without changing theme", async ({ page }) => {
  await openApp(page)
  await skipIntro(page)

  await page.keyboard.press("Enter")
  await expect(page.locator("[data-alert-container]")).toContainText("Not enough letters")
  await expect(page.locator("body")).toHaveClass(/dark-theme/)
})

test("stats and leaderboard modals open", async ({ page }) => {
  await openApp(page)
  await skipIntro(page)

  await page.locator("#Stats-button").click()
  await expect(page.locator("#stats-modal")).toBeVisible()
  await page.locator("#stats-modal .close-button").click()
  await expect(page.locator("#stats-modal")).toBeHidden()

  await page.locator("#leaderboard-button").click()
  await expect(page.locator("#leaderboard-modal")).toBeVisible()
})