Merge branch 'develop' into PAV-51-fix-api-connection-issue

Author: Benevanio

frontend/tests/unit/components/login/RegisterSide.test.tsx

@@ -1,46 +1,42 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-
+import "@testing-library/jest-dom/vitest";
 import { fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { beforeEach, describe, expect, it, vi } from "vitest";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import RegisterSide from "@/components/login/RegisterSide";
 
-// =====================
-// MOCKS
-// =====================
 const mockRegister = vi.fn();
+const mockApiPost = vi.fn();
+const mockApiGet = vi.fn();
 
 vi.mock("@/services/authService", () => ({
   register: (...args: any[]) => mockRegister(...args),
 }));
-/* eslint-disable @typescript-eslint/no-unused-vars */
-import { fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { beforeEach, describe, expect, it, vi } from "vitest";
-import "@testing-library/jest-dom/vitest";
+
+vi.mock("@/services/api", () => ({
+  api: {
+    post: (...args: any[]) => mockApiPost(...args),
+    get: (...args: any[]) => mockApiGet(...args),
+  },
+}));
 
 vi.mock("@unpic/react", () => ({
   Image: (props: any) => <img {...props} alt={props.alt} />,
 }));
 
 vi.mock("framer-motion", () => ({
   motion: {
-    div: ({ children, ...props }: any) => <div {...props}>{children}</div>,
-    button: ({ children, ...props }: any) => (
-      <button {...props}>{children}</button>
-    ),
-    div: ({ children, whileHover, whileTap, animate, transition, ...props }: any) =>
-      <div {...props}>{children}</div>,
-    button: ({ children, whileHover, whileTap, animate, transition, ...props }: any) =>
-      <button {...props}>{children}</button>,
+    div: ({ children }: any) => <div>{children}</div>,
+    button: ({ children }: any) => <button>{children}</button>,
   },
 }));
 
 vi.mock("react-phone-number-input", () => ({
-  default: ({ value, onChange, placeholder, disabled }: any) => (
+  default: ({ value, onChange }: any) => (
     <input
       type="tel"
       value={value || ""}
       onChange={(e) => onChange(e.target.value)}
-      placeholder={placeholder}
-      disabled={disabled}
     />
   ),
 }));
@@ -49,24 +45,15 @@ vi.mock("react-router-dom", () => ({
   useNavigate: () => vi.fn(),
 }));
 
-const mockApiPost = vi.fn();
-const mockApiGet = vi.fn();
-vi.mock("@/services/api", () => ({
-  api: {
-    post: (...args: any[]) => mockApiPost(...args),
-    get: (...args: any[]) => mockApiGet(...args),
-  },
-}));
-
-import RegisterSide from "@/components/login/RegisterSide";
-
-// =====================
-// TEST SUITE
-// =====================
 describe("RegisterSide", () => {
+  let originalLocation: Location;
 
   beforeEach(() => {
     mockRegister.mockReset();
+    mockApiPost.mockClear();
+    mockApiGet.mockClear();
+
+    originalLocation = window.location;
 
     Object.defineProperty(window, "location", {
       configurable: true,
@@ -79,46 +66,31 @@ describe("RegisterSide", () => {
       configurable: true,
       value: originalLocation,
     });
-
-  beforeEach(() => {
-    mockApiPost.mockClear();
-    mockApiGet.mockClear();
   });
 
-  it("renderiza formulário e alterna visibilidade da senha", () => {
+  it("renderiza formulário e alterna senha", () => {
     render(<RegisterSide />);
 
     const passwordInput = screen.getByLabelText(/senha/i) as HTMLInputElement;
     expect(passwordInput.type).toBe("password");
 
-    const toggleButtons = screen.getAllByRole("button");
-    fireEvent.click(toggleButtons[0]);
+    fireEvent.click(screen.getAllByRole("button")[0]);
 
     expect(screen.getByLabelText(/senha/i)).toHaveAttribute("type", "text");
   });
 
-  it("mostra erros obrigatórios quando submit vazio", async () => {
+  it("mostra erros obrigatórios", async () => {
     render(<RegisterSide />);
 
     fireEvent.click(screen.getByRole("button", { name: /cadastrar/i }));
 
-    expect(
-      await screen.findByText(/campo de nome.*obrigatório/i)
-    ).toBeInTheDocument();
-    expect(
-      await screen.findByText(/campo de e-mail.*obrigatório/i)
-    ).toBeInTheDocument();
-    expect(
-      await screen.findByText(/campo de telefone.*obrigatório/i)
-    ).toBeInTheDocument();
-    expect(
-      await screen.findByText(/campo de senha.*obrigatório/i)
-    ).toBeInTheDocument();
-    // CPF é campo opcional — não dispara erro de obrigatório
+    expect(await screen.findByText(/nome.*obrigatório/i)).toBeInTheDocument();
+    expect(await screen.findByText(/e-mail.*obrigatório/i)).toBeInTheDocument();
+    expect(await screen.findByText(/telefone.*obrigatório/i)).toBeInTheDocument();
+    expect(await screen.findByText(/senha.*obrigatório/i)).toBeInTheDocument();
   });
 
-
-  it("valida CPF quando preenchido incorretamente", async () => {
+  it("valida CPF inválido", async () => {
     render(<RegisterSide />);
 
     fireEvent.change(screen.getByLabelText(/nome/i), {
@@ -143,11 +115,10 @@ describe("RegisterSide", () => {
 
     fireEvent.click(screen.getByRole("button", { name: /cadastrar/i }));
 
-    // Componente exibe: "CPF inválido. Deve conter 11 dígitos."
     expect(await screen.findByText(/cpf inv[aá]lido/i)).toBeInTheDocument();
   });
 
-  it("envia formulário válido com CPF opcional", async () => {
+  it("envia formulário válido", async () => {
     mockRegister.mockResolvedValueOnce({
       message: "Usuário criado",
       user: { id: 1 },
@@ -178,7 +149,7 @@ describe("RegisterSide", () => {
     });
   });
 
-  it("exibe erro quando API falha", async () => {
+  it("exibe erro da API", async () => {
     mockRegister.mockRejectedValueOnce(new Error("Email já cadastrado"));
 
     render(<RegisterSide />);
@@ -201,9 +172,7 @@ describe("RegisterSide", () => {
 
     fireEvent.click(screen.getByRole("button", { name: /cadastrar/i }));
 
-    expect(
-      await screen.findByText(/email já cadastrado/i)
-    ).toBeInTheDocument();
+    expect(await screen.findByText(/email já cadastrado/i)).toBeInTheDocument();
   });
 
   it("mostra loading durante requisição", async () => {
@@ -216,15 +185,6 @@ describe("RegisterSide", () => {
     fireEvent.change(screen.getByLabelText(/nome/i), {
       target: { value: "Bene" },
     });
-  it("formata cpf e envia submit válido", async () => {
-    mockApiPost.mockResolvedValueOnce({ data: {} });
-
-    render(<RegisterSide />);
-    fireEvent.change(screen.getByLabelText(/nome/i), { target: { value: "Bene" } });
-    fireEvent.change(screen.getByLabelText(/email/i), { target: { value: "bene@teste.com" } });
-    fireEvent.change(screen.getByLabelText(/^telefone$/i), { target: { value: "+5534999999999" } });
-    fireEvent.change(screen.getByLabelText(/senha/i), { target: { value: "123456" } });
-    fireEvent.change(screen.getByLabelText(/cpf/i), { target: { value: "12345678901" } });
 
     fireEvent.change(screen.getByLabelText(/email/i), {
       target: { value: "bene@teste.com" },
@@ -245,31 +205,59 @@ describe("RegisterSide", () => {
     ).toBeDisabled();
   });
 
+  it("envia CPF formatado corretamente", async () => {
+    mockApiPost.mockResolvedValueOnce({ data: {} });
+
+    render(<RegisterSide />);
+
+    fireEvent.change(screen.getByLabelText(/nome/i), {
+      target: { value: "Bene" },
+    });
+
+    fireEvent.change(screen.getByLabelText(/email/i), {
+      target: { value: "bene@teste.com" },
+    });
+
+    fireEvent.change(screen.getByPlaceholderText(/\(34\)/i), {
+      target: { value: "+5534999999999" },
+    });
+
+    fireEvent.change(screen.getByLabelText(/senha/i), {
+      target: { value: "123456" },
+    });
+
+    fireEvent.change(screen.getByLabelText(/cpf/i), {
+      target: { value: "12345678901" },
+    });
+
+    fireEvent.click(screen.getByRole("button", { name: /cadastrar/i }));
+
+    await waitFor(() => {
+      expect(mockApiPost).toHaveBeenCalled();
+    });
+  });
+
   it("desabilita inputs durante loading", async () => {
     mockRegister.mockImplementation(
       () => new Promise((resolve) => setTimeout(resolve, 200))
     );
 
     render(<RegisterSide />);
 
-    const nome = screen.getByLabelText(/nome/i);
-    const email = screen.getByLabelText(/email/i);
-    const senha = screen.getByLabelText(/senha/i);
+    fireEvent.change(screen.getByLabelText(/nome/i), {
+      target: { value: "Bene" },
+    });
+
+    fireEvent.change(screen.getByLabelText(/email/i), {
+      target: { value: "bene@teste.com" },
+    });
 
-    fireEvent.change(nome, { target: { value: "Bene" } });
-    fireEvent.change(email, { target: { value: "bene@teste.com" } });
-    fireEvent.change(senha, { target: { value: "123456" } });
+    fireEvent.change(screen.getByLabelText(/senha/i), {
+      target: { value: "123456" },
+    });
 
     fireEvent.change(screen.getByPlaceholderText(/\(34\)/i), {
       target: { value: "+5534999999999" },
-    await waitFor(() => {
-      expect(mockApiPost).toHaveBeenCalledWith("/auth/register", {
-        name: "Bene",
-        email: "bene@teste.com",
-        phone: "+5534999999999",
-        password: "123456",
-        cpf: "12345678901",
-      });
     });
 
     fireEvent.click(screen.getByRole("button", { name: /cadastrar/i }));
@@ -278,4 +266,4 @@ describe("RegisterSide", () => {
       await screen.findByRole("button", { name: /cadastrando/i })
     ).toBeDisabled();
   });
-});
+});