feat: add test for the testimonials component

Author: Samantha-KY

__tests__/components/sections/homepage/Communities.test.tsx

@@ -10,7 +10,7 @@ jest.mock("next/router", () => ({
 
 describe("Communities Section", () => {
   it("should render community section", () => {
-    renderWithRedux(<CommunitiesSection communities={[community]} testId="communitiesSectionId" />);
+    renderWithRedux(<CommunitiesSection communities={[community]} />);
     expect(screen.getByTestId("communitiesSectionId")).toBeInTheDocument();
     [community].forEach((community) => {
       expect(screen.getByText(community.name)).toBeInTheDocument();

__tests__/components/sections/homepage/Main.test.tsx

@@ -15,7 +15,7 @@ describe("Main Section", () => {
   });
 
   it("should display cards", () => {
-    renderWithRedux(<MainSection testId="mainSectionId" />);
+    renderWithRedux(<MainSection />);
     cards.forEach((card) => {
       expect(screen.getByText(card.title)).toBeInTheDocument();
       expect(screen.getByText(card.body)).toBeInTheDocument();

__tests__/components/sections/homepage/OpenSource.test.tsx

@@ -4,11 +4,11 @@ import { renderWithRedux } from "../../../../__mocks__/renderWithRedux";
 import OpenSource from "@/components/sections/homepage/OpenSource";
 
 describe("OpenSource", () => {
-    it("should render Open Source", () => {
-        renderWithRedux(<OpenSource testId="openSourceId"/>)
-        expect(screen.getByTestId("openSourceId")).toBeInTheDocument()
-        expect(screen.getByRole("link")).toBeInTheDocument()
-        expect(screen.getByRole("link").hasAttribute("href")).toBeTruthy()
-        expect(screen.getByRole("link").getAttribute("href")).toBe("https://github.com/dacadeorg/dacade-frontend-app")
-    })
-  });
+  it("should render Open Source", () => {
+    renderWithRedux(<OpenSource />);
+    expect(screen.getByTestId("openSourceId")).toBeInTheDocument();
+    expect(screen.getByRole("link")).toBeInTheDocument();
+    expect(screen.getByRole("link").hasAttribute("href")).toBeTruthy();
+    expect(screen.getByRole("link").getAttribute("href")).toBe("https://github.com/dacadeorg/dacade-frontend-app");
+  });
+});

__tests__/components/sections/homepage/Testimonials.test.tsx

@@ -3,27 +3,13 @@ import { screen } from "@testing-library/react";
 import TestimonialsSection from "@/components/sections/homepage/Testimonials";
 import { renderWithRedux } from "../../../../__mocks__/renderWithRedux";
 
-describe("Testimonials Section", () => {
-  const testimonials = [
-    {
-      icon: "/assets/img/testimonials/CED.jpg",
-      content:
-        "Dacade helped me to meet people on the same blockchain journey as me and gives access to cool mentors! I like that it rewards you for challenges and helping others.",
-    },
-    {
-      icon: "/assets/img/testimonials/alex.jpg",
-      content: "Testimonials text",
-    },
-  ];
-
-  it("should render testimonials with correct content", () => {
-    renderWithRedux(<TestimonialsSection testId="testimonialsId"/>);
-    const testimonial = screen.getByTestId("testimonialsId");
-    expect(testimonial).toBeInTheDocument();
-
-    testimonials.forEach((testimonial) => {
-      expect(screen.getByAltText(testimonial.icon)).toBeInTheDocument();
-      expect(screen.getByText(testimonial.content)).toBeInTheDocument();
-    });
+describe("TestimonialsSection", () => {
+  it("should render TestimonialsSection with child components", () => {
+    renderWithRedux(<TestimonialsSection />);
+    expect(screen.getByTestId("testimonialsSectionId")).toBeInTheDocument();
+    expect(screen.getByTestId("communityStatsId")).toBeInTheDocument();
+    expect(screen.getByTestId("testimonialsId")).toBeInTheDocument();
+    expect(screen.getByTestId("openSourceId")).toBeInTheDocument();
+    expect(screen.getByTestId("section")).toBeInTheDocument();
   });
 });

__tests__/components/sections/homepage/_partials/CommunityStats.test.tsx

@@ -4,29 +4,29 @@ import { screen } from "@testing-library/react";
 import { renderWithRedux } from "../../../../../__mocks__/renderWithRedux";
 
 describe("CommunityStats", () => {
-    it("should render Community stats", () => {
-        renderWithRedux(<CommunityStats testId="communityStatsId"/>)
-        const communityStat = screen.getByTestId("communityStatsId")
-        expect(communityStat).toBeInTheDocument()
-    })
+  it("should render Community stats", () => {
+    renderWithRedux(<CommunityStats />);
+    const communityStat = screen.getByTestId("communityStatsId");
+    expect(communityStat).toBeInTheDocument();
+  });
 
-    it("should display the stats", () => {
-        renderWithRedux(<CommunityStats/>)
-        stats.forEach((stat) => {
-            expect(screen.getByText(stat.count)).toBeInTheDocument()
-            expect(screen.getByText(stat.count).textContent).toBe((stat.count).toString())
-            expect(screen.getByText(stat.title)).toBeInTheDocument()
-            expect(screen.getByText(stat.title).textContent).toBe((stat.title).toString())
-            expect(screen.getByText(stat.description)).toBeInTheDocument()
-            expect(screen.getByText(stat.description).textContent).toBe((stat.title + (" ") + stat.description).toString())
-        })
-    })
+  it("should display the stats", () => {
+    renderWithRedux(<CommunityStats />);
+    stats.forEach((stat) => {
+      expect(screen.getByText(stat.count)).toBeInTheDocument();
+      expect(screen.getByText(stat.count).textContent).toBe(stat.count.toString());
+      expect(screen.getByText(stat.title)).toBeInTheDocument();
+      expect(screen.getByText(stat.title).textContent).toBe(stat.title.toString());
+      expect(screen.getByText(stat.description)).toBeInTheDocument();
+      expect(screen.getByText(stat.description).textContent).toBe((stat.title + " " + stat.description).toString());
+    });
+  });
 
-    it("should display the anchor tag with button", () => {
-        renderWithRedux(<CommunityStats/>)
-        expect(screen.getByRole("link")).toHaveAttribute("href");
-        expect(screen.getByRole("link").getAttribute("href")).toBe("https://discord.gg/U38KQHDtHe");
-        expect(screen.getByRole("button")).toBeInTheDocument()
-        expect(screen.getByText("testimonials.community.join")).toBeInTheDocument()
-    })
-})
+  it("should display the anchor tag with button", () => {
+    renderWithRedux(<CommunityStats />);
+    expect(screen.getByRole("link")).toHaveAttribute("href");
+    expect(screen.getByRole("link").getAttribute("href")).toBe("https://discord.gg/U38KQHDtHe");
+    expect(screen.getByRole("button")).toBeInTheDocument();
+    expect(screen.getByText("testimonials.community.join")).toBeInTheDocument();
+  });
+});

__tests__/components/sections/homepage/_partials/Stories.test.tsx

@@ -10,7 +10,7 @@ export const fixtureTestimonials = {
 
 describe("Stories", () => {
   it("should display the stories", () => {
-    render(<TestimonialsSection testId="testimonialsId" list={[fixtureTestimonials]} />);
+    render(<TestimonialsSection list={[fixtureTestimonials]} />);
     expect(screen.getByTestId("testimonialsId")).toBeInTheDocument();
     const mockGrid = _.chunk([fixtureTestimonials], 5);
     mockGrid.forEach((grid) => {

src/components/sections/homepage/Communities.tsx

@@ -18,7 +18,7 @@ import { Community } from "@/types/community";
  * @returns {ReactElement}
  */
 
-export default function CommunitiesSection({ communities, testId }: { communities: Community[], testId?: string }): ReactElement {
+export default function CommunitiesSection({ communities, testId = "communitiesSectionId" }: { communities: Community[]; testId?: string }): ReactElement {
   const { t } = useTranslation();
 
   return (

src/components/sections/homepage/Main.tsx

@@ -34,7 +34,7 @@ export const cards: { title: string; body: string }[] = [
  * @export
  * @returns {ReactElement}
  */
-export default function MainSection({testId}: {testId?: string}): ReactElement {
+export default function MainSection({ testId = "mainSectionId" }: { testId?: string }): ReactElement {
   const { t } = useTranslation();
 
   return (

src/components/sections/homepage/OpenSource.tsx

@@ -10,7 +10,7 @@ import { useTranslation } from "next-i18next";
  * @returns {ReactElement}
  */
 
-export default function OpenSource({testId}: {testId?: string}) {
+export default function OpenSource({ testId = "openSourceId" }: { testId?: string }) {
   const { t } = useTranslation();
   return (
     <div data-testid={testId} className="text-4xl lg:text-5xl pt-24 flex flex-col text-wrap space-y-2">

src/components/sections/homepage/Testimonials.tsx

@@ -75,7 +75,7 @@ const stories = (t: TFunction<"translation", undefined, "translation">): Testimo
   ];
 };
 
-export default function TestimonialsSection({testId}: {testId?: string}): ReactElement {
+export default function TestimonialsSection({testId="testimonialsSectionId"}: {testId?: string}): ReactElement {
   const { t } = useTranslation();
   return (
     <div data-testid={testId}>