feat: add test for the section homepage

Author: Samantha-KY

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

@@ -0,0 +1,32 @@
+import CommunityStats, { stats } from "@/components/sections/homepage/_partials/testimonials/CommunityStats";
+import "@testing-library/jest-dom";
+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 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()
+    })
+})

src/components/sections/homepage/_partials/testimonials/CommunityStats.tsx

@@ -14,7 +14,7 @@ interface Statistic {
   description: string;
   count: number;
 }
-const stats: Statistic[] = [
+export const stats: Statistic[] = [
   {
     title: "testimonials.community.stats.card-1.title",
     description: "testimonials.community.stats.card-1.description",
@@ -31,11 +31,11 @@ const stats: Statistic[] = [
     count: 6527,
   },
 ];
-export default function CommunityStats() {
+export default function CommunityStats({testId}: {testId?: string}) {
   const { t } = useTranslation();
 
   return (
-    <div className="p-7 bg-primary rounded-3.5xl mx-auto text-white relative md:absolute md:top-28 lg:top-32 xl:w-1/3 md:w-4/6 z-10 sm:max-w-sm">
+    <div data-testid={testId} className="p-7 bg-primary rounded-3.5xl mx-auto text-white relative md:absolute md:top-28 lg:top-32 xl:w-1/3 md:w-4/6 z-10 sm:max-w-sm">
       <h3 className="m-0 text-4.5xl w-3/4">{t("testimonials.community.title")}</h3>
       <div className="relative divide-y divide-white divide-dotted">
         {stats.map((stat) => (