import { expect } from "e2e";
import { test, WEB } from "./t3.ts";

test("Two tabs preserve each other's settings, stashed prompts and drafts", WEB, async ({t3, app, browser, live}) => {
  await browser.emulateMedia({colorScheme:"light"});
  await browser.addInitScript(() => {
    document.addEventListener("DOMContentLoaded", () => {
      const style = document.createElement("style");
      style.textContent = '[role="option"] span.min-w-0.flex-1.truncate { visibility: hidden; }';
      document.head.append(style);
    });
  });
  await t3.project("alpha");
  await t3.project("beta");
  await t3.open();
  const surface = live;
  surface.context().setDefaultTimeout(60000);
  const a = surface.page();
  await a.getByTestId("composer-editor").waitFor();
  await a.goto(`${app.baseUrl}/settings/general`);
  const capture = async (label: string) => {
    for (let attempt = 0; attempt < 10; attempt++) {
      const first = await a.screenshot({animations:"disabled", caret:"hide"});
      await a.waitForTimeout(500);
      const second = await a.screenshot({animations:"disabled", caret:"hide"});
      if (first.equals(second)) { await app.screenshot(label); return; }
    }
    throw new Error("The screen did not settle for its evidence capture");
  };
  const b = await surface.context().newPage();
  await b.goto(`${app.baseUrl}/settings/appearance`);
  
  await b.getByRole("switch", {name: "Wrap code, diffs, and file previews by default"}).waitFor();
  await a.getByRole("combobox", {name: "Timestamp format"}).click();
  await a.getByRole("option", {name: "12-hour"}).click();
  await capture("tab-a-saved-12-hour");
  await b.getByRole("switch", {name: "Wrap code, diffs, and file previews by default"}).click();
  await a.reload();
  await a.getByRole("combobox", {name: "Timestamp format"}).waitFor();
  await a.getByRole("combobox", {name: "Timestamp format"}).scrollIntoViewIfNeeded();
  await capture("settings-after-both-tabs-save");
  const time = await a.getByRole("combobox", {name: "Timestamp format"}).innerText();
  await a.goto(app.baseUrl!);
  await b.goto(app.baseUrl!);
  await a.getByTestId("composer-editor").waitFor();
  await b.getByTestId("composer-editor").waitFor();
  await a.getByTestId("composer-editor").fill("Tab A: keep the accessibility review");
  await a.getByTestId("composer-editor").press("Control+s");
  await a.getByRole("button", {name: /Stashed prompts: 1/}).waitFor();
  await b.getByTestId("composer-editor").fill("Tab B: keep the performance review");
  await b.getByTestId("composer-editor").press("Control+s");
  await b.getByRole("button", {name: /Stashed prompts:/}).waitFor();
  await a.reload();
  await a.getByRole("button", {name: /Stashed prompts:/}).click();
  await a.getByRole("list", {name: "Stashed prompts"}).waitFor();
  await capture("stash-after-both-tabs-save");
  const stash = await a.getByRole("list", {name: "Stashed prompts"}).innerText();
  await a.getByRole("button", {name:"Close stash"}).click();
  await b.reload();
  await b.getByTestId("composer-editor").waitFor();
  await b.getByRole("button", {name: "New thread", exact:true}).click();
  await b.getByRole("option", {name:/beta/}).click();
  await b.getByTestId("composer-editor").fill("Beta draft: keep this unsent deployment plan");
  const betaUrl = b.url();
  await a.getByRole("button", {name: "New thread", exact:true}).click();
  await a.getByRole("option", {name:/alpha/}).click();
  await a.getByTestId("composer-editor").fill("Alpha draft: keep this unsent test plan");
  await a.getByTestId("composer-editor").press("Tab");
  await a.goto(betaUrl);
  await a.getByTestId("composer-editor").waitFor();
  await capture("beta-draft-after-both-tabs-save");
  const beta = (await a.getByTestId("composer-editor").innerText()).trim();
  await expect({time, stashA:stash.includes("Tab A: keep the accessibility review"), stashB:stash.includes("Tab B: keep the performance review"), beta}).toEqual({time:"12-hour", stashA:true, stashB:true, beta:"Beta draft: keep this unsent deployment plan"});
  await b.close();
});