import { render, screen } from "@testing-library/react";
import { LoadingIndicator } from ".";

const CLASS_NAME = "mobius-loading-indicator";

describe("Test for LoadingIndicator", () => {
  it("should render the LoadingIndicator component", () => {
    const { container } = render(<LoadingIndicator />);
    expect(container).toBeTruthy();
  });

  describe("uses correct class names", () => {
    it("uses Mobius class", () => {
      render(<LoadingIndicator data-testid="test" />);
      expect(screen.getByTestId("test")).toHaveClass("mobius");
    });

    it("uses base Mobius class", () => {
      render(<LoadingIndicator data-testid="test" />);
      expect(screen.getByTestId("test")).toHaveClass(CLASS_NAME);
    });

    it("includes custom class name", () => {
      render(<LoadingIndicator data-testid="test" className="my-class" />);
      expect(screen.getByTestId("test")).toHaveClass("my-class");
      expect(screen.getByTestId("test")).toHaveClass(CLASS_NAME);
    });
  });
});
