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

const USERNAME = process.env.LOCAL_USERNAME ?? "admin";
const PASSWORD = process.env.LOCAL_PASSWORD ?? "";

test("labeling an unknown device makes it known, clearing reverts it", async ({ page }) => {
  test.skip(!PASSWORD, "LOCAL_PASSWORD not set");

  await page.goto("/");
  await page.getByPlaceholder("Username").fill(USERNAME);
  await page.getByPlaceholder("Password").fill(PASSWORD);
  await page.getByRole("button", { name: "Sign in" }).click();
  await expect(page.locator(".device-table tbody tr").first()).toBeVisible({ timeout: 15_000 });

  const unknownRow = page.locator(".device-table tbody tr").filter({ hasText: "unknown" }).first();
  await expect(unknownRow).toBeVisible();
  const ip = await unknownRow.getAttribute("data-ip");

  // Exact match via data-ip, not text -- an IP like 192.168.1.1 is a
  // substring of 192.168.1.100/117/171/etc, so text-based row filtering is
  // not reliable here (caught this the hard way on the first run).
  const row = page.locator(`tr[data-ip="${ip}"]`);

  await row.locator(".name-cell").click();
  await row.getByPlaceholder("Label this device").fill("Playwright test label");
  await row.getByRole("button", { name: "Save" }).click();

  await expect(row.locator(".device-badge")).toHaveText("known");
  await expect(row).toContainText("Playwright test label");

  // Clear it back out so the test doesn't leave permanent residue on a real device.
  await row.locator(".name-cell").click();
  await row.getByPlaceholder("Label this device").fill("");
  await row.getByRole("button", { name: "Save" }).click();

  await expect(row.locator(".device-badge")).toHaveText("unknown");
  await expect(row).not.toContainText("Playwright test label");
});