import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { axe } from "vitest-axe";
import { describe, expect, it, vi } from "vitest";
import { Button } from "./button";

// Sample component test: proves jsdom, Testing Library, user-event, the "@/" alias and axe all work.
describe("Button (existing shadcn button)", () => {
  it("is operable and has no axe violations", async () => {
    const onClick = vi.fn();
    const { container } = render(<Button onClick={onClick}>Save changes</Button>);
    await userEvent.click(screen.getByRole("button", { name: "Save changes" }));
    expect(onClick).toHaveBeenCalledOnce();
    expect(await axe(container)).toHaveNoViolations();
  });
});