chore: finished tests

test/Badge.test.tsx

@@ -2,13 +2,18 @@ import { describe, expect, it } from "vitest";
 import { screen, render } from "@testing-library/react";
 import Badge from "../components/Badge";
 
-describe("Badge Component Test", () => {
-  it("Should be rendered on the screen", () => {
+// Tests to know if The Badge component exist in user profile
+describe("Traits Badge Component Test", () => {
+  // Felipe de Jesús González Acosta A01275536 - Test #9/10
+  // Test know if the component renders itself correctly
+  it("Should be rendered on the profile screen", () => {
     render(<Badge text="" />);
     expect(screen.getByTestId("badge-component")).toBeInTheDocument();
   });
-  it("Should render the text prop", () => {
-    render(<Badge text="Hello World" />);
-    expect(screen.getByText("Hello World")).toBeInTheDocument();
+  // Felipe de Jesús González Acosta A01275536 - Test #10/10
+  // Test know if the component renders the text correctly
+  it("Should render the text prop in badge", () => {
+    render(<Badge text="Trait 1" />);
+    expect(screen.getByText("Trait 1")).toBeInTheDocument();
   });
 });

test/RulerSurvey.test.tsx

@@ -1,109 +1,55 @@
-import RulerStepOne from "@/components/modals/ruler/RulerStepOne";
-import RulerStepTwo from "@/components/modals/ruler/RulerStepTwo";
-import { Emotion, RulerSurveyAnswer } from "@/types/types";
-import { fireEvent, render, screen } from "@testing-library/react";
+import RulerSurvey from "@/components/modals/ruler/RulerSurvey";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { render, screen } from "@testing-library/react";
 import { Mock, describe, expect, it, vi } from "vitest";
+// Mock user test
+vi.mock("@/services/user", () => {
+  return {
+    getUserId: vi.fn().mockResolvedValue("prueba"),
+  };
+});
+
+// Mock ruler survey
+vi.mock("@/services/rulerSurvey", () => {
+  return {
+    submitRulerSurveyAnswer: vi.fn(),
+  };
+});
 
-const randomEmotion = {
-  row: Math.floor(Math.random() * 12),
-  col: Math.floor(Math.random() * 12),
-};
+// Mock next navigation
+vi.mock("next/navigation", () => {
+  return {
+    useRouter: vi.fn().mockReturnValue({
+      refresh: vi.fn(),
+    }),
+  };
+});
+
+const mockSet = vi.fn();
+
+vi.mock("", () => {
+  return {
+    setState: mockSet,
+  };
+});
 
-const emotionBgColor = (emotion: Emotion) => {
-  if (emotion.pleasantness < 0 && emotion.energy < 0) return "bg-blue-400";
-  else if (emotion.pleasantness < 0 && emotion.energy > 0) return "bg-red-400";
-  else if (emotion.pleasantness > 0 && emotion.energy < 0)
-    return "bg-green-400";
-  else return "bg-yellow-400";
-};
+const queryClient = new QueryClient();
+let mockClose: Mock;
 
-let setMockEmotion: Mock, nextStepMock: Mock, rulerEmotion: RulerSurveyAnswer;
-let mockClose: Mock, mockPreviousStep: Mock, mockSetComment: Mock;
+// Test for Ruler Survey
 describe("RulerSurvey Component Test", () => {
   beforeEach(() => {
-    setMockEmotion = vi.fn();
-    nextStepMock = vi.fn();
-    rulerEmotion = {
-      userId: "prueba",
-      emotion: {
-        name: "",
-        pleasantness: 2,
-        description: "",
-        energy: 2,
-        id: 1,
-      },
-      comment: "",
-    };
     mockClose = vi.fn();
-    mockPreviousStep = vi.fn();
-    mockSetComment = vi.fn();
-  });
-  it("Should render step one", () => {
-    render(
-      <RulerStepOne
-        setEmotion={setMockEmotion}
-        rulerSurveyAnswer={rulerEmotion}
-        nextStep={nextStepMock}
-      />,
-    );
-
-    expect(screen.getByTestId("ruler-step-one")).toBeInTheDocument();
-  });
-  it("Should get an emotion", () => {
-    render(
-      <RulerStepOne
-        setEmotion={setMockEmotion}
-        rulerSurveyAnswer={rulerEmotion}
-        nextStep={nextStepMock}
-      />,
-    );
-
-    const emotion = screen.getByTestId(
-      `emotion-${randomEmotion.row}-${randomEmotion.col}`,
-    );
-    fireEvent.mouseEnter(emotion);
-    expect(emotion).toHaveClass("scale-150");
-    fireEvent.mouseLeave(emotion);
-    expect(emotion).not.toHaveClass("scale-150");
-  });
-  it("Should have the right color", () => {
-    render(
-      <RulerStepOne
-        setEmotion={setMockEmotion}
-        rulerSurveyAnswer={rulerEmotion}
-        nextStep={nextStepMock}
-      />,
-    );
-    const emotion = screen.getByTitle(
-      `emotion-${rulerEmotion.emotion?.energy}-${rulerEmotion.emotion?.pleasantness}`,
-    );
-    expect(emotion).toHaveClass(
-      emotionBgColor(rulerEmotion.emotion as Emotion),
-    );
-  });
-  it("Should set an emotion", () => {
-    render(
-      <RulerStepOne
-        setEmotion={setMockEmotion}
-        rulerSurveyAnswer={rulerEmotion}
-        nextStep={nextStepMock}
-      />,
-    );
-    const emotion = screen.getByTestId(
-      `emotion-${randomEmotion.row}-${randomEmotion.col}`,
-    );
-    fireEvent.click(emotion);
-    expect(setMockEmotion).toHaveBeenCalledTimes(1);
   });
-  it("Should render step two", () => {
+  // Felipe de Jesús González Acosta A01275536 - Test #3/10
+  // Verify that the ruler component renders itself
+  it("Should render the survey", () => {
     render(
-      <RulerStepTwo
-        rulerSurveyAnswer={rulerEmotion}
-        onClose={mockClose}
-        previousStep={mockPreviousStep}
-        setComment={mockSetComment}
-      />,
+      <QueryClientProvider client={queryClient}>
+        <RulerSurvey showModal={true} onClose={mockClose} />
+      </QueryClientProvider>,
     );
-    expect(screen.getByTestId("ruler-step-two")).toBeInTheDocument();
+    const rulerSurvey = screen.getByTestId("ruler-survey");
+    expect(rulerSurvey).toBeInTheDocument();
   });
 });

test/SprintSurveyStepOne.test.tsx

@@ -0,0 +1,84 @@
+import SprintStepOne from "@/components/modals/SprintStepOne";
+import { Questions, SprintSurveyAnswer } from "@/types/types";
+import { fireEvent, render, screen, within } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+// Mock existing questions
+const mockQuestions: Questions[] = [
+  {
+    id: 1,
+    description: "Test Question 1",
+    type: "SPRINT_QUESTION",
+  },
+  {
+    id: 2,
+    description: "Test Question 2",
+    type: "SPRINT_QUESTION",
+  },
+];
+
+const setSprintSurveyAnswer = vi.fn();
+// Mochk a sprint survey answer
+const mockSprintAnswer: SprintSurveyAnswer = {
+  userId: "1",
+  sprintSurveyId: 2,
+  projectAnswers: [],
+  coworkersAnswers: [],
+  commentId: 0,
+  coworkersComments: [],
+};
+
+// Start the tests for the first part of the sprint survey
+describe("SprintSurveyStepOne", () => {
+  // Felipe de Jesús González Acosta A01275536 - Test #4/10
+  // Test know if the component renders itself
+  it("should render", () => {
+    render(
+      <SprintStepOne
+        questions={mockQuestions}
+        setSprintSurveyAnswer={setSprintSurveyAnswer}
+        sprintSurveyAnswer={mockSprintAnswer}
+      />,
+    );
+
+    const sprinStepOne = screen.getByTestId("sprint-step-one");
+    expect(sprinStepOne).toBeInTheDocument();
+  });
+
+  // Felipe de Jesús González Acosta A01275536 - Test #5/10
+  // Test know if the component renders the sliders of the questions
+  it("should render sliders", () => {
+    render(
+      <SprintStepOne
+        questions={mockQuestions}
+        setSprintSurveyAnswer={setSprintSurveyAnswer}
+        sprintSurveyAnswer={mockSprintAnswer}
+      />,
+    );
+
+    const sliders = screen.getAllByTestId(/slider-/);
+    expect(sliders).toHaveLength(mockQuestions.length);
+    sliders.forEach((slider, index) => {
+      expect(slider).toHaveTextContent(mockQuestions[index].description);
+    });
+  });
+
+  // Felipe de Jesús González Acosta A01275536 - Test #6/10
+  // Test know if the sliders execute their onChange function to declare the answer value
+  it("should trigger onChange", () => {
+    render(
+      <SprintStepOne
+        questions={mockQuestions}
+        setSprintSurveyAnswer={setSprintSurveyAnswer}
+        sprintSurveyAnswer={mockSprintAnswer}
+      />,
+    );
+    mockQuestions.forEach((question) => {
+      const slider = screen.getByTestId(`slider-${question.id}`);
+      fireEvent.change(within(slider).getByTestId("input-slider"), {
+        target: { value: 2 },
+      });
+    });
+    expect(setSprintSurveyAnswer).toHaveBeenCalledTimes(mockQuestions.length);
+  });
+});

test/SprintSurveyStepTwo.test.tsx

@@ -0,0 +1,100 @@
+import SelectableDragUsers from "@/components/modals/SelectableDragUsers";
+import SprintStepTwo from "@/components/modals/SprintStepTwo";
+import { Questions, SurveyCoworker, SurveyStepTwoAnswer } from "@/types/types";
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+// Mock some questions
+const mockQuestions: Questions[] = [
+  {
+    id: 1,
+    description: "Test Question 1",
+    type: "SPRINT_QUESTION",
+  },
+  {
+    id: 2,
+    description: "Test Question 2",
+    type: "SPRINT_QUESTION",
+  },
+];
+
+// Mock the front end library needed
+vi.mock("@dnd-kit/core", () => {
+  return {
+    useDraggable: vi.fn(() => ({
+      attributes: {},
+      transform: { x: 0, y: 0 },
+      setNodeRef: vi.fn(),
+      listeners: {},
+      isDragging: false,
+    })),
+    useDroppable: vi.fn(() => ({
+      isOver: false,
+    })),
+    DndContext: vi.fn(({ children }) => children),
+    pointerWithin: vi.fn(() => true),
+  };
+});
+
+const mockSetSprintSurveyStepTwoAnswer = vi.fn();
+const mockSprintStepTwo: SurveyStepTwoAnswer = mockQuestions.reduce(
+  (acc, question) => {
+    acc[question.id] = Array(10)
+      .fill([])
+      .map(() => []);
+    return acc;
+  },
+  {} as SurveyStepTwoAnswer,
+);
+
+// Mock users
+const users = [
+  {
+    userId: "1",
+    name: "Test User",
+    photoUrl: "https://test.com",
+  },
+  {
+    userId: "2",
+    name: "Test User 2",
+    photoUrl: "https://test.com",
+  },
+  {
+    userId: "3",
+    name: "Test User 3",
+    photoUrl: "https://test.com",
+  },
+];
+
+// Mock react framework
+vi.mock("react", () => {
+  return {
+    useState: vi.fn((initial) => [initial, mockSetSprintSurveyStepTwoAnswer]),
+    useEffect: vi.fn(),
+  };
+});
+
+// Tests for the second part of the Sprint Survey
+describe("Should render SprintSurveyStepTwo", () => {
+  // Felipe de Jesús González Acosta A01275536 - Test #7/10
+  // Test that the component of the survey renders itself
+  it("Should render SprintSurveyStepTwo", () => {
+    render(
+      <SprintStepTwo
+        users={users}
+        setSprintSurveyStepTwoAnswer={mockSetSprintSurveyStepTwoAnswer}
+        sprintSurveyStepTwoAnswer={mockSprintStepTwo}
+        questions={mockQuestions}
+      />,
+    );
+    const sprintStepTwo = screen.getByTestId("sprint-step-two");
+    expect(sprintStepTwo).toBeInTheDocument();
+  });
+  // Felipe de Jesús González Acosta A01275536 - Test #8/10
+  // Test that the users exist of the survey renders itself
+  it("Should render SelectableDragUsers, and all users", () => {
+    render(<SelectableDragUsers users={users as SurveyCoworker[]} />);
+    const selectableDragUsers = screen.getByTestId("selectable-drag-users");
+    expect(selectableDragUsers).toBeInTheDocument();
+  });
+});