import React from "react";
import { render, act } from "@testing-library/react";
import "@testing-library/jest-dom";
import { CalendarProps } from "../CalendarProps";
import Calendar from "../Calendar";

describe("Calendar Component", () => {
  const props: CalendarProps = {
    dataTestId: "test-id",
    ariaDescribedBy: "calendar-description",
    ariaLabelledBy: "calendar-label",
    bottomView: "month",
    cell: () => <td>Custom Cell</td>,
    className: "custom-calendar-class",
    defaultActiveView: "month",
    defaultValue: new Date(),
    disabled: false,
    focusedDate: new Date(),
    headerTitle: () => <div>Custom Header Title</div>,
    id: "custom-calendar-id",
    max: new Date(2099, 11, 31),
    min: new Date(1900, 0, 1),
    navigation: true,
    navigationItem: () => <div>Custom Navigation Item</div>,
    tabIndex: 0,
    topView: "century",
    value: new Date(),
    weekCell: () => <td>Custom Week Cell</td>,
    weekNumber: true,
  };

  it("renders all props correctly", async () => {
    await act(async () => {
      render(<Calendar {...props} />);
    });
  });

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