import { render } from "@testing-library/react";

import { Label } from "../Label";

// htmlFor is required
describe("rendering Label", () => {
  describe("initial state", () => {
    it("has default class label", () => {
      const { getByTestId } = render(
        <Label data-testid="test-id" htmlFor="test-label" />,
      );
      expect(getByTestId("test-id")).toHaveClass("label");
    });
  });
  describe("passed props", () => {
    it("has additional class when className is set ", () => {
      const { getByTestId } = render(
        <Label
          data-testid="test-id"
          htmlFor="test-label"
          className="test-class"
        />,
      );
      expect(getByTestId("test-id")).toHaveClass("label");
      expect(getByTestId("test-id")).toHaveClass("test-class");
    });
    it("has htmlFor label", () => {
      const { getByTestId } = render(
        <Label data-testid="test-id" htmlFor="test-label" />,
      );
      expect(getByTestId("test-id").htmlFor).toBe("test-label");
    });
    it("renders children", () => {
      const { getByText } = render(
        <Label data-testid="test-id" htmlFor="test-label">
          test
        </Label>,
      );
      expect(getByText("test")).toBeInTheDocument();
    });
  });
});