import { fireEvent, render, screen } from "@testing-library/react";
import ContactOfferLink from "./ContactOfferLink";
import { CONTACT_KIND_EVENT } from "./contact-subject";

jest.mock("next/link", () => ({
  __esModule: true,
  default: ({
    children,
    prefetch,
    ...props
  }: { children?: React.ReactNode; prefetch?: boolean | null } & Record<
    string,
    unknown
  >) => (
    <a data-prefetch={String(prefetch)} {...props}>
      {children}
    </a>
  ),
}));

describe("ContactOfferLink", () => {
  it("links to the form with the type in the address, and prefetches nothing until hover or focus", () => {
    render(
      <ContactOfferLink kind="sistema" className="botao">
        Começar pelo sistema
      </ContactOfferLink>,
    );

    const link = screen.getByRole("link", { name: "Começar pelo sistema" });
    expect(link).toHaveAttribute("href", "/?tipo=sistema#contact");
    expect(link).toHaveClass("botao");
    expect(link).toHaveAttribute("data-prefetch", "false");
    fireEvent.mouseEnter(link);
    expect(link).toHaveAttribute("data-prefetch", "null");
  });

  it("tells the form which type was chosen, through a window event, when it is clicked", () => {
    const heard: unknown[] = [];
    const listener = (event: Event) =>
      heard.push((event as CustomEvent).detail);
    window.addEventListener(CONTACT_KIND_EVENT, listener);
    try {
      render(<ContactOfferLink kind="revisao">Começar</ContactOfferLink>);

      fireEvent.click(screen.getByRole("link", { name: "Começar" }));
      expect(heard).toEqual(["revisao"]);
    } finally {
      window.removeEventListener(CONTACT_KIND_EVENT, listener);
    }
  });

  it("still tells the form when another handler already cancelled the click (the home scroll manager does that to scroll by itself)", () => {
    const heard: unknown[] = [];
    const listener = (event: Event) =>
      heard.push((event as CustomEvent).detail);
    const cancel = (event: Event) => event.preventDefault();
    window.addEventListener(CONTACT_KIND_EVENT, listener);
    document.addEventListener("click", cancel, true);
    try {
      render(<ContactOfferLink kind="site">Começar</ContactOfferLink>);

      fireEvent.click(screen.getByRole("link", { name: "Começar" }));
      expect(heard).toEqual(["site"]);
    } finally {
      window.removeEventListener(CONTACT_KIND_EVENT, listener);
      document.removeEventListener("click", cancel, true);
    }
  });
});