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

test("Conversation scrolls after an empty-space click and Shift+F6 without jumping on entry", WEB, async ({ t3, app, screen, browser }) => {
  const project = await t3.project("keyboard-scroll-demo");
  await t3.thread({ project, title: "Keyboard scrolling", messages: Array.from({ length: 20 }, (_, turn) => `Reading section ${turn + 1}: synthetic keyboard scrolling example`) });
  await t3.open();
  await screen.getByRole("button", "Keyboard scrolling, Done, keyboard-scroll-demo").press("Enter");
  const timeline = browser.locator(".messages-timeline-scroll");
  await timeline.waitFor({ state: "visible" });
  const position = () => browser.evaluate(() => document.querySelector<HTMLElement>(".messages-timeline-scroll")!.scrollTop);
  await app.screenshot("timeline-ready");
  const reset = async (label: string) => {
    const point = await browser.evaluate(() => { const r = document.querySelector(".messages-timeline-scroll")!.getBoundingClientRect(); return { x: r.right - 12, y: r.top + r.height * 0.5 }; });
    await browser.mouse.move(point.x, point.y);
    await browser.mouse.wheel(0, -900);
    await app.screenshot(`${label}-reading-position`);
    return position();
  };
  const clickBlank = async () => {
    const point = await browser.evaluate(() => { const r = document.querySelector(".messages-timeline-scroll")!.getBoundingClientRect(); return { x: r.right - 12, y: r.top + r.height * 0.5 }; });
    await browser.mouse.move(point.x, point.y);
    await browser.mouse.down();
    await browser.mouse.up();
    await browser.mouse.move(600, 28);
  };
  const clickStart = await reset("click");
  await clickBlank();
  await app.screenshot("click-before-keys");
  await browser.keyboard.press("ArrowDown");
  await app.screenshot("click-after-arrow-down");
  const clickArrow = await position();
  await browser.keyboard.press("PageDown");
  await app.screenshot("click-after-page-down");
  const clickPage = await position();

  const f6Start = await reset("shift-f6");
  await screen.getByRole("textbox").tap();
  await browser.keyboard.press("Shift+F6");
  await app.screenshot("shift-f6-entry-preserves-position");
  const f6Entry = await position();
  await browser.keyboard.press("ArrowDown");
  await app.screenshot("shift-f6-after-arrow-down");
  const f6Arrow = await position();
  await browser.keyboard.press("PageDown");
  await app.screenshot("shift-f6-after-page-down");
  const f6Page = await position();
  await screen.getByRole("button", "New thread", { exact: true }).press("Enter");
  const composer = screen.getByRole("textbox");
  await composer.tap();
  await browser.keyboard.press("Shift+F6");
  await browser.keyboard.press("Shift+F6");
  await browser.keyboard.press("F6");
  await app.screenshot("empty-conversation-f6-entry");
  await browser.keyboard.press("F6");
  await composer.fill("Show the synthetic sample reply");
  await composer.press("Enter");
  await screen.getByText("This turn is a replay.", { exact: false }).waitFor({ state: "visible" });
  await screen.getByRole("button", "Stop generation").waitFor({ state: "hidden" });
  await app.screenshot("empty-conversation-now-has-content");
  const populatedStart = await reset("populated");
  await composer.tap();
  await browser.keyboard.press("Shift+F6");
  await app.screenshot("populated-conversation-reentry");
  const populatedEntry = await position();
  await browser.keyboard.press("ArrowDown");
  await app.screenshot("populated-after-arrow-down");
  const populatedArrow = await position();
  await browser.keyboard.press("PageDown");
  await app.screenshot("populated-after-page-down");
  const populatedPage = await position();
  expect.soft(Math.abs(populatedEntry - populatedStart), "Reentering a newly populated conversation preserves position").toBeLessThan(2);
  expect.soft(populatedArrow, "ArrowDown scrolls a conversation first entered while empty").toBeGreaterThan(populatedEntry);
  expect.soft(populatedPage, "PageDown scrolls a conversation first entered while empty").toBeGreaterThan(populatedArrow);
  console.log(JSON.stringify({ clickStart, clickArrow, clickPage, f6Start, f6Entry, f6Arrow, f6Page }));
  expect.soft(clickArrow, "ArrowDown scrolls after clicking blank conversation space").toBeGreaterThan(clickStart);
  expect.soft(clickPage, "PageDown scrolls after clicking blank conversation space").toBeGreaterThan(clickArrow);
  expect.soft(Math.abs(f6Entry - f6Start), "Shift+F6 preserves the reading position").toBeLessThan(2);
  expect.soft(f6Arrow, "ArrowDown scrolls after Shift+F6").toBeGreaterThan(f6Entry);
  expect.soft(f6Page, "PageDown scrolls after Shift+F6").toBeGreaterThan(f6Arrow);
});