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

test("A saved citation with a 684-character assistant ID becomes a chip and can be commented and sent", WEB,
  async ({ t3, app, screen, browser }) => {
    const project = await t3.project("citation-demo");
    await t3.thread({ project, title: "Long assistant citation", messages: ["Explain the sample"] });
    await t3.open();
    await screen.getByRole("button", "Long assistant citation, Done, citation-demo", { exact: true }).press("Enter");
    const quote = "The assistant response uses a long nested handoff message identifier.";
    const messageId = "message:pi:nested-handoff:" + "a".repeat(658);
    const query = new URLSearchParams({ text: quote, start: "0", end: String(quote.length), prefix: "", suffix: "" });
    const raw = `[Assistant quote](t3-citation://v1/synthetic-environment/synthetic-thread/${messageId}?${query})`;
    await screen.getByRole("textbox").fill(raw);
    // Reload exercises restoration of a raw serialized citation in an existing draft.
    await browser.reload();
    await screen.getByRole("textbox").tap();
    await app.screenshot("restored-long-id-citation");
    await expect(screen.getByRole("button", "Add comment to citation")).toBeVisible();
    await screen.getByRole("button", "Add comment to citation").tap();
    await screen.getByRole("textbox", "Comment on selected text").fill("Please explain this quoted response.");
    await app.screenshot("optional-comment");
    await screen.getByRole("textbox", "Comment on selected text").press("Control+Enter");
    await screen.getByRole("button", "Quoted assistant text: Please explain this quoted response.. Show details").tap();
    await app.screenshot("sent-citation-open");
    await expect(screen.getByText(quote, { exact: true })).toBeVisible();
  });