feedback-form.test.tsx 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. import { render, screen } from "@testing-library/react";
  2. import userEvent from "@testing-library/user-event";
  3. import { afterEach, describe, expect, it, vi } from "vitest";
  4. import { FeedbackForm } from "#/components/feedback-form";
  5. describe("FeedbackForm", () => {
  6. const user = userEvent.setup();
  7. const onCloseMock = vi.fn();
  8. afterEach(() => {
  9. vi.clearAllMocks();
  10. });
  11. it("should render correctly", () => {
  12. render(<FeedbackForm polarity="positive" onClose={onCloseMock} />);
  13. screen.getByLabelText("Email");
  14. screen.getByLabelText("Private");
  15. screen.getByLabelText("Public");
  16. screen.getByRole("button", { name: "Submit" });
  17. screen.getByRole("button", { name: "Cancel" });
  18. });
  19. it("should switch between private and public permissions", async () => {
  20. render(<FeedbackForm polarity="positive" onClose={onCloseMock} />);
  21. const privateRadio = screen.getByLabelText("Private");
  22. const publicRadio = screen.getByLabelText("Public");
  23. expect(privateRadio).toBeChecked(); // private is the default value
  24. expect(publicRadio).not.toBeChecked();
  25. await user.click(publicRadio);
  26. expect(publicRadio).toBeChecked();
  27. expect(privateRadio).not.toBeChecked();
  28. await user.click(privateRadio);
  29. expect(privateRadio).toBeChecked();
  30. expect(publicRadio).not.toBeChecked();
  31. });
  32. it("should call onClose when the close button is clicked", async () => {
  33. render(<FeedbackForm polarity="positive" onClose={onCloseMock} />);
  34. await user.click(screen.getByRole("button", { name: "Cancel" }));
  35. expect(onCloseMock).toHaveBeenCalled();
  36. });
  37. });