import { render } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import { HpoVisualizer } from "../HpoVisualizer";

describe("HpoVisualizer sizing", () => {
  it("should render root svg with percentage sizing by default", () => {
    const { container } = render(<HpoVisualizer />);
    const rootSvg = container.querySelector(
      "svg[aria-label='Human organ visualizer']",
    ) as SVGSVGElement;
    expect(rootSvg).toBeDefined();
    expect(rootSvg.getAttribute("width")).toBe("100%");
    expect(rootSvg.getAttribute("height")).toBe("100%");
  });

  it("should apply width/height props to the container", () => {
    const { container } = render(<HpoVisualizer width={300} height={400} />);
    const root = container.firstElementChild as HTMLElement;
    expect(root.style.width).toBe("300px");
    expect(root.style.height).toBe("400px");
  });
});