import { describe, expect, it, vi } from "vitest";
import { fireEvent, render, screen } from "@testing-library/react";
import Link from "next/link";
import SpecialtyChips from "@/app/component/SpecialtyChips";

const root = { id: "13", name: "جراحی عمومی", parent_id: null };
const gi = { id: "169", name: "جراح گوارش", parent_id: "13" };
const thyroid = { id: "168", name: "جراح تیروئید", parent_id: "13" };

describe("SpecialtyChips", () => {
  it("تخصص اصلی را نشان می‌دهد و بقیه را می‌شمارد", () => {
    render(<SpecialtyChips specialties={[gi, root, thyroid]} />);

    expect(screen.getByText(/جراحی عمومی/)).toBeInTheDocument();
    expect(screen.getByRole("button", { name: "نمایش 2 تخصص دیگر" })).toHaveTextContent("+2");

    // بقیه تا پیش از کلیک در DOM نیستند — همین کارت را کوتاه نگه می‌دارد.
    expect(screen.queryByText("جراح گوارش")).not.toBeInTheDocument();
  });

  it("کلیک روی شمارنده فهرست کامل را باز می‌کند", () => {
    render(<SpecialtyChips specialties={[root, gi, thyroid]} />);

    fireEvent.click(screen.getByRole("button", { name: "نمایش 2 تخصص دیگر" }));

    expect(screen.getByText("جراح گوارش")).toBeInTheDocument();
    expect(screen.getByText("جراح تیروئید")).toBeInTheDocument();
    // تخصص اصلی هم در فهرست هست تا تصویر کامل باشد.
    expect(screen.getAllByText(/جراحی عمومی/).length).toBeGreaterThan(1);
  });

  it("کلیک روی شمارنده نباید لینک کارت را فعال کند", () => {
    // کارت داخل <Link> است؛ بدون preventDefault/stopPropagation هر بار که کاربر
    // تخصص‌ها را می‌بیند به صفحهٔ پزشک پرت می‌شود.
    const onParentClick = vi.fn();

    render(
      <Link href="/doctor/uuid" onClick={onParentClick}>
        <SpecialtyChips specialties={[root, gi]} />
      </Link>
    );

    // fireEvent مقدار false می‌دهد وقتی preventDefault صدا زده شده باشد.
    const notPrevented = fireEvent.click(
      screen.getByRole("button", { name: "نمایش 1 تخصص دیگر" })
    );

    expect(notPrevented).toBe(false);
    expect(onParentClick).not.toHaveBeenCalled();
  });

  it("تک‌تخصص هیچ شمارنده‌ای ندارد", () => {
    render(<SpecialtyChips specialties={[root]} />);

    expect(screen.getByText(/جراحی عمومی/)).toBeInTheDocument();
    expect(screen.queryByRole("button")).not.toBeInTheDocument();
  });

  it("پزشک بدون تخصص چیزی رندر نمی‌کند و کرش نمی‌کند", () => {
    const { container: empty } = render(<SpecialtyChips specialties={[]} />);
    expect(empty).toBeEmptyDOMElement();

    const { container: missing } = render(<SpecialtyChips specialties={undefined} />);
    expect(missing).toBeEmptyDOMElement();
  });

  it("شمارنده متن دارد نه فقط علامت — برای صفحه‌خوان", () => {
    render(<SpecialtyChips specialties={[root, gi, thyroid]} />);

    const button = screen.getByRole("button");
    expect(button).toHaveAttribute("type", "button");
    expect(button).toHaveAccessibleName("نمایش 2 تخصص دیگر");
  });
});