import { describe, it, expect } from "vitest";
import { mount } from "@vue/test-utils";
import StatusBadge from "../StatusBadge.vue";

describe("StatusBadge", () => {
  it("renders the label", () => {
    const w = mount(StatusBadge, { props: { status: "ok", label: "Healthy" } });
    expect(w.text()).toContain("Healthy");
  });

  it("colours the dot by status", () => {
    expect(mount(StatusBadge, { props: { status: "error" } }).html()).toContain("bg-rose-400");
    expect(mount(StatusBadge, { props: { status: "warn" } }).html()).toContain("bg-amber-400");
    expect(mount(StatusBadge, { props: { status: "idle" } }).html()).toContain("bg-zinc-600");
  });

  it("shows the pulse ring only when pulse is set", () => {
    const off = mount(StatusBadge, { props: { status: "live" } });
    expect(off.find('[data-testid="status-pulse"]').exists()).toBe(false);
    const on = mount(StatusBadge, { props: { status: "live", pulse: true } });
    expect(on.find('[data-testid="status-pulse"]').exists()).toBe(true);
  });
});