adding links to SAST and DAST

facade-app/src/Components/Header.tsx

@@ -65,12 +65,16 @@ export default class Header extends React.Component<Props, {}> {
                 About Us
               </RSuiteNav.Item>
               <RSuiteDropDown title="Scanners">
-                <RSuiteDropDown.Item title="Dynamic Application Security Testing">
-                  DAST
-                </RSuiteDropDown.Item>
-                <RSuiteDropDown.Item title="Static Application Security Testing">
-                  SAST
-                </RSuiteDropDown.Item>
+                <a href="../scanner/dast">
+                  <RSuiteDropDown.Item title="Dynamic Application Security Testing">
+                    DAST
+                  </RSuiteDropDown.Item>
+                </a>
+                <a href="../scanner/sast">
+                  <RSuiteDropDown.Item title="Static Application Security Testing">
+                    SAST
+                  </RSuiteDropDown.Item>
+                </a>
               </RSuiteDropDown>
               <a href="https://github.com/SasanLabs/VulnerableApp-facade">
                 <RSuiteNav.Item

facade-app/src/test/App.test.tsx

@@ -1,92 +1,92 @@
-import React from "react";
-import { render, screen, fireEvent } from "@testing-library/react";
-import { getResource } from "../Utilities/Utils";
-import testFixture from "./fixtures";
-
-import App from "../App";
-
-jest.mock("../Utilities/Utils");
-
-describe("App", () => {
-  const _renderAppFully = () => {
-    //mock getResource since it will not work during testing
-    (getResource as jest.Mock).mockImplementation(
-      (uri: string, callback: Function, isJson: boolean) => {
-        //testFixture structure does not match the web response.
-        //so, we restructure it
-        const response = {
-          VulnerableApp:
-            testFixture.applicationData[0].vulnerabilityDefinitions,
-          "VulnerableApp-jsp":
-            testFixture.applicationData[1].vulnerabilityDefinitions,
-          "VulnerableApp-php":
-            testFixture.applicationData[2].vulnerabilityDefinitions,
-        };
-
-        callback({ isSuccessful: true, data: response });
-      }
-    );
-
-    return render(<App />);
-  };
-
-  const _renderAppFail = () => {
-    (getResource as jest.Mock).mockImplementation(
-      (uri: string, callback: Function, isJson: boolean) => {
-        callback({ isSuccessful: false, error: "error" });
-      }
-    );
-
-    return render(<App />);
-  };
-
-  const _renderAppNull = () => {
-    (getResource as jest.Mock).mockImplementation(
-      (uri: string, callback: Function, isJson: boolean) => {
-        callback({ isSuccessful: true, data: null });
-      }
-    );
-
-    return render(<App />);
-  };
-
-  const _renderAppEmpty = () => {
-    (getResource as jest.Mock).mockImplementation(
-      (uri: string, callback: Function, isJson: boolean) => {
-        callback({ isSuccessful: true, data: {} });
-      }
-    );
-
-    return render(<App />);
-  };
-
-  it("renders correctly", async () => {
-    expect(_renderAppFully().container).toMatchSnapshot();
-  });
-
-  it("renders content on nav item click", () => {
-    _renderAppFully();
-
-    fireEvent(
-      screen.getByTestId("VulnerableApp.CommandInjection.LEVEL_1"),
-      new MouseEvent("click", { bubbles: true, cancelable: true })
-    );
-    const content = screen.getByTestId("VULNERABILITY_CONTENT_DESCRIPTION");
-    expect(content).toBeInTheDocument();
-  });
-
-  it("does not render nav when data is null", async () => {
-    _renderAppNull();
-    expect(screen.queryByTestId(/LEFT_NAV_CONTAINER/i)).toBeNull();
-  });
-
-  it("does not render nav when getResource failed", async () => {
-    _renderAppFail();
-    expect(screen.queryByTestId(/LEFT_NAV_CONTAINER/i)).toBeNull();
-  });
-
-  it("does not render nav items when empty", async () => {
-    _renderAppEmpty();
-    expect(screen.queryByTestId(/VulnerableApp.CommandInjection/i)).toBeNull();
-  });
-});
+import React from "react";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { getResource } from "../Utilities/Utils";
+import testFixture from "./fixtures";
+
+import App from "../App";
+
+jest.mock("../Utilities/Utils");
+
+describe("App", () => {
+  const _renderAppFully = () => {
+    //mock getResource since it will not work during testing
+    (getResource as jest.Mock).mockImplementation(
+      (uri: string, callback: Function, isJson: boolean) => {
+        //testFixture structure does not match the web response.
+        //so, we restructure it
+        const response = {
+          VulnerableApp:
+            testFixture.applicationData[0].vulnerabilityDefinitions,
+          "VulnerableApp-jsp":
+            testFixture.applicationData[1].vulnerabilityDefinitions,
+          "VulnerableApp-php":
+            testFixture.applicationData[2].vulnerabilityDefinitions,
+        };
+
+        callback({ isSuccessful: true, data: response });
+      }
+    );
+
+    return render(<App />);
+  };
+
+  const _renderAppFail = () => {
+    (getResource as jest.Mock).mockImplementation(
+      (uri: string, callback: Function, isJson: boolean) => {
+        callback({ isSuccessful: false, error: "error" });
+      }
+    );
+
+    return render(<App />);
+  };
+
+  const _renderAppNull = () => {
+    (getResource as jest.Mock).mockImplementation(
+      (uri: string, callback: Function, isJson: boolean) => {
+        callback({ isSuccessful: true, data: null });
+      }
+    );
+
+    return render(<App />);
+  };
+
+  const _renderAppEmpty = () => {
+    (getResource as jest.Mock).mockImplementation(
+      (uri: string, callback: Function, isJson: boolean) => {
+        callback({ isSuccessful: true, data: {} });
+      }
+    );
+
+    return render(<App />);
+  };
+
+  it("renders correctly", async () => {
+    expect(_renderAppFully().container).toMatchSnapshot();
+  });
+
+  it("renders content on nav item click", () => {
+    _renderAppFully();
+
+    fireEvent(
+      screen.getByTestId("VulnerableApp.CommandInjection.LEVEL_1"),
+      new MouseEvent("click", { bubbles: true, cancelable: true })
+    );
+    const content = screen.getByTestId("VULNERABILITY_CONTENT_DESCRIPTION");
+    expect(content).toBeInTheDocument();
+  });
+
+  it("does not render nav when data is null", async () => {
+    _renderAppNull();
+    expect(screen.queryByTestId(/LEFT_NAV_CONTAINER/i)).toBeNull();
+  });
+
+  it("does not render nav when getResource failed", async () => {
+    _renderAppFail();
+    expect(screen.queryByTestId(/LEFT_NAV_CONTAINER/i)).toBeNull();
+  });
+
+  it("does not render nav items when empty", async () => {
+    _renderAppEmpty();
+    expect(screen.queryByTestId(/VulnerableApp.CommandInjection/i)).toBeNull();
+  });
+});

facade-app/src/test/Header.test.tsx

@@ -92,7 +92,7 @@ describe("Header", () => {
     };
     render(<Header setGlobalState={mock} globalState={state} />);
 
-    const link = screen.getAllByRole("link")[0];
+    const link = screen.getAllByRole("link")[2];
     const githubIcon = screen.getAllByRole("img")[2];
     const text = screen.getByText("Github");
 
@@ -130,8 +130,8 @@ describe("Header", () => {
         showHints: false,
       };
       render(<Header setGlobalState={mock} globalState={state} />);
-
-      const owaspLink = screen.getAllByRole("link")[1];
+      
+      const owaspLink = screen.getByRole("link", { name: "Owasp VulnerableApp" });
       const owaspIcon = screen.getAllByRole("img")[3];
       const text = screen.getByText("Owasp VulnerableApp");
 
@@ -154,7 +154,7 @@ describe("Header", () => {
       };
       render(<Header setGlobalState={mock} globalState={state} />);
 
-      const zapLink = screen.getAllByRole("link")[2];
+      const zapLink = screen.getByRole("link", { name: "ZAP JWT Addon" });
       const zapIcon = screen.getAllByRole("img")[4];
       const text = screen.getByText("ZAP JWT Addon");
 
@@ -177,7 +177,7 @@ describe("Header", () => {
       };
       render(<Header setGlobalState={mock} globalState={state} />);
 
-      const zapLink = screen.getAllByRole("link")[3];
+      const zapLink = screen.getAllByRole("link")[5];
       const zapIcon = screen.getAllByRole("img")[5];
       const text = screen.getByText("ZAP FileUpload Addon");
 

facade-app/src/test/Utils.test.tsx

@@ -26,27 +26,27 @@ describe("appendStaticResourcesToDocument()", () => {
     hints: [
       {
         vulnerabilityTypes: [{ identifierType: "CWE", value: "WASC-1" }],
-        description: "vulnerability hint 1"
+        description: "vulnerability hint 1",
       },
     ],
     resourceInformation: {
       htmlResource: {
         resourceType: ResourceType.HTML,
         isAbsolute: false,
-        uri: "/"
+        uri: "/",
       },
       staticResources: [
         {
           resourceType: ResourceType.JAVASCRIPT,
           isAbsolute: false,
-          uri: "/dummy_javascript_uri"
+          uri: "/dummy_javascript_uri",
         },
         {
           resourceType: ResourceType.CSS,
           isAbsolute: false,
-          uri: "/dummy_css_uri"
-        }
-      ]
+          uri: "/dummy_css_uri",
+        },
+      ],
     },
   };
   it("should modify the content of an element.", () => {

facade-app/src/test/__snapshots__/App.test.tsx.snap

@@ -95,6 +95,62 @@ exports[`App renders correctly 1`] = `
                   </span>
                 </a>
               </li>
+              <li
+                class="rs-dropdown rs-dropdown-placement-bottom-start"
+                role="menu"
+              >
+                <ul
+                  class="rs-dropdown-menu"
+                  role="menu"
+                >
+                  <a
+                    href="../scanner/dast"
+                  >
+                    <li
+                      class="rs-dropdown-item"
+                    >
+                      <a
+                        class="rs-dropdown-item-content"
+                        tabindex="-1"
+                        title="Dynamic Application Security Testing"
+                      >
+                        DAST
+                      </a>
+                    </li>
+                  </a>
+                  <a
+                    href="../scanner/sast"
+                  >
+                    <li
+                      class="rs-dropdown-item"
+                    >
+                      <a
+                        class="rs-dropdown-item-content"
+                        tabindex="-1"
+                        title="Static Application Security Testing"
+                      >
+                        SAST
+                      </a>
+                    </li>
+                  </a>
+                </ul>
+                <a
+                  class="rs-btn rs-btn-subtle rs-dropdown-toggle"
+                  tabindex="0"
+                >
+                  Scanners
+                  <span
+                    class="rs-dropdown-toggle-caret"
+                  />
+                  <span
+                    class="rs-ripple-pond"
+                  >
+                    <span
+                      class="rs-ripple"
+                    />
+                  </span>
+                </a>
+              </li>
               <a
                 href="https://github.com/SasanLabs/VulnerableApp-facade"
               >
@@ -2282,7 +2338,7 @@ exports[`App renders correctly 1`] = `
             data-testid="FOOTER_COPYRIGHT_TEXT"
           >
             © Copyright 
-            2022
+            2023
             , SasanLabs
           </div>
         </div>

facade-app/src/test/__snapshots__/Footer.test.tsx.snap

@@ -17,7 +17,7 @@ exports[`Footer renders correctly 1`] = `
           data-testid="FOOTER_COPYRIGHT_TEXT"
         >
           © Copyright 
-          2022
+          2023
           , SasanLabs
         </div>
       </div>