import { describe, expect, it } from "vitest";
import { render, screen } from "@testing-library/svelte";
import NoResultsMonkey from "./NoResultsMonkey.svelte";

describe("NoResultsMonkey", () => {
  it("renders with default message", () => {
    render(NoResultsMonkey);

    expect(screen.getByText("No results found")).toBeInTheDocument();
  });

  it("renders with custom message", () => {
    render(NoResultsMonkey, { props: { message: "Nothing here" } });

    expect(screen.getByText("Nothing here")).toBeInTheDocument();
  });

  it("renders SVG illustration", () => {
    const { container } = render(NoResultsMonkey);

    const svg = container.querySelector("svg");
    expect(svg).toBeInTheDocument();
  });

  it("applies custom size", () => {
    const { container } = render(NoResultsMonkey, {
      props: { size: 200 },
    });

    const wrapper = container.querySelector(".monkey");
    expect(wrapper).toHaveStyle("width: 200px");
  });
});
