import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { FreetextWidget } from "./FreetextWidget";

function reloadIsBlocked() {
  const event = new Event("beforeunload", { cancelable: true });
  window.dispatchEvent(event);
  return event.defaultPrevented;
}

test("protects an answer draft until cleared or unmounted, including after sending", async () => {
  const onRespond = vi.fn();
  const { unmount } = render(<FreetextWidget descriptor={{ id: "u1", widget: "freetext" }} onRespond={onRespond} />);
  expect(reloadIsBlocked()).toBe(false);
  await userEvent.type(screen.getByRole("textbox"), "Draft answer");
  expect(reloadIsBlocked()).toBe(true);
  await userEvent.clear(screen.getByRole("textbox"));
  expect(reloadIsBlocked()).toBe(false);
  await userEvent.type(screen.getByRole("textbox"), "Answer{Enter}");
  expect(onRespond).toHaveBeenCalledWith({ id: "u1", kind: "freetext", text: "Answer" });
  expect(reloadIsBlocked()).toBe(true);
  await userEvent.type(screen.getByRole("textbox"), " updated");
  expect(reloadIsBlocked()).toBe(true);
  unmount();
  expect(reloadIsBlocked()).toBe(false);
});
test("submits typed text", async () => {
  const onRespond = vi.fn();
  render(<FreetextWidget descriptor={{ id: "u1", widget: "freetext" }} onRespond={onRespond} />);
  await userEvent.type(screen.getByRole("textbox"), "ciao");
  await userEvent.click(screen.getByRole("button", { name: /send/i }));
  expect(onRespond).toHaveBeenCalledWith({ id: "u1", kind: "freetext", text: "ciao" });
});