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

describe("ProgressBar Component", () => {
  const props: ProgressBarProps = {
    animation: false,
    ariaLabel: "Progress",
    className: "custom-progressbar",
    dir: "ltr",
    disabled: false,
    emptyClassName: "empty-class",
    emptyStyle: { backgroundColor: "lightgrey" },
    label: () => <span>Progress</span>,
    labelPlacement: "end",
    labelVisible: true,
    max: 100,
    min: 0,
    orientation: "horizontal",
    progressClassName: "progress-class",
    progressStyle: { backgroundColor: "blue" },
    reverse: false,
    style: { height: "20px" },
    tabIndex: 0,
    value: 50,
  };

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

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