homeio

1/* @vitest-environment jsdom */
2
3import { act, fireEvent, render, screen } from "@testing-library/react";
4import { beforeEach, describe, expect, it, vi } from "vitest";
5import { LoginForm } from "@/components/auth/login-form";
6
7const replaceMock = vi.fn();
8const refreshMock = vi.fn();
9const getSearchParamMock = vi.fn();
10
11vi.mock("next/navigation", () => ({
12  useRouter: () => ({
13    replace: replaceMock,
14    refresh: refreshMock,
15  }),
16  useSearchParams: () => ({
17    get: getSearchParamMock,
18  }),
19}));
20
21describe("LoginForm", () => {
22  beforeEach(() => {
23    vi.useRealTimers();
24    vi.restoreAllMocks();
25    replaceMock.mockReset();
26    refreshMock.mockReset();
27    getSearchParamMock.mockReset();
28    getSearchParamMock.mockImplementation((key: string) => {
29      if (key === "next") return "/";
30      return null;
31    });
32  });
33
34  it("toggles password visibility from the eye button", () => {
35    render(<LoginForm />);
36
37    const passwordInput = screen.getByPlaceholderText("Password") as HTMLInputElement;
38    expect(passwordInput.type).toBe("password");
39
40    fireEvent.click(screen.getByRole("button", { name: "Show password" }));
41    expect(passwordInput.type).toBe("text");
42
43    fireEvent.click(screen.getByRole("button", { name: "Hide password" }));
44    expect(passwordInput.type).toBe("password");
45  });
46
47  it("shows a retry countdown on the submit button after invalid credentials", async () => {
48    vi.useFakeTimers();
49    vi.stubGlobal(
50      "fetch",
51      vi.fn().mockResolvedValue({
52        ok: false,
53        status: 401,
54        headers: new Headers(),
55        json: async () => ({ error: "Invalid username or password" }),
56      }),
57    );
58
59    render(<LoginForm />);
60
61    fireEvent.change(screen.getByPlaceholderText("Username"), {
62      target: { value: "admin" },
63    });
64    fireEvent.change(screen.getByPlaceholderText("Password"), {
65      target: { value: "wrong-password" },
66    });
67    fireEvent.click(screen.getByRole("button", { name: /sign in/i }));
68
69    await act(async () => {
70      await Promise.resolve();
71    });
72
73    expect(screen.getByText("Invalid username or password")).toBeTruthy();
74    expect(
75      (screen.getByRole("button", { name: /try again in 3s/i }) as HTMLButtonElement).disabled,
76    ).toBe(true);
77
78    await act(async () => {
79      await vi.advanceTimersByTimeAsync(1_000);
80    });
81    expect(
82      screen.getByRole("button", { name: /try again in [12]s/i }),
83    ).toBeTruthy();
84
85  });
86});
87