import { render, screen } from "@testing-library/react";
import { Loader2 } from "lucide-react";
import { describe, expect, it } from "vitest";
import { StatusBadge, StatusDot, StatusIcon } from "./status";

describe("semantic status primitives", () => {
  it.each(["neutral", "info", "success", "warning", "danger"] as const)(
    "renders the %s tone through the shared semantic class",
    (tone) => {
      render(<StatusBadge tone={tone}>{tone}</StatusBadge>);

      expect(screen.getByText(tone)).toHaveClass(`status-tone-${tone}`);
      expect(screen.getByText(tone)).toHaveAttribute("data-status-tone", tone);
    }
  );

  it("keeps a standalone status dot accessible when it has a label", () => {
    render(<StatusDot tone="danger" label="数据源离线" />);

    expect(screen.getByRole("status", { name: "数据源离线" })).toHaveAttribute(
      "data-status-tone",
      "danger"
    );
  });

  it("marks decorative dots as hidden from assistive technology", () => {
    const { container } = render(<StatusDot tone="success" />);

    expect(container.firstChild).toHaveAttribute("aria-hidden", "true");
  });

  it("exposes activity modes for reduced-motion-safe CSS", () => {
    const { container } = render(
      <StatusIcon tone="info" activity="loading">
        <Loader2 />
      </StatusIcon>
    );

    expect(container.querySelector(".status-glyph")).toHaveAttribute(
      "data-activity",
      "loading"
    );
  });

  it("does not add a breathing marker when an active badge has no explicit icon", () => {
    const { container } = render(
      <StatusBadge tone="info" activity="loading">
        执行中
      </StatusBadge>
    );

    expect(container.querySelector(".status-dot")).not.toBeInTheDocument();
  });
});
