import { describe, it, expect } from "vitest";
import { render } from "@testing-library/react";
import { ComponentIcon } from "./ComponentIcon";
import { COMPONENTS } from "@/lib/componentMeta";

describe("ComponentIcon", () => {
  it("renders an svg glyph for every catalogue component", () => {
    for (const c of COMPONENTS) {
      const { container, unmount } = render(<ComponentIcon type={c.type} color={c.color} />);
      const svg = container.querySelector("svg");
      expect(svg, `no svg for ${c.type}`).not.toBeNull();
      unmount();
    }
  });

  it("renders the dashed placeholder for an unknown type", () => {
    const { container } = render(<ComponentIcon type="TotallyUnknown" color="#123456" />);
    const dashed = container.querySelector("[stroke-dasharray]");
    expect(dashed).not.toBeNull();
  });

  it("renders the dashed placeholder for undefined type without crashing", () => {
    const { container } = render(<ComponentIcon type={undefined as unknown as string} color="#123456" />);
    const dashed = container.querySelector("[stroke-dasharray]");
    expect(dashed).not.toBeNull();
  });
});
