import { fireEvent, render, screen } from "@testing-library/react";
import WhatsAppLink from "./WhatsAppLink";

/**
 * Testes de caminhos-base de WhatsAppLink (complemento de WhatsAppLink.test.tsx): o rótulo de métrica sem
 * assunto ("Contato") e cada botão do mouse nos dois eventos (click e auxclick).
 */

beforeEach(() => {
  jest.replaceProperty(process.env, "NODE_ENV", "production");
  localStorage.setItem("evandro.analytics-consent.v1", "granted");
  window.gtag = jest.fn();
});

afterEach(() => {
  jest.restoreAllMocks();
  localStorage.clear();
  delete window.gtag;
});

function renderLink(props: { service?: string } = {}) {
  render(
    <WhatsAppLink placement="contact_direct" {...props}>
      Conversar
    </WhatsAppLink>,
  );
  return screen.getByRole("link", { name: "Conversar" });
}

const auxclick = (button: number) =>
  new MouseEvent("auxclick", { button, bubbles: true, cancelable: true });

describe("WhatsAppLink", () => {
  it("path: no service -> the message says 'um projeto' and the metric says 'Contato'", () => {
    const link = renderLink();

    fireEvent.click(link, { button: 0 });

    expect(
      new URL(link.getAttribute("href") ?? "").searchParams.get("text"),
    ).toContain("sobre um projeto.");
    expect(window.gtag).toHaveBeenCalledWith(
      "event",
      "whatsapp_open",
      expect.objectContaining({
        service: "Contato",
        placement: "contact_direct",
      }),
    );
  });

  it("path: with a service -> the same text goes to the message and to the metric", () => {
    const link = renderLink({ service: "Sistemas web" });

    fireEvent.click(link, { button: 0 });

    expect(
      new URL(link.getAttribute("href") ?? "").searchParams.get("text"),
    ).toContain("sobre Sistemas web.");
    expect(window.gtag).toHaveBeenCalledWith(
      "event",
      "whatsapp_open",
      expect.objectContaining({ service: "Sistemas web" }),
    );
  });

  it.each([1, 2])(
    "path: click event with button %i -> not counted",
    (button) => {
      const link = renderLink();

      fireEvent.click(link, { button });

      expect(window.gtag).not.toHaveBeenCalled();
    },
  );

  it("path: auxclick with the primary button (0) -> not counted", () => {
    const link = renderLink();

    fireEvent(link, auxclick(0));

    expect(window.gtag).not.toHaveBeenCalled();
  });

  it("path: middle-button auxclick (1) -> counted once with the same metric labels", () => {
    const link = renderLink();

    fireEvent(link, auxclick(1));

    expect(window.gtag).toHaveBeenCalledTimes(1);
    expect(window.gtag).toHaveBeenCalledWith(
      "event",
      "whatsapp_open",
      expect.objectContaining({
        service: "Contato",
        placement: "contact_direct",
      }),
    );
  });

  it("path: no className given -> only the focus ring classes are applied", () => {
    const link = renderLink();

    expect(link.className.trim().startsWith("focus-visible:outline-none")).toBe(
      true,
    );
  });
});