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

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

test("protects manual response drafts until cleared or unmounted, including after sending", async () => {
  const onRespond = vi.fn();
  const { unmount } = render(<FallbackWidget descriptor={{ id: "unknown", widget: "unknown" }} onRespond={onRespond} />);
  expect(reloadIsBlocked()).toBe(false);
  await userEvent.type(screen.getByRole("textbox"), "Manual answer");
  expect(reloadIsBlocked()).toBe(true);
  await userEvent.clear(screen.getByRole("textbox"));
  expect(reloadIsBlocked()).toBe(false);
  await userEvent.type(screen.getByRole("textbox"), "Correction");
  await userEvent.click(screen.getByRole("button", { name: "Send" }));
  expect(onRespond).toHaveBeenCalledWith({ id: "unknown", control: "freetext", text: "Correction" });
  expect(reloadIsBlocked()).toBe(true);
  await userEvent.type(screen.getByRole("textbox"), " updated");
  expect(reloadIsBlocked()).toBe(true);
  unmount();
  expect(reloadIsBlocked()).toBe(false);
});