- Upgrade axios package to fix CVE

- Remove axios-mock package

Signed-off-by: Ian Bolton <[email protected]>

client/package.json

@@ -34,7 +34,7 @@
     "@react-keycloak/web": "^3.4.0",
     "@tanstack/react-query": "^4.22.0",
     "@tanstack/react-query-devtools": "^4.22.0",
-    "axios": "^0.21.2",
+    "axios": "^1.6.8",
     "dayjs": "^1.11.7",
     "ejs": "^3.1.7",
     "fast-xml-parser": "^4.0.3",
@@ -71,7 +71,6 @@
     "@types/react-measure": "^2.0.12",
     "@types/react-router-dom": "^5.1.7",
     "@types/tinycolor2": "^1.4.6",
-    "axios-mock-adapter": "^1.19.0",
     "browserslist": "^4.19.1",
     "case-sensitive-paths-webpack-plugin": "^2.4.0",
     "copy-webpack-plugin": "^12.0.2",

client/src/app/api/rest.ts

@@ -1,6 +1,8 @@
-// hub OpenAPI definition: https://github.com/konveyor/tackle2-hub/blob/main/docs/openapi3.json
-
-import axios, { AxiosPromise } from "axios";
+import axios, {
+  AxiosHeaders,
+  AxiosPromise,
+  RawAxiosRequestHeaders,
+} from "axios";
 
 import {
   AnalysisDependency,
@@ -107,14 +109,18 @@ export const QUESTIONNAIRES = HUB + "/questionnaires";
 
 export const ARCHETYPES = HUB + "/archetypes";
 
-// PATHFINDER
-export const PATHFINDER = "/hub/pathfinder";
 export const ASSESSMENTS = HUB + "/assessments";
 
-const jsonHeaders = { headers: { Accept: "application/json" } };
-const formHeaders = { headers: { Accept: "multipart/form-data" } };
-const fileHeaders = { headers: { Accept: "application/json" } };
-const yamlHeaders = { headers: { Accept: "application/x-yaml" } };
+const jsonHeaders: RawAxiosRequestHeaders = {
+  Accept: "application/json",
+};
+const formHeaders: RawAxiosRequestHeaders = {
+  Accept: "multipart/form-data",
+};
+const fileHeaders: RawAxiosRequestHeaders = { Accept: "application/json" };
+const yamlHeaders: RawAxiosRequestHeaders = {
+  Accept: "application/x-yaml",
+};
 
 type Direction = "asc" | "desc";
 
@@ -137,7 +143,7 @@ export const getApplicationDependencies = (
   return axios
     .get(`${APPLICATION_DEPENDENCY}`, {
       params,
-      headers: jsonHeaders.headers,
+      headers: jsonHeaders,
     })
     .then((response) => response.data);
 };
@@ -243,7 +249,7 @@ export const deleteAssessment = (id: number) => {
 };
 
 export const getIdentities = () => {
-  return axios.get<Identity[]>(`${IDENTITIES}`, jsonHeaders);
+  return axios.get<Identity[]>(`${IDENTITIES}`, { headers: jsonHeaders });
 };
 
 export const createIdentity = (obj: New<Identity>) => {
@@ -322,8 +328,7 @@ export function getTaskById(
   format: string,
   merged: boolean = false
 ): Promise<Task | string> {
-  const headers =
-    format === "yaml" ? { ...yamlHeaders.headers } : { ...jsonHeaders.headers };
+  const headers = format === "yaml" ? { ...yamlHeaders } : { ...jsonHeaders };
   const responseType = format === "yaml" ? "text" : "json";
 
   let url = `${TASKS}/${id}`;
@@ -371,11 +376,9 @@ export const uploadFileTaskgroup = ({
   formData: any;
   file: any;
 }) => {
-  return axios.post<Taskgroup>(
-    `${TASKGROUPS}/${id}/bucket/${path}`,
-    formData,
-    formHeaders
-  );
+  return axios.post<Taskgroup>(`${TASKGROUPS}/${id}/bucket/${path}`, formData, {
+    headers: formHeaders,
+  });
 };
 
 export const removeFileTaskgroup = ({
@@ -430,7 +433,9 @@ export const createFile = ({
   file: IReadFile;
 }) =>
   axios
-    .post<HubFile>(`${FILES}/${file.fileName}`, formData, fileHeaders)
+    .post<HubFile>(`${FILES}/${file.fileName}`, formData, {
+      headers: fileHeaders,
+    })
     .then((response) => {
       return response.data;
     });

client/src/app/pages/applications/analysis-wizard/__tests__/analysis-wizard.test.tsx

@@ -2,11 +2,9 @@ import React from "react";
 import "@testing-library/jest-dom";
 import { render, screen, waitFor } from "@app/test-config/test-utils";
 import { AnalysisWizard } from "../analysis-wizard";
-import { TASKGROUPS } from "@app/api/rest";
-import mock from "@app/test-config/mockInstance";
 import userEvent from "@testing-library/user-event";
-
-mock.onAny().reply(200, []);
+import { server } from "@mocks/server";
+import { rest } from "msw";
 
 const applicationData1 = {
   id: 1,
@@ -53,6 +51,13 @@ const taskgroupData = {
 };
 
 describe("<AnalysisWizard />", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+  afterEach(() => {
+    server.resetHandlers();
+  });
+
   let isAnalyzeModalOpen = true;
   const setAnalyzeModalOpen = (toggle: boolean) =>
     (isAnalyzeModalOpen = toggle);
@@ -157,7 +162,11 @@ describe("<AnalysisWizard />", () => {
       },
     ];
 
-    mock.onPost(`${TASKGROUPS}`).reply(200, taskgroupData);
+    server.use(
+      rest.get("/hub/taskgroups", (req, res, ctx) => {
+        return res(ctx.json([taskgroupData]));
+      })
+    );
 
     render(
       <AnalysisWizard

client/src/app/pages/applications/components/application-form/__tests__/application-form.test.tsx

@@ -6,26 +6,30 @@ import {
   fireEvent,
 } from "@app/test-config/test-utils";
 
-import { BUSINESS_SERVICES } from "@app/api/rest";
-import mock from "@app/test-config/mockInstance";
 import userEvent from "@testing-library/user-event";
 
 import "@testing-library/jest-dom";
-import { BusinessService } from "@app/api/models";
 import { ApplicationFormModal } from "../application-form-modal";
+import { server } from "@mocks/server";
+import { rest } from "msw";
 
 describe("Component: application-form", () => {
   const mockChangeValue = jest.fn();
+  beforeAll(() => server.listen({ onUnhandledRequest: "warn" }));
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+  afterEach(() => {
+    server.resetHandlers();
+  });
+  server.use(
+    rest.get("/hub/businessservices", (req, res, ctx) => {
+      return res(ctx.status(200), ctx.json([{ id: 1, name: "service" }]));
+    })
+  );
 
   it("Validation tests", async () => {
-    const businessServices: BusinessService[] = [{ id: 1, name: "service" }];
-
-    mock
-      .onGet(`${BUSINESS_SERVICES}`)
-      .reply(200, businessServices)
-      .onAny()
-      .reply(200, []);
-
     render(
       <ApplicationFormModal application={null} onClose={mockChangeValue} />
     );

client/src/app/pages/controls/tags/tags.tsx

@@ -91,7 +91,7 @@ export const Tags: React.FC = () => {
   const onDeleteTagError = (error: AxiosError) => {
     if (
       error.response?.status === 500 &&
-      error.response?.data.error === "FOREIGN KEY constraint failed"
+      error.message === "FOREIGN KEY constraint failed"
     ) {
       pushNotification({
         title: "Cannot delete a used tag",
@@ -121,7 +121,7 @@ export const Tags: React.FC = () => {
   const onDeleteTagCategoryError = (error: AxiosError) => {
     if (
       error.response?.status === 500 &&
-      error.response?.data.error === "FOREIGN KEY constraint failed"
+      error.message === "FOREIGN KEY constraint failed"
     ) {
       pushNotification({
         title: "Cannot delete a used tag",

client/src/app/pages/identities/components/identity-form/__tests__/identity-form.test.tsx

@@ -6,17 +6,16 @@ import {
   fireEvent,
 } from "@app/test-config/test-utils";
 
-import { IDENTITIES } from "@app/api/rest";
-import mock from "@app/test-config/mockInstance";
-
 import { IdentityForm } from "..";
 import "@testing-library/jest-dom";
+import { server } from "@mocks/server";
 
-const data: any[] = [];
+describe("Component: identity-form", () => {
+  beforeAll(() => server.listen({ onUnhandledRequest: "bypass" }));
 
-mock.onGet(`${IDENTITIES}`).reply(200, data);
+  afterEach(() => server.resetHandlers());
+  afterAll(() => server.close());
 
-describe("Component: identity-form", () => {
   const mockChangeValue = jest.fn();
 
   it("Display form on initial load", async () => {
@@ -176,7 +175,7 @@ describe("Component: identity-form", () => {
     expect(createButton).toBeDisabled();
   });
 
-  it.skip("Identity form validation test - source - key upload", async () => {
+  it("Identity form validation test - source - key upload", async () => {
     render(<IdentityForm onClose={mockChangeValue} />);
 
     const identityNameInput = await screen.findByLabelText("Name *");
@@ -231,7 +230,7 @@ describe("Component: identity-form", () => {
     expect(createButton).toBeEnabled();
   });
 
-  it.skip("Identity form validation test - maven", async () => {
+  it("Identity form validation test - maven", async () => {
     render(<IdentityForm onClose={mockChangeValue} xmlValidator={jest.fn()} />);
 
     const identityNameInput = await screen.findByLabelText("Name *");

client/src/app/pages/proxies/__tests__/proxy-form.test.tsx

@@ -8,48 +8,38 @@ import {
 } from "@app/test-config/test-utils";
 
 import { Proxies } from "../proxies";
-import MockAdapter from "axios-mock-adapter";
-import { IDENTITIES, PROXIES } from "@app/api/rest";
-import axios from "axios";
-import { Proxy, Identity } from "@app/api/models";
 import userEvent from "@testing-library/user-event";
-import { ProxyForm } from "../proxy-form";
-import mock from "@app/test-config/mockInstance";
-
-const identitiesData: Identity[] = [];
-mock.onGet(`${IDENTITIES}`).reply(200, identitiesData);
-
-const proxiesData = [
-  {
-    host: "",
-    kind: "http",
-    port: 0,
-    excluded: [],
-    identity: null,
-    id: 1,
-    enabled: false,
-  },
-  {
-    host: "",
-    kind: "https",
-    port: 0,
-    excluded: [],
-    identity: null,
-    id: 1,
-    enabled: false,
-  },
-];
-mock.onGet(`${PROXIES}`).reply(200, proxiesData);
+import { server } from "@mocks/server";
+import { rest } from "msw";
 
 describe("Component: proxy-form", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+  afterEach(() => {
+    server.resetHandlers();
+  });
+  server.use(
+    rest.get("/hub/identities", (req, res, ctx) => {
+      return res(
+        ctx.status(200),
+        ctx.json([
+          { id: 0, name: "proxy-cred", kind: "proxy" },
+          { id: 1, name: "maven-cred", kind: "maven" },
+          { id: 2, name: "source-cred", kind: "source" },
+        ])
+      );
+    })
+  );
+
   it("Display switch statements on initial load", async () => {
     render(<Proxies />);
     await screen.findByLabelText("HTTP proxy");
 
     await screen.findByLabelText("HTTPS proxy");
   });
 
-  it.skip("Show HTTP proxy form when switch button clicked", async () => {
+  it("Show HTTP proxy form when switch button clicked", async () => {
     render(<Proxies />);
     const httpProxySwitch = await screen.findByLabelText("HTTP proxy");
 
@@ -62,7 +52,7 @@ describe("Component: proxy-form", () => {
     );
   });
 
-  it.skip("Show HTTPS proxy form when switch button clicked", async () => {
+  it("Show HTTPS proxy form when switch button clicked", async () => {
     render(<Proxies />);
     const httpsProxySwitch = await screen.findByLabelText("HTTPS proxy");
 
@@ -75,14 +65,19 @@ describe("Component: proxy-form", () => {
     );
   });
 
-  it.skip("Select http proxy identity", async () => {
-    const identitiesData: Identity[] = [
-      { id: 0, name: "proxy-cred", kind: "proxy" },
-      { id: 1, name: "maven-cred", kind: "maven" },
-      { id: 2, name: "source-cred", kind: "source" },
-    ];
-
-    mock.onGet(`${IDENTITIES}`).reply(200, identitiesData);
+  it("Select http proxy identity", async () => {
+    server.use(
+      rest.get("/hub/identities", (req, res, ctx) => {
+        return res(
+          ctx.status(200),
+          ctx.json([
+            { id: 0, name: "proxy-cred", kind: "proxy" },
+            { id: 1, name: "maven-cred", kind: "maven" },
+            { id: 2, name: "source-cred", kind: "source" },
+          ])
+        );
+      })
+    );
 
     render(<Proxies />);
     const httpProxySwitch = await screen.findByLabelText("HTTP proxy");
@@ -112,14 +107,19 @@ describe("Component: proxy-form", () => {
     expect(sourceCred).toBeNull(); // it doesn't exist
   });
 
-  it.skip("Select https proxy identity", async () => {
-    const identitiesData: Identity[] = [
-      { id: 0, name: "proxy-cred", kind: "proxy" },
-      { id: 1, name: "maven-cred", kind: "maven" },
-      { id: 2, name: "source-cred", kind: "source" },
-    ];
-
-    mock.onGet(`${IDENTITIES}`).reply(200, identitiesData);
+  it("Select https proxy identity", async () => {
+    server.use(
+      rest.get("/hub/identities", (req, res, ctx) => {
+        return res(
+          ctx.status(200),
+          ctx.json([
+            { id: 0, name: "proxy-cred", kind: "proxy" },
+            { id: 1, name: "maven-cred", kind: "maven" },
+            { id: 2, name: "source-cred", kind: "source" },
+          ])
+        );
+      })
+    );
 
     render(<Proxies />);
     const httpsProxySwitch = await screen.findByLabelText("HTTPS proxy");