import React from "react";
import { render } from "@testing-library/react";
import "@testing-library/jest-dom";
import Badge from "../Badge";
import { BadgeProps } from "../BadgeProps";

describe("Badge Component", () => {
  const props: BadgeProps = {
    dataTestId: "test-id",
    align: { horizontal: "end", vertical: "top" },
    children: <span>99+</span>,
    className: "custom-badge-class",
    cutoutBorder: false,
    dir: "ltr",
    fillMode: "solid",
    position: "edge",
    rounded: "medium",
    size: "medium",
    style: { color: "blue" },
    themeColor: "primary",
  };

  it("renders all props correctly", () => {
    render(<Badge {...props} />);
  });

  it("matches the snapshot", () => {
    const { asFragment } = render(<Badge {...props} />);
    expect(asFragment()).toMatchSnapshot();
  });
});