From f7b1d47e3c29aac4e2fd9dd137ee9693df26718a Mon Sep 17 00:00:00 2001
From: Matej Tarca <matej.tarca@kiwi.com>
Date: Sat, 7 Oct 2023 20:52:35 +0200
Subject: [PATCH] chore(jest): introduce coverage check

---
 .github/workflows/unit.yml                    |  2 +-
 jest.config.mjs                               |  8 ++
 package.json                                  |  3 +-
 .../__tests__/ApplicationStep.test.tsx        | 90 +++++++++++++++++++
 4 files changed, 101 insertions(+), 2 deletions(-)
 create mode 100644 src/scenes/Application/components/ApplicationSteps/components/__tests__/ApplicationStep.test.tsx

diff --git a/.github/workflows/unit.yml b/.github/workflows/unit.yml
index 33b6e6f..4364304 100644
--- a/.github/workflows/unit.yml
+++ b/.github/workflows/unit.yml
@@ -17,4 +17,4 @@ jobs:
       - name: Install dependencies
         run: npm ci
       - name: Run jest test
-        run: npm run test:unit
+        run: npm run test:jest:coverage
diff --git a/jest.config.mjs b/jest.config.mjs
index aa8a25a..ec04ce4 100644
--- a/jest.config.mjs
+++ b/jest.config.mjs
@@ -14,6 +14,14 @@ const config = {
   testEnvironment: "jest-environment-jsdom",
   testMatch: ["**/__tests__/**/*.+(ts|tsx|js)", "**/?(*.)+(spec|test).+(ts|tsx|js)"],
   testPathIgnorePatterns: ["/node_modules/", "/.next/", "/e2e/"],
+  collectCoverageFrom: ["**/*.{ts,tsx}", "!**/*.d.ts", "!**/node_modules/**"],
+  coverageThreshold: {
+    global: {
+      branches: 5,
+      functions: 5,
+      lines: 5,
+    },
+  },
 };
 
 // createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
diff --git a/package.json b/package.json
index 38e2c1d..c7561ba 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,8 @@
     "prisma:migrate-prod": "prisma migrate deploy",
     "prisma:seed": "prisma db seed",
     "test:e2e": "playwright test",
-    "test:unit": "jest",
+    "test:jest": "jest",
+    "test:jest:coverage": "jest --coverage",
     "test:local-e2e-docker": "chmod +x ./scripts/runE2ELocally.sh && ./scripts/runE2ELocally.sh --copy-tests"
   },
   "prisma": {
diff --git a/src/scenes/Application/components/ApplicationSteps/components/__tests__/ApplicationStep.test.tsx b/src/scenes/Application/components/ApplicationSteps/components/__tests__/ApplicationStep.test.tsx
new file mode 100644
index 0000000..eabd33e
--- /dev/null
+++ b/src/scenes/Application/components/ApplicationSteps/components/__tests__/ApplicationStep.test.tsx
@@ -0,0 +1,90 @@
+import { screen, render } from "@testing-library/react";
+import ApplicationStep from "../ApplicationStep";
+import getLocalApplicationDataStepCompleted from "@/services/helpers/localData/getLocalApplicationDataStepCompleted";
+
+jest.mock(
+  "../../../../../../services/helpers/localData/getLocalApplicationDataStepCompleted"
+);
+
+const renderComponent = ({
+  isCompleted,
+  shouldUseLocalIsCompleted,
+  isLocalCompleted,
+}: {
+  isCompleted: boolean;
+  shouldUseLocalIsCompleted: boolean;
+  isLocalCompleted: boolean;
+}) => {
+  (getLocalApplicationDataStepCompleted as jest.Mock).mockReturnValue(
+    isLocalCompleted
+  );
+  const step = {
+    id: 1,
+    position: 1,
+    title: "Personal Details",
+    isCompleted,
+    formFields: [],
+  };
+  render(
+    <ApplicationStep
+      step={step}
+      shouldUseLocalIsCompleted={shouldUseLocalIsCompleted}
+    />
+  );
+};
+
+describe("ApplicationStep", () => {
+  it("should render the step with the correct text", () => {
+    renderComponent({
+      isCompleted: false,
+      shouldUseLocalIsCompleted: false,
+      isLocalCompleted: false,
+    });
+    expect(
+      screen.getByRole("link", { name: "1. Personal Details" })
+    ).toBeVisible();
+    expect(
+      screen.queryByTestId("Step 1 completed icon")
+    ).not.toBeInTheDocument();
+  });
+
+  it("should render the step with the correct text and icon when completed", () => {
+    renderComponent({
+      isCompleted: true,
+      shouldUseLocalIsCompleted: false,
+      isLocalCompleted: false,
+    });
+    expect(
+      screen.getByRole("link", { name: "1. Personal Details" })
+    ).toBeVisible();
+    expect(screen.queryByTestId("Step 1 completed icon")).toBeVisible();
+  });
+
+  describe("when shouldUseLocalIsCompleted is true", () => {
+    it("should render the step with the correct text and icon when not completed", () => {
+      renderComponent({
+        isCompleted: false,
+        shouldUseLocalIsCompleted: true,
+        isLocalCompleted: false,
+      });
+      expect(
+        screen.getByRole("link", { name: "1. Personal Details" })
+      ).toBeVisible();
+      expect(
+        screen.queryByTestId("Step 1 completed icon")
+      ).not.toBeInTheDocument();
+    });
+
+    it("should render the step with the correct text and icon when completed", () => {
+      renderComponent({
+        isCompleted: false,
+        shouldUseLocalIsCompleted: true,
+        isLocalCompleted: true,
+      });
+      expect(
+        screen.getByRole("link", { name: "1. Personal Details" })
+      ).toBeVisible();
+      expect(screen.queryByTestId("Step 1 completed icon")).toBeVisible();
+    });
+  });
+});