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

describe("Dialog Component", () => {
  const props: DialogProps = {
    dataTestId: "test-id",
    appendTo: document.body,
    autoFocus: true,
    className: "custom-dialog",
    closeIcon: true,
    contentStyle: { color: "blue" },
    dir: "ltr",
    height: "300px",
    id: "dialog-1",
    minWidth: "200px",
    style: { backgroundColor: "lightgrey" },
    themeColor: "primary",
    title: "Dialog Title",
    width: "400px",
  };

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

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