Sorting of vulnerability table

tests/ui/features/@sbom-explorer/sbom-explorer.feature

@@ -3,7 +3,7 @@ Feature: SBOM Explorer - View SBOM details
         Given User is authenticated
 
     Scenario Outline: View SBOM Overview
-        Given An ingested "<sbomType>" SBOM "<sbomName>" is available
+        Given An ingested SBOM "<sbomName>" is available
         When User visits SBOM details Page of "<sbomName>"
         Then The page title is "<sbomName>"
         And Tab "Info" is visible
@@ -16,7 +16,7 @@ Feature: SBOM Explorer - View SBOM details
             | quarkus-bom |
 
     Scenario Outline: View SBOM Info (Metadata)
-        Given An ingested "<sbomType>" SBOM "<sbomName>" is available
+        Given An ingested SBOM "<sbomName>" is available
         When User visits SBOM details Page of "<sbomName>"
         Then Tab "Info" is selected
         Then "SBOM's name" is visible
@@ -30,7 +30,7 @@ Feature: SBOM Explorer - View SBOM details
             | quarkus-bom |
 
     Scenario Outline: Downloading SBOM file
-        Given An ingested "<sbomType>" SBOM "<sbomName>" is available
+        Given An ingested SBOM "<sbomName>" is available
         When User visits SBOM details Page of "<sbomName>"
         Then "Download SBOM" action is invoked and downloaded filename is "<expectedSbomFilename>"
         Then "Download License Report" action is invoked and downloaded filename is "<expectedLicenseFilename>"
@@ -40,7 +40,7 @@ Feature: SBOM Explorer - View SBOM details
             | quarkus-bom | quarkus-bom.json     | quarkus-bom_licenses.tar.gz |
 
     Scenario Outline: View list of SBOM Packages
-        Given An ingested "<sbomType>" SBOM "<sbomName>" is available
+        Given An ingested SBOM "<sbomName>" is available
         When User visits SBOM details Page of "<sbomName>"
         When User selects the Tab "Packages"
         # confirms its visible for all tabs
@@ -59,11 +59,11 @@ Feature: SBOM Explorer - View SBOM details
         Then The Package table total results is greather than 1
 
         Examples:
-            | sbomType | sbomName    | packageName |
-            | SPDX | quarkus-bom | jdom        |
+            | sbomName    | packageName |
+            | quarkus-bom | jdom        |
 
-    Scenario Outline: View <sbomType> SBOM Vulnerabilities
-        Given An ingested "<sbomType>" SBOM "<sbomName>" containing Vulnerabilities
+    Scenario Outline: View SBOM Vulnerabilities
+        Given An ingested SBOM "<sbomName>" containing Vulnerabilities
         When User visits SBOM details Page of "<sbomName>"
         When User selects the Tab "Vulnerabilities"
         When User Clicks on Vulnerabilities Tab Action
@@ -73,28 +73,55 @@ Feature: SBOM Explorer - View SBOM details
         Then SBOM Name "<sbomName>" should be visible inside the tab
         Then SBOM Version should be visible inside the tab
         Then SBOM Creation date should be visible inside the tab
-        # Then List of related Vulnerabilities should be sorted by "CVSS" in descending order
+        Then List of related Vulnerabilities should be sorted by "Id" in ascending order
 
         Examples:
-        | sbomType | sbomName |
-        | SPDX | quarkus-bom |
+        | sbomName |
+        | quarkus-bom |
 
     @slow
-    Scenario Outline: Pagination of <sbomType> SBOM Vulnerabilities
-        Given An ingested "<sbomType>" SBOM "<sbomName>" containing Vulnerabilities
+    Scenario Outline: Pagination of SBOM Vulnerabilities table
+        Given An ingested SBOM "<sbomName>" containing Vulnerabilities
         When User visits SBOM details Page of "<sbomName>"
         When User selects the Tab "Vulnerabilities"
         Then Pagination of Vulnerabilities list works
         Examples:
-        | sbomType | sbomName |
-        | SPDX | quarkus-bom |
+        | sbomName |
+        | quarkus-bom |
 
     @slow
-    Scenario Outline: View paginated list of <sbomType> SBOM Packages
-        Given An ingested "<sbomType>" SBOM "<sbomName>" is available
+    Scenario Outline: View paginated list of SBOM Packages
+        Given An ingested SBOM "<sbomName>" is available
         When User visits SBOM details Page of "<sbomName>"
         When User selects the Tab "Packages"
         Then Pagination of Packages list works
         Examples:
-        | sbomType | sbomName |
-        | SPDX | quarkus-bom |
+        | sbomName |
+        | quarkus-bom |
+
+    Scenario Outline: Check Column Headers of SBOM Explorer Vulnerabilities table
+        Given An ingested SBOM "<sbomName>" containing Vulnerabilities
+        When User visits SBOM details Page of "<sbomName>"
+        When User selects the Tab "Vulnerabilities"
+        Then List of Vulnerabilities has column "Id"
+        Then List of Vulnerabilities has column "Description"
+        Then List of Vulnerabilities has column "CVSS"
+        Then List of Vulnerabilities has column "Affected dependencies"
+        Then List of Vulnerabilities has column "Published"
+        Then List of Vulnerabilities has column "Updated"
+        Examples:
+        | sbomName |
+        | quarkus-bom |
+
+    @slow
+    Scenario Outline: Sorting SBOM Vulnerabilities
+        Given An ingested SBOM "<sbomName>" containing Vulnerabilities
+        When User visits SBOM details Page of "<sbomName>"
+        When User selects the Tab "Vulnerabilities"
+        Then Table column "Description" is not sortable
+        Then Sorting of "Id, Affected dependencies, Published, Updated" Columns Works
+        #Then Sorting of "CVSS" Columns works
+        # Bug: https://issues.redhat.com/browse/TC-2598
+        Examples:
+        | sbomName |
+        | quarkus-bom |

tests/ui/features/@sbom-explorer/sbom-explorer.step.ts

@@ -9,13 +9,10 @@ export const { Given, When, Then } = createBdd();
 const PACKAGE_TABLE_NAME = "Package table";
 const VULN_TABLE_NAME = "Vulnerability table";
 
-Given(
-  "An ingested {string} SBOM {string} is available",
-  async ({ page }, _sbomType, sbomName) => {
-    const searchPage = new SearchPage(page);
-    await searchPage.dedicatedSearch("SBOMs", sbomName);
-  }
-);
+Given("An ingested SBOM {string} is available", async ({ page }, sbomName) => {
+  const searchPage = new SearchPage(page, "SBOMs");
+  await searchPage.dedicatedSearch(sbomName);
+});
 
 When(
   "User visits SBOM details Page of {string}",
@@ -83,10 +80,10 @@ Then(
 );
 
 Given(
-  "An ingested {string} SBOM {string} containing Vulnerabilities",
-  async ({ page }, _sbomType, sbomName) => {
-    const searchPage = new SearchPage(page);
-    await searchPage.dedicatedSearch("SBOMs", sbomName);
+  "An ingested SBOM {string} containing Vulnerabilities",
+  async ({ page }, sbomName) => {
+    const searchPage = new SearchPage(page, "SBOMs");
+    await searchPage.dedicatedSearch(sbomName);
     const element = await page.locator(
       `xpath=(//tr[contains(.,'${sbomName}')]/td[@data-label='Vulnerabilities']/div)[1]`
     );
@@ -149,10 +146,10 @@ Then(
 );
 
 Then(
-  "List of related Vulnerabilities should be sorted by {string} in descending order",
+  "List of related Vulnerabilities should be sorted by {string} in ascending order",
   async ({ page }, columnName) => {
     const toolbarTable = new ToolbarTable(page, VULN_TABLE_NAME);
-    await toolbarTable.verifyTableIsSortedBy(columnName, false);
+    await toolbarTable.verifyTableIsSortedBy(columnName, true);
   }
 );
 
@@ -167,3 +164,26 @@ Then("Pagination of Packages list works", async ({ page }) => {
   const vulnTableTopPagination = `xpath=//div[@id="package-table-pagination-top"]`;
   await toolbarTable.verifyPagination(vulnTableTopPagination);
 });
+
+Then(
+  "List of Vulnerabilities has column {string}",
+  async ({ page }, columnHeader) => {
+    const toolbarTable = new ToolbarTable(page, VULN_TABLE_NAME);
+    await toolbarTable.verifyTableHeaderContains(columnHeader);
+  }
+);
+
+Then(
+  "Table column {string} is not sortable",
+  async ({ page }, columnHeader) => {
+    const toolbarTable = new ToolbarTable(page, VULN_TABLE_NAME);
+    await toolbarTable.verifyColumnIsNotSortable(columnHeader);
+  }
+);
+
+Then("Sorting of {string} Columns Works", async ({ page }, columnHeaders) => {
+  const headers = columnHeaders.split(`,`).map((column) => column.trim());
+  const toolbarTable = new ToolbarTable(page, VULN_TABLE_NAME);
+  const vulnTableTopPagination = `xpath=//div[@id="vulnerability-table-pagination-top"]`;
+  await toolbarTable.verifySorting(vulnTableTopPagination, headers);
+});

tests/ui/features/@vulnerability-explorer/vulnerability-explorer.step.ts

@@ -10,8 +10,8 @@ const ADVISORY_TABLE_NAME = "Advisory table";
 Given(
   "User visits Vulnerability details Page of {string}",
   async ({ page }, vulnerabilityID) => {
-    const searchPage = new SearchPage(page);
-    await searchPage.dedicatedSearch("Vulnerabilities", vulnerabilityID);
+    const searchPage = new SearchPage(page, "Vulnerabilities");
+    await searchPage.dedicatedSearch(vulnerabilityID);
     await page.getByRole("link", { name: vulnerabilityID }).click();
   }
 );

tests/ui/helpers/SearchPage.ts

@@ -3,19 +3,21 @@ import { DetailsPage } from "./DetailsPage";
 
 export class SearchPage {
   page: Page;
+  menu: String;
 
-  constructor(page: Page) {
+  constructor(page: Page, menu: String) {
     this.page = page;
+    this.menu = menu;
   }
 
   /**
    * Navigates to given menu option and filters data
    * @param menu Option from Vertical navigation menu
    * @param data Search data to filter
    */
-  async dedicatedSearch(menu: string, data: string) {
+  async dedicatedSearch(data: string) {
     await this.page.goto("/");
-    await this.page.getByRole("link", { name: menu }).click();
+    await this.page.getByRole("link", { name: `${this.menu}` }).click();
     const detailsPage = new DetailsPage(this.page);
     await detailsPage.waitForData();
     await detailsPage.verifyDataAvailable();