import { expect, test } from "@playwright/test";
import type { PlayerState } from "@deadhead/schema";
import { addCredits, advance, goAway, logbook, playToDeal, run, state } from "./support";

const HOUR = 3_600_000;
const PILOTS = 7;

test.describe("the highlights pop-up (CR-025 Step 25.3)", () => {
  test("fits one phone screen with more pilots than it lists", async ({ page }) => {
    test.setTimeout(180_000);
    await page.setViewportSize({ width: 375, height: 667 });
    const owner = await playToDeal(page);
    await addCredits(page, 2_000_000);
    await run(page, "buyDispatchOffice");
    const bayId = owner.bays[0]!.id;
    for (let i = 0; i < PILOTS; i++) {
      const { ship } = await run<{ ship: { id: string } }>(page, "buyShip", {
        modelId: "courier",
        bayId,
      });
      const { pilot } = await run<{ pilot: { id: string } }>(page, "hirePilot", {
        locationId: "earth",
      });
      await run(page, "assignPilot", { pilotId: pilot.id, shipId: ship.id });
      await run(page, "setPilotMode", { pilotId: pilot.id, mode: "independent" });
    }
    const rosa = (await state(page)).pilots.find(
      (p: PlayerState["pilots"][number]) => p.isVeteran,
    )!;
    await run(page, "setPilotMode", { pilotId: rosa.id, mode: "independent" });
    // Away for the four hours (CR-028), back with a fresh load.
    await goAway(page);
    for (let h = 0; h < 4; h++) await advance(page, HOUR);

    await page.goto("/");
    const sheet = logbook(page);
    const pilots = sheet.getByRole("list", { name: "Pilots" });
    await expect(pilots).toBeVisible();
    await expect(pilots.getByText(/more pilots:/)).toBeVisible();
    // Everything fits: the sheet doesn't scroll, and the buttons are on screen.
    const fits = await sheet.evaluate((el) => el.scrollHeight <= el.clientHeight);
    expect(fits).toBe(true);
    await expect(sheet.getByRole("button", { name: "Done" })).toBeInViewport();
  });
});