Fix/test courses new

__mocks__/bounty.ts

@@ -0,0 +1,11 @@
+export const mockTrailer = {
+    summary: "trailer summary",
+    description: "trailer descriptio",
+    video: "trailer video",
+    duration: 4,
+    info: {
+      items: ["item 1", "item 2"],
+      title: "info title",
+    },
+  };
+

__mocks__/course.ts

@@ -0,0 +1,134 @@
+import { Course, Format, LearningModule, Material } from "@/types/course";
+import { mockTrailer } from "./bounty";
+
+
+export const Introduction = {
+  text: "course intro",
+};
+
+export const mockCertificateData = {
+  narrative: "course certificate",
+  icon: "certificate icon",
+};
+
+export const Rubric = {
+  id: "id",
+  ref: "rubric references",
+  created_at: "Wednesday",
+  updated_at: "Thursday",
+  challenge: "Challenge",
+  text: "Challenge text",
+  type: "challenge type",
+  order: 89,
+  points: 90,
+  timestamp: 73,
+  typeSlug: "slug",
+};
+
+export const mockRatingCriteria = {
+  name: "rating criteria",
+  order: 4,
+  rubric: [Rubric],
+  maxPoints: 78,
+};
+
+enum MaterialType {
+  ADDITIONAL = "ADDITIONAL",
+  MARKDOWN = "MARKDOWN",
+  TEXT = "TEXT",
+  ARTICLE = "ARTICLE",
+  "EMBEDDED-VIDEO" = "EMBEDDED-VIDEO",
+}
+export const mockMaterial: Material = {
+  duration: 3,
+  subtitle: "material subtitle",
+  link: "material link",
+  description: "material description",
+  title: "material title",
+  type: MaterialType.ADDITIONAL,
+  list: [{ link: "Link 1" }],
+};
+
+export const InteractiveModule = {
+  ref: "interactive module ref",
+  title: "interactive module title",
+  text: "interative text",
+  closing: {
+    text: "closing",
+    title: "title",
+  },
+  items: [
+    {
+      text: "text",
+      title: "title",
+      options: {
+        text: "text",
+        isCorrect: true,
+      },
+      question: {
+        title: "question title",
+        answers: ["answer 1", "answer 2"],
+        correct: 2,
+      },
+    },
+  ],
+};
+
+export const mockLearningModule: LearningModule = {
+  id: "learningModule id",
+  ref: "learning module reference",
+  created_at: new Date("2022-05-01T12:00:00Z"),
+  updated_at: new Date("2022-05-01T12:00:00Z"),
+  duration: 4,
+  description: "learning module description",
+  objectives: ["objective 1, objective 2"],
+  title: "learning module title",
+  community: "learning module community",
+  materials: [mockMaterial],
+  timestamp: 3,
+  order: 4,
+  course: "Learning module course",
+  interactiveModules: [InteractiveModule],
+};
+
+export const mockCourse: Course = {
+  id: "course",
+  ref: "course ref",
+  created_at: new Date("2022-05-01T12:00:00Z"),
+  updated_at: new Date("2022-05-01T12:00:00Z"),
+  duration: 3,
+  summary: "Course description",
+  level: 3,
+  name: "course name",
+  description: "Course description",
+  objectives: ["course description", "course objectives"],
+  locale: "English",
+  community: "community",
+  slug: "course description slug",
+  introduction: Introduction,
+  active: true,
+  certificateIcon: "certificate",
+  certificateData: mockCertificateData,
+  timestamp: 0,
+  learningModules: [mockLearningModule],
+  trailer: mockTrailer,
+  disclaimer: "Course",
+  items: ["item 1", "item 2"],
+  faq: [
+    {
+      description: "faq description",
+      title: "faq title",
+    },
+  ],
+  prerequisite: {
+    items: ["item 1", "item 2"],
+    hint: "prerequisite hint",
+  },
+  translations: []
+};
+
+export const mockFormat: Format = {
+  githubLink: true,
+  text: true,
+  disclaimer: true,
+};

__mocks__/provider/ReduxProvider.tsx

@@ -0,0 +1,11 @@
+import { wrapper } from "@/store";
+import { ReactNode } from "react";
+import { Provider } from "react-redux";
+
+const ReduxProvider = ({ children }: { children: ReactNode }) => {
+  const { store } = wrapper.useWrappedStore(children);
+
+  return <Provider store={store}>{children}</Provider>;
+};
+
+export default ReduxProvider;

__tests__/components/sections/courses/CommunityNavigation.test.tsx

@@ -0,0 +1,43 @@
+import "@testing-library/jest-dom";
+import CommunityNavigation from "@/components/sections/courses/CommunityNavigation";
+import { render, screen } from "@testing-library/react";
+import ChevronRightIcon from "@/icons/chevron-right.svg";
+import ReduxProvider from "../../../../__mocks__/provider/ReduxProvider";
+import Link from "next/link";
+
+
+jest.mock("next/router", () => ({
+  useRouter: () => ({
+    push: jest.fn(),
+    isFallback: false,
+  }),
+}));
+
+
+const RenderCommunityNavigation = () => {
+  render(
+    <ReduxProvider>
+      <CommunityNavigation />
+    </ReduxProvider>
+  );
+  return screen.getByTestId("communityNavigationShow");
+}
+
+describe("CommunityNavigation", () => {
+  it("should render the Learning Modules", () => {
+    const communityNavigation = RenderCommunityNavigation();
+    expect(communityNavigation).toBeInTheDocument();
+  });
+});
+
+it("should render the Chevron Right Icon", () => {
+  render( <ChevronRightIcon /> );
+  const communityNavigationChevIcon = screen.getByTestId("communityNavId");
+  expect(communityNavigationChevIcon).toBeInTheDocument();
+});
+
+it("should render the Link", () => {
+  render( <Link href={""} >link</Link> );
+  const communityNavigationLink = screen.getByTestId("communityNavLink");
+  expect(communityNavigationLink).toBeInTheDocument();
+});

__tests__/components/sections/courses/MobileNav.test.tsx

@@ -0,0 +1,42 @@
+import "@testing-library/jest-dom";
+import MobileNav from "@/components/sections/courses/MobileNav";
+import { render, screen } from "@testing-library/react";
+import ReduxProvider from "../../../../__mocks__/provider/ReduxProvider";
+import ChevronBottomIcon from "@/icons/chevron-bottom.svg";
+import Navigation from "@/components/sections/courses/Navigation";
+
+
+jest.mock("next/router", () => ({
+  useRouter: () => ({
+    push: jest.fn(),
+    isFallback: false,
+  }),
+}));
+
+const RenderMobileNav = () => {
+  render(
+    <ReduxProvider>
+      <MobileNav />
+    </ReduxProvider>
+  );
+  return screen.getByTestId("mobile-nav-show");
+}
+
+describe("MobileNav", () => {
+  it("should render the Mobile Nav", () => {
+    const mobileNav = RenderMobileNav();
+    expect(mobileNav).toBeInTheDocument();
+  });
+});
+
+it("should render the Chevron Bottom Icon Component", () => {
+  render( <ChevronBottomIcon /> );
+  const mobileNavChevIcon = screen.getByTestId("mobileNavChevIconId");
+  expect(mobileNavChevIcon).toBeInTheDocument();
+});
+
+it("should render the Component", () => {
+  render( <Navigation /> );
+  const mobileNavNav = screen.getByTestId("navId");
+  expect(mobileNavNav).toBeInTheDocument();
+});

__tests__/components/sections/courses/Navigation.test.tsx

@@ -0,0 +1,12 @@
+import "@testing-library/jest-dom";
+import Navigation from "@/components/sections/courses/Navigation";
+import { render, screen } from "@testing-library/react";
+
+
+describe("LearningModules", () => {
+  it("should render the Navidation component", () => {
+    render( <Navigation />);
+    const navigation = screen.getByTestId("navigation-show");
+    expect(navigation).toBeInTheDocument();
+  });
+});

__tests__/components/sections/courses/Overview/Challenge.test.tsx

@@ -0,0 +1,30 @@
+import "@testing-library/jest-dom";
+import Challenge from "@/components/sections/courses/overview/Challenge";
+import { render, screen } from "@testing-library/react";
+import { mockCourse } from "../../../../../__mocks__/course";
+
+
+
+describe("Challenge", () => {
+  it("should render the Challenge", () => {
+    render(<Challenge />);
+    const challenge = screen.getByTestId("challengeDescriptionId");;
+    expect(challenge).toBeInTheDocument();
+  });
+
+  it("should show content", () => {
+    const challengeDescription = screen.getByTestId("challengeDescription");
+    expect(challengeDescription).toBeInTheDocument();
+  });
+
+  it("should show text content", () => {
+    const challengeText = screen.getByTestId("challengeDescription");
+    expect(challengeText).toBeInTheDocument();
+    expect(challengeText).toBe( mockCourse.challenge?.description);
+  });
+
+
+
+});
+
+

__tests__/components/sections/courses/Overview/Description.test.tsx

@@ -0,0 +1,11 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import Description from "@/components/sections/courses/overview/Description";
+
+
+it("should render the Description", () => {
+  render( <Description />);
+  const description = screen.getByTestId("descriptionId");;
+  expect(description).toBeInTheDocument();
+});
+

__tests__/components/sections/courses/Overview/Disclaimer.test.tsx

@@ -0,0 +1,15 @@
+import "@testing-library/jest-dom";
+import Disclaimer from "@/components/sections/courses/overview/Disclaimer";
+import { render, screen } from "@testing-library/react";
+
+
+  it("should render the Disclaimer", () => {
+    render(  <Disclaimer />);
+    const disclaimerComponent = screen.getByTestId("disclaimerId");;
+    expect(disclaimerComponent).toBeInTheDocument();
+  });
+
+  it("should show disclaimer HTML", () => {
+    const courseDisclaimer = screen.getByTestId("disclaimerSpanId");
+    expect(courseDisclaimer).toBeInTheDocument();
+  });

__tests__/components/sections/courses/Overview/LearningModules.test.tsx

@@ -0,0 +1,30 @@
+import "@testing-library/jest-dom";
+import LearningModules from "@/components/sections/courses/overview/LearningModules";
+import LearningModulesCard from "@/components/cards/Learning";
+import { render, screen } from "@testing-library/react";
+import { mockCourse } from "../../../../../__mocks__/course";
+import { LearningModule } from "@/types/course";
+
+interface LearningModuleProps {
+  key: number;
+  learningModule: LearningModule[];
+}
+
+const RenderLearningModule = (props?: LearningModuleProps) => {
+  render(<LearningModulesCard {...props} key={1} learningModule={[mockCourse.learningModules]}/>);
+  return screen.getByTestId("learningModulesCardId");
+};
+
+describe("LearningModules", () => {
+  it("should render the Learning Modules", () => {
+    render(<LearningModules />);
+    const learningModules = screen.getByTestId("learningModulesId");
+    expect(learningModules).toBeInTheDocument();
+    expect(learningModules).toHaveTextContent("0");
+  });
+
+  it("should show Learning Modules List", () => {
+      const learningModulesCard = RenderLearningModule();
+      expect(learningModulesCard).toBeInTheDocument();
+  });
+});

__tests__/components/sections/courses/Overview/Objectives.test.tsx

@@ -0,0 +1,30 @@
+import "@testing-library/jest-dom";
+import Objectives from "@/components/sections/courses/overview/Objectives";
+import ObjectiveList from "@/components/sections/courses/overview/Objectives";
+import { render, screen } from "@testing-library/react";
+import { mockCourse } from "../../../../../__mocks__/course";
+
+interface ObjectiveListProps {
+  objectives: [];
+}
+
+
+const RenderObjectiveList = (props?: ObjectiveListProps) => {
+  render(<ObjectiveList {...props} objectives={mockCourse.objectives}/>);
+  return screen.getByTestId("objectivesListShow");
+};
+
+
+describe("Objectives", () => {
+
+  it("should render the Objectives", () => {
+    render(<Objectives/>)
+    const objectives = screen.getByTestId("objectivesShow");
+    expect(objectives).toBeInTheDocument();
+  });
+
+  it("should show Objective List", () => {
+    const objectivesList = RenderObjectiveList();
+    expect(objectivesList).toBeInTheDocument();
+  });
+});