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

describe("LoadingSpinner", () => {
  it("renders overlay when loading is true", () => {
    render(LoadingSpinner, { props: { loading: true } });

    const overlay = screen.getByRole("status");
    expect(overlay).toBeInTheDocument();
  });

  it("does not render when loading is false", () => {
    render(LoadingSpinner, { props: { loading: false } });

    expect(screen.queryByRole("status")).not.toBeInTheDocument();
  });

  it("contains a spinner element", () => {
    render(LoadingSpinner, { props: { loading: true } });

    const overlay = screen.getByRole("status");
    const spinner = overlay.querySelector(".spinner");
    expect(spinner).toBeInTheDocument();
  });
});
