epam-ai-conductor 0.3.0 → 0.3.2

package/dist/content/{content/module-1/tests/Button.test.tsx → module-1/tests/Button.test.js}

@@ -1,22 +1,22 @@
-import '@testing-library/jest-dom'
+import "@testing-library/jest-dom";
 import { render, fireEvent, screen } from "@testing-library/react";
-import { Button } from "../common/Button/Button";
+import { Button } from "../../common/Button";
 
-describe('Button component', () => {
-  test("Should render button with provided label", () => {
+describe("Button component", () => {
+  test("should render with provided `buttonText` prop value", () => {
     const handleClickMock = jest.fn();
-    render(<Button buttonText='Hello' handleClick={handleClickMock}/>);
+    render(<Button buttonText="Hello" handleClick={handleClickMock} />);
     const buttonElement = screen.getByText("Hello");
 
     expect(buttonElement).toBeInTheDocument();
   });
 
-  test("Should call provided callback", () => {
+  test("should call provided handleClick callback prop", () => {
     const handleClickMock = jest.fn();
-    render(<Button handleClick={handleClickMock} buttonText='Click me'/>);
+    render(<Button handleClick={handleClickMock} buttonText="Click me" />);
     const buttonElement = screen.getByText("Click me");
 
     fireEvent.click(buttonElement);
     expect(handleClickMock).toHaveBeenCalledTimes(1);
   });
-})
+});

package/dist/content/module-1/tests/CourseCard.test.js

@@ -0,0 +1,68 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import { CourseCard } from "../../components/Courses/components/CourseCard/CourseCard";
+
+describe("CourseCard component", () => {
+  const course = {
+    id: "1",
+    title: "Course Title",
+    description: "Course Description",
+    creationDate: "08/03/2021",
+    duration: 60,
+    authors: [
+      "27cc3006-e93a-4748-8ca8-73d06aa93b6d",
+      "f762978b-61eb-4096-812b-ebde22838167",
+    ],
+  };
+  const authorsList = [
+    { id: "df32994e-b23d-497c-9e4d-84e4dc02882f", name: "name1" },
+    { id: "27cc3006-e93a-4748-8ca8-73d06aa93b6d", name: "name2" },
+    { id: "f762978b-61eb-4096-812b-ebde22838167", name: "name3" },
+  ];
+
+  test("should render correct title from course prop", () => {
+    render(<CourseCard course={course} authorsList={authorsList} />);
+
+    const titleElement = screen.getByText("Course Title");
+
+    expect(titleElement).toBeInTheDocument();
+  });
+
+  test("should render correct description from course prop", () => {
+    render(<CourseCard course={course} authorsList={authorsList} />);
+    const descriptionElement = screen.getByText("Course Description");
+    expect(descriptionElement).toBeInTheDocument();
+  });
+
+  test("should render correct duration (use getCourseDuration e.g. duration: 60 => 01:00 hour)", () => {
+    render(<CourseCard course={course} authorsList={authorsList} />);
+
+    const durationElement = screen.getByText(/01:00 hour/);
+
+    expect(durationElement).toBeInTheDocument();
+  });
+
+  test("should render correct date (use formatCreationDate e.g. creationDate: 08/03/2021 => 08.03.2021)", () => {
+    render(<CourseCard course={course} authorsList={authorsList} />);
+
+    const creationDateElement = screen.getByText(/08.03.2021/);
+
+    expect(creationDateElement).toBeInTheDocument();
+  });
+
+  test("should render authors list (match data from props course.authors and authorsList)", () => {
+    render(<CourseCard course={course} authorsList={authorsList} />);
+
+    const creationDateElement = screen.getByText(/name2, name3/);
+
+    expect(creationDateElement).toBeInTheDocument();
+  });
+
+  test("should render 'SHOW COURSE' button", () => {
+    render(<CourseCard course={course} authorsList={authorsList} />);
+
+    const creationDateElement = screen.getByText(/Show course/i);
+
+    expect(creationDateElement).toBeInTheDocument();
+  });
+});

package/dist/content/module-1/tests/CourseInfo.test.js

@@ -0,0 +1,136 @@
+import "@testing-library/jest-dom";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { CourseInfo } from "../../components/CourseInfo";
+import { formatCreationDate, getCourseDuration } from "../../helpers";
+
+const mockedCoursesList = [
+  {
+    id: "1",
+    title: "Course 1",
+    description: "Course 1 description",
+    creationDate: "2022-01-01",
+    duration: 60,
+    authors: [
+      "27cc3006-e93a-4748-8ca8-73d06aa93b6d",
+      "f762978b-61eb-4096-812b-ebde22838167",
+    ],
+  },
+  {
+    id: "2",
+    title: "Course 2",
+    description: "Course 2 description",
+    creationDate: "2022-02-01",
+    duration: 90,
+    authors: ["df32994e-b23d-497c-9e4d-84e4dc02882f"],
+  },
+];
+const authorsList = [
+  { id: "df32994e-b23d-497c-9e4d-84e4dc02882f", name: "name1" },
+  { id: "27cc3006-e93a-4748-8ca8-73d06aa93b6d", name: "name2" },
+  { id: "f762978b-61eb-4096-812b-ebde22838167", name: "name3" },
+];
+
+describe("CourseInfo", () => {
+  test("should renders correct title (find correct course from coursesList based on showCourseId prop) ", () => {
+    render(
+      <CourseInfo
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        showCourseId="1"
+      />
+    );
+
+    const courseTitle = screen.getByRole("heading", { level: 1 });
+
+    expect(courseTitle.textContent).toBe("Course 1");
+  });
+
+  test("should renders correct description", () => {
+    render(
+      <CourseInfo
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        showCourseId="1"
+      />
+    );
+
+    const courseDescription = screen.getByText("Course 1 description");
+
+    expect(courseDescription).toBeInTheDocument();
+  });
+
+  test("should renders correct course duration (use getCourseDuration)", () => {
+    render(
+      <CourseInfo
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        showCourseId="1"
+      />
+    );
+
+    const courseDuration = screen.queryByText(getCourseDuration(60));
+
+    expect(courseDuration).toBeInTheDocument();
+  });
+
+  test("should renders correct course creation date (use formatCreationDate)", () => {
+    render(
+      <CourseInfo
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        showCourseId="1"
+      />
+    );
+
+    const courseCreationDate = screen.getByText(
+      formatCreationDate(mockedCoursesList[0].creationDate)
+    );
+    expect(courseCreationDate).toBeInTheDocument();
+  });
+
+  test("should renders correct course authors names (find a course in the coursesList and match data from course authors and authorsList prop)", () => {
+    render(
+      <CourseInfo
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        showCourseId="1"
+      />
+    );
+
+    const authorNames = screen
+      .getAllByRole("listitem")
+      .map((li) => li.textContent);
+
+    expect(authorNames).toEqual(["name2", "name3"]);
+  });
+
+  test("should render `BACK` button correctly", () => {
+    render(
+      <CourseInfo
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        showCourseId="1"
+      />
+    );
+
+    const backButton = screen.getByRole("button");
+
+    expect(backButton).toBeInTheDocument();
+  });
+
+  test("should call onBack handler on Back button click", () => {
+    const onBack = jest.fn();
+    render(
+      <CourseInfo
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        showCourseId="1"
+        onBack={onBack}
+      />
+    );
+
+    const backButton = screen.queryByText(/back/i);
+    fireEvent.click(backButton);
+    expect(onBack).toHaveBeenCalledTimes(1);
+  });
+});

package/dist/content/module-1/tests/Courses.test.js

@@ -0,0 +1,81 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import { Courses } from "../../components/Courses/Courses";
+
+describe("Courses component", () => {
+  const mockedCoursesList = [
+    {
+      id: "1",
+      title: "Course 1",
+      description: "Course 1 description",
+      creationDate: "2022-01-01",
+      duration: 60,
+      authors: [
+        "27cc3006-e93a-4748-8ca8-73d06aa93b6d",
+        "f762978b-61eb-4096-812b-ebde22838167",
+      ],
+    },
+    {
+      id: "2",
+      title: "Course 2",
+      description: "Course 2 description",
+      creationDate: "2022-02-01",
+      duration: 90,
+      authors: ["df32994e-b23d-497c-9e4d-84e4dc02882f"],
+    },
+  ];
+  const authorsList = [
+    { id: "df32994e-b23d-497c-9e4d-84e4dc02882f", name: "name" },
+    { id: "27cc3006-e93a-4748-8ca8-73d06aa93b6d", name: "name" },
+    { id: "f762978b-61eb-4096-812b-ebde22838167", name: "name" },
+  ];
+  const onAddClick = jest.fn();
+
+  test("should render list of courses from coursesList prop", () => {
+    render(
+      <Courses
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        onAddClick={onAddClick}
+        handleShowCourse={(id) => {}}
+      />
+    );
+
+    const courseElements = screen.getAllByTestId("courseCard");
+
+    expect(courseElements[0]).toBeInTheDocument();
+    expect(courseElements).toHaveLength(2);
+  });
+
+  test("should render 'ADD NEW COURSE' button", () => {
+    render(
+      <Courses
+        coursesList={mockedCoursesList}
+        authorsList={authorsList}
+        onAddClick={onAddClick}
+        handleShowCourse={(id) => {}}
+      />
+    );
+
+    const button = screen.getByText(/Add new/i);
+
+    expect(button).toBeInTheDocument();
+  });
+
+  test("should render EmptycoursesList component if no courses (with 'Your List Is Empty' text and button with data-testid='addCourse')", () => {
+    render(
+      <Courses
+        coursesList={[]}
+        authorsList={authorsList}
+        onAddClick={onAddClick}
+        handleShowCourse={(id) => {}}
+      />
+    );
+
+    const emptyText = screen.queryByText(/Your List Is Empty/i);
+    const addButtonElement = screen.getByTestId("addCourse");
+
+    expect(emptyText).toBeInTheDocument();
+    expect(addButtonElement).toBeInTheDocument();
+  });
+});

package/dist/content/{content/module-1/tests/Header.test.tsx → module-1/tests/Header.test.js}

@@ -1,9 +1,9 @@
 import "@testing-library/jest-dom";
 import { render, screen } from "@testing-library/react";
-import { Header } from "../components/Header/Header";
+import { Header } from "../../components/Header/Header";
 
-describe('Header component', () => {
-  test("Should render logo", () => {
+describe("Header component", () => {
+  test("should render logo (<img /> tag)", () => {
     render(<Header />);
 
     const imageElement = screen.getByRole("img");
@@ -11,13 +11,11 @@ describe('Header component', () => {
     expect(imageElement).toBeInTheDocument();
   });
 
-  test("Should render logout button", () => {
+  test("should render logout button", () => {
     render(<Header />);
 
     const logoutButtonElement = screen.getByRole("button");
 
     expect(logoutButtonElement).toBeInTheDocument();
   });
-})
-
-
+});

package/dist/content/module-1/tests/Input.test.js

@@ -0,0 +1,42 @@
+import "@testing-library/jest-dom";
+import { render, fireEvent, screen } from "@testing-library/react";
+import { Input } from "../../common/Input";
+
+describe("Input component", () => {
+  const placeholderTextMock = "Enter a value";
+
+  test("should render input with provided labelText prop value", () => {
+    render(
+      <Input labelText="Test Input" placeholderText={placeholderTextMock} />
+    );
+
+    const inputElement = screen.getByLabelText("Test Input");
+    expect(inputElement).toBeInTheDocument();
+  });
+
+  test("should render input with provided placeholderText prop value", () => {
+    const { getByPlaceholderText } = render(
+      <Input labelText="Test Input" placeholderText={placeholderTextMock} />
+    );
+
+    expect(getByPlaceholderText(placeholderTextMock)).toBeInTheDocument();
+  });
+
+  test("should call provided callback for onChange event", () => {
+    const handleChange = jest.fn();
+
+    render(
+      <Input
+        labelText="Test Input"
+        onChange={handleChange}
+        placeholderText={placeholderTextMock}
+      />
+    );
+
+    const inputElement = screen.getByLabelText("Test Input");
+    fireEvent.change(inputElement, { target: { value: "Hello" } });
+
+    expect(handleChange).toHaveBeenCalledTimes(1);
+    expect(inputElement.value).toBe("Hello");
+  });
+});

package/dist/content/module-1/tests/helpers.test.js

@@ -0,0 +1,13 @@
+import { formatCreationDate, getCourseDuration } from "../../helpers";
+
+test("formatCreationDate function returns formatted date", () => {
+  const date = "2022/01/01";
+  const formattedDate = formatCreationDate(date);
+  expect(formattedDate).toBe("2022.01.01");
+});
+
+test("getCourseDuration function returns formatted duration", () => {
+  expect(getCourseDuration(60)).toBe("01:00 hour");
+  expect(getCourseDuration(90)).toBe("01:30 hour");
+  expect(getCourseDuration(120)).toBe("02:00 hours");
+});

package/dist/content/module-2/tests/App.test.js

@@ -0,0 +1,130 @@
+import "@testing-library/jest-dom";
+import { fireEvent, render, screen } from "@testing-library/react";
+import { MemoryRouter } from "react-router-dom";
+import App from "../../App";
+
+describe("App", () => {
+  test('should render Login component when "token" is not present in localStorage and route "/"', () => {
+    localStorage.removeItem("token");
+    render(
+      <MemoryRouter initialEntries={["/"]}>
+        <App />
+      </MemoryRouter>
+    );
+
+    expect(
+      screen.getByText(/If you don't have an account you/i)
+    ).toBeInTheDocument();
+  });
+
+  test('should switch to registration page from login page on "Registration" link click', () => {
+    localStorage.removeItem("token");
+
+    render(
+      <MemoryRouter initialEntries={["/"]}>
+        <App />
+      </MemoryRouter>
+    );
+
+    expect(
+      screen.getByText(/If you don't have an account you/i)
+    ).toBeInTheDocument();
+
+    fireEvent.click(screen.getByText(/registration/i));
+
+    expect(screen.queryByText(/name/i)).toBeInTheDocument();
+  });
+
+  test('should render Registration component when route "/registration"', () => {
+    localStorage.removeItem("token");
+    render(
+      <MemoryRouter initialEntries={["/registration"]}>
+        <App />
+      </MemoryRouter>
+    );
+
+    expect(screen.queryByText(/name/i)).toBeInTheDocument();
+    expect(screen.queryByText(/email/i)).toBeInTheDocument();
+    expect(screen.queryByText(/password/i)).toBeInTheDocument();
+  });
+
+  test('should switch to login page from registration page on "Login" link click', () => {
+    localStorage.removeItem("token");
+    render(
+      <MemoryRouter initialEntries={["/registration"]}>
+        <App />
+      </MemoryRouter>
+    );
+
+    expect(screen.queryByText(/name/i)).toBeInTheDocument();
+    expect(screen.queryByText(/email/i)).toBeInTheDocument();
+    expect(screen.queryByText(/password/i)).toBeInTheDocument();
+
+    fireEvent.click(screen.getByRole("link", { name: /login/i }));
+
+    expect(screen.queryByText(/name/i)).not.toBeInTheDocument();
+  });
+
+  test('should render CourseCard components with data-testid="courseCard" when token is present in localStorage and route "/"', () => {
+    localStorage.setItem("token", "token");
+    render(
+      <MemoryRouter initialEntries={["/"]}>
+        <App />
+      </MemoryRouter>
+    );
+
+    const courseElements = screen.getAllByTestId("courseCard");
+
+    expect(courseElements[0]).toBeInTheDocument();
+  });
+
+  test('should render CourseForm component with "CREATE COURSE" button with data-testid="createCourseButton" if route "/courses/add"', () => {
+    render(
+      <MemoryRouter initialEntries={["/courses/add"]}>
+        <App />
+      </MemoryRouter>
+    );
+
+    expect(screen.getByTestId("createCourseButton")).toBeInTheDocument();
+  });
+
+  test('should render CourseInfo component with data-testid="courseInfo" when route "/courses/:courseId"', () => {
+    render(
+      <MemoryRouter
+        initialEntries={["/courses/de5aaa59-90f5-4dbc-b8a9-aaf205c551ba"]}
+      >
+        <App />
+      </MemoryRouter>
+    );
+
+    expect(screen.getByTestId("courseInfo")).toBeInTheDocument();
+  });
+
+  test('should render CourseInfo with data-testid="courseInfo" component after "SHOW COURSE" button click', () => {
+    render(
+      <MemoryRouter>
+        <App />
+      </MemoryRouter>
+    );
+
+    fireEvent.click(screen.queryAllByText(/show/i)[0]);
+
+    expect(screen.getByTestId("courseInfo")).toBeInTheDocument();
+  });
+
+  test('should render list of courses with data-testid="courseCard" after "BACK" button click on CourseInfo page', () => {
+    render(
+      <MemoryRouter>
+        <App />
+      </MemoryRouter>
+    );
+
+    fireEvent.click(screen.queryAllByText(/show/i)[0]);
+    expect(screen.getByTestId("courseInfo")).toBeInTheDocument();
+
+    fireEvent.click(screen.queryAllByText(/back/i)[0]);
+    expect(screen.getAllByTestId("courseCard").length).toBeGreaterThanOrEqual(
+      1
+    );
+  });
+});

package/dist/content/module-2/tests/Button.test.js

@@ -0,0 +1,22 @@
+import "@testing-library/jest-dom";
+import { render, fireEvent, screen } from "@testing-library/react";
+import { Button } from "../../common/Button";
+
+describe("Button component", () => {
+  test("should render button with provided buttonText prop value", () => {
+    const handleClickMock = jest.fn();
+    render(<Button buttonText="Hello" handleClick={handleClickMock} />);
+    const buttonElement = screen.getByText("Hello");
+
+    expect(buttonElement).toBeInTheDocument();
+  });
+
+  test("should call provided handleClick callback prop", () => {
+    const handleClickMock = jest.fn();
+    render(<Button handleClick={handleClickMock} buttonText="Click me" />);
+    const buttonElement = screen.getByText("Click me");
+
+    fireEvent.click(buttonElement);
+    expect(handleClickMock).toHaveBeenCalledTimes(1);
+  });
+});

package/dist/content/module-2/tests/CourseCard.test.js

@@ -0,0 +1,93 @@
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
+import { CourseCard } from "../../components/Courses/components/CourseCard/CourseCard";
+import { MemoryRouter } from "react-router-dom";
+
+describe("CourseCard component", () => {
+  const course = {
+    id: "1",
+    title: "Course Title",
+    description: "Course Description",
+    creationDate: "08/03/2021",
+    duration: 60,
+    authors: [
+      "27cc3006-e93a-4748-8ca8-73d06aa93b6d",
+      "f762978b-61eb-4096-812b-ebde22838167",
+    ],
+  };
+  const authorsList = [
+    { id: "df32994e-b23d-497c-9e4d-84e4dc02882f", name: "name1" },
+    { id: "27cc3006-e93a-4748-8ca8-73d06aa93b6d", name: "name2" },
+    { id: "f762978b-61eb-4096-812b-ebde22838167", name: "name3" },
+  ];
+
+  test("should render correct title from course prop", () => {
+    render(
+      <MemoryRouter>
+        <CourseCard course={course} authorsList={authorsList} />
+      </MemoryRouter>
+    );
+
+    const titleElement = screen.getByText("Course Title");
+
+    expect(titleElement).toBeInTheDocument();
+  });
+
+  test("should render correct description from course prop", () => {
+    render(
+      <MemoryRouter>
+        <CourseCard course={course} authorsList={authorsList} />
+      </MemoryRouter>
+    );
+    const descriptionElement = screen.getByText("Course Description");
+    expect(descriptionElement).toBeInTheDocument();
+  });
+
+  test("should render correct duration (use getCourseDuration)", () => {
+    render(
+      <MemoryRouter>
+        <CourseCard course={course} authorsList={authorsList} />
+      </MemoryRouter>
+    );
+
+    const durationElement = screen.getByText(/01:00 hour/i);
+
+    expect(durationElement).toBeInTheDocument();
+  });
+
+  test("should render correct date (use formatCreationDate)", () => {
+    render(
+      <MemoryRouter>
+        <CourseCard course={course} authorsList={authorsList} />
+      </MemoryRouter>
+    );
+
+    const creationDateElement = screen.getByText(/08.03.2021/);
+
+    expect(creationDateElement).toBeInTheDocument();
+  });
+
+  test("should render authors list (match data from props course.authors and authorsList)", () => {
+    render(
+      <MemoryRouter>
+        <CourseCard course={course} authorsList={authorsList} />
+      </MemoryRouter>
+    );
+
+    const creationDateElement = screen.getByText(/name2, name3/);
+
+    expect(creationDateElement).toBeInTheDocument();
+  });
+
+  test("should render 'SHOW COURSE' button", () => {
+    render(
+      <MemoryRouter>
+        <CourseCard course={course} authorsList={authorsList} />
+      </MemoryRouter>
+    );
+
+    const creationDateElement = screen.getByText(/show course/i);
+
+    expect(creationDateElement).toBeInTheDocument();
+  });
+});