From 2374d0293509adb9c06ece8a11464ba3408c5ba9 Mon Sep 17 00:00:00 2001
From: Joshua Ow <joshuaow@gmail.com>
Date: Sat, 16 Mar 2024 22:16:55 -0700
Subject: [PATCH] chore: added unit test for cards sections to verify correct
 content is passed in (WEB-21)

---
 src/app/components/button/button.test.js      |  7 ----
 src/app/components/cardsSection/cards.test.js | 42 +++++++++++++++++++
 2 files changed, 42 insertions(+), 7 deletions(-)
 create mode 100644 src/app/components/cardsSection/cards.test.js

diff --git a/src/app/components/button/button.test.js b/src/app/components/button/button.test.js
index 82a7a2d..8e9dc02 100644
--- a/src/app/components/button/button.test.js
+++ b/src/app/components/button/button.test.js
@@ -1,6 +1,5 @@
 import { render, screen, fireEvent } from '@testing-library/react';
 import Button from './Button';
-import styles from './button.module.css';
 
 jest.mock('./button.module.css', () => ({
   button: 'button',
@@ -28,12 +27,6 @@ test('renders correctly with primary variant', () => {
   expect(asFragment()).toMatchSnapshot();
 });
 
-// test('has the correct class when variant is primary', () => {
-//   render(<Button buttonText='Primary Button' variant='primary' />);
-//   const buttonElement = screen.getByTestId('button-primary');
-//   expect(buttonElement).toHaveStyle('background-color: #3c3db9');
-// });
-
 test('shows icon when showIcon is true', () => {
   render(<Button buttonText='Button with Icon' showIcon />);
   const iconElement = screen.getByTestId('button-icon');
diff --git a/src/app/components/cardsSection/cards.test.js b/src/app/components/cardsSection/cards.test.js
new file mode 100644
index 0000000..1ed0160
--- /dev/null
+++ b/src/app/components/cardsSection/cards.test.js
@@ -0,0 +1,42 @@
+import { render, screen } from '@testing-library/react';
+import CardsSection from './CardsSection';
+
+describe('CardsSection', () => {
+  const labelMock = {
+    lblWorkshopsTitle: 'Workshop Title',
+    lblSupportTitle: 'Support Title',
+    lblCohortsTitle: 'Cohorts Title',
+    lblWorkshopsContent: 'Workshop Content',
+    lblSupportContent: 'Support Content',
+    lblCohortsContent: 'Cohorts Content',
+    btnTextMeetup: 'Join Meetup',
+    btnTextCommunity: 'Join Community',
+    btnTextCohort: 'Join Cohort',
+    meetupUrl: 'https://meetup.com',
+    communityUrl: 'https://community.com',
+    cohortUrl: 'https://cohort.com',
+  };
+
+  test('uses the correct href for each link', () => {
+    render(<CardsSection label={labelMock} />);
+    const meetupLink = screen.getByRole('link', { name: /join meetup/i });
+    const communityLink = screen.getByRole('link', { name: /join community/i });
+    const cohortLink = screen.getByRole('link', { name: /join cohort/i });
+    expect(meetupLink).toHaveAttribute('href', labelMock.meetupUrl);
+    expect(communityLink).toHaveAttribute('href', labelMock.communityUrl);
+    expect(cohortLink).toHaveAttribute('href', labelMock.cohortUrl);
+  });
+
+  test('passes the correct content to each card', () => {
+    render(<CardsSection label={labelMock} />);
+    expect(screen.getByText(labelMock.lblWorkshopsTitle)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.lblWorkshopsContent)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.btnTextMeetup)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.lblSupportTitle)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.lblSupportContent)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.btnTextCommunity)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.lblCohortsTitle)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.lblCohortsContent)).toBeInTheDocument();
+    expect(screen.getByText(labelMock.btnTextCohort)).toBeInTheDocument();
+  });
+});