import { describe, expect, test, vi } from "vitest";
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { I18nProvider } from "@lingui/react";
import { i18n } from "@lingui/core";
import { Modal } from "../../../components/ui/Modal.tsx";

const wrap = (ui: React.ReactNode) =>
  render(<I18nProvider i18n={i18n}>{ui}</I18nProvider>);

describe("Modal", () => {
  test("is a labelled dialog that locks the page's scroll", () => {
    wrap(<Modal title="Settings" onClose={() => {}}>body</Modal>);
    expect(screen.getByRole("dialog", { name: "Settings" })).toHaveTextContent(
      "body",
    );
    expect(document.documentElement.style.overflowY).toBe("hidden");
  });

  test("closes on Escape, the backdrop and the ✕ — not a click inside", async () => {
    const onClose = vi.fn();
    const user = userEvent.setup();
    wrap(
      <Modal title="T" onClose={onClose}>
        <button type="button">inside</button>
      </Modal>,
    );
    await user.click(screen.getByText("inside"));
    expect(onClose).not.toHaveBeenCalled();
    await user.keyboard("{Escape}");
    await user.click(screen.getByRole("button", { name: "Close" }));
    await user.click(document.querySelector(".modal-backdrop")!);
    expect(onClose).toHaveBeenCalledTimes(3);
  });

  test("onBeforeClose can refuse", async () => {
    const onClose = vi.fn();
    const user = userEvent.setup();
    wrap(
      <Modal title="T" onClose={onClose} onBeforeClose={() => false}>x</Modal>,
    );
    await user.keyboard("{Escape}");
    await user.click(screen.getByRole("button", { name: "Close" }));
    expect(onClose).not.toHaveBeenCalled();
  });

  test("an Escape something inside already handled is left alone", async () => {
    const onClose = vi.fn();
    const user = userEvent.setup();
    wrap(
      <Modal title="T" onClose={onClose}>
        <input onKeyDown={(e) => e.key === "Escape" && e.preventDefault()} />
      </Modal>,
    );
    await user.click(screen.getByRole("textbox"));
    await user.keyboard("{Escape}");
    expect(onClose).not.toHaveBeenCalled();
  });
});