AnVIL CMG E2E tests first draft (#3636)

* feat: first pass of tests for AnVIL-CMG (#3626)

* feat: refactored tests to make usability on other platforms better (#3626)

Author: mrtopsyt

explorer/e2e/anvil-catalog/anvilcatalog-filters.spec.ts

@@ -2,7 +2,7 @@ import { expect, test } from "@playwright/test";
 /* eslint-disable sonarjs/no-duplicate-string  -- ignoring duplicate strings here */
 
 test("Expect workspaces url to go to workspaces tab", async ({ page }) => {
-  await page.goto("/explore/workspaces");
+  await page.goto("/data/workspaces");
   await expect(
     page.locator("_react=Tabs >> button >> text='Workspaces'")
   ).toHaveAttribute("aria-selected", "true");
@@ -12,15 +12,15 @@ test("Expect workspaces url to go to workspaces tab", async ({ page }) => {
 });
 
 test("Expect studies url to go to studies tab", async ({ page }) => {
-  await page.goto("/explore/studies");
+  await page.goto("/data/studies");
   await expect(
     page.locator("_react=Tabs >> button >> text='Studies'")
   ).toHaveAttribute("aria-selected", "true");
   await expect(page.locator("text='Study Design' >> nth=0")).toBeVisible();
 });
 
 test("Expect consortia url to go to consortia tab", async ({ page }) => {
-  await page.goto("/explore/consortia");
+  await page.goto("/data/consortia");
   await expect(
     page.locator("_react=Tabs >> button >> text='Consortia'")
   ).toHaveAttribute("aria-selected", "true");

explorer/e2e/anvil-catalog/anvilcatalog-url.spec.ts

@@ -1,53 +1,58 @@
 import { expect, test } from "@playwright/test";
 
 const PaginationSelector = "_react=Pagination";
-const BackButtonSelector = "data-testid=WestRoundedIcon";
-const ForwardButtonSelector = "data-testid=EastRoundedIcon";
+const BackButtonTestID = "WestRoundedIcon";
+const ForwardButtonTestID = "EastRoundedIcon";
 
 test.setTimeout(90000);
-test("Check forward and backwards pagination causes values to change", async ({
+test("Check forward and backwards pagination causes the page content to change", async ({
   page,
 }) => {
   // Navigate to the BioSamples page
-  await page.goto("/explore/");
-  await page.locator("text=BioSamples").click();
-  await expect(page).toHaveURL("/explore/biosamples", { timeout: 10000 });
+  await page.goto("/explore/biosamples");
   await expect(page.locator("text=Biosample Id")).toBeVisible();
 
-  const TestThreePageText = await page.locator(PaginationSelector).innerText();
+  const firstElementTextLocator = page
+    .getByRole("rowgroup")
+    .nth(1)
+    .getByRole("row")
+    .nth(0)
+    .getByRole("cell")
+    .nth(0);
+
   // Should start on first page
   await expect(page.locator(PaginationSelector)).toContainText("Page 1 of ");
-  const SplitStartingPageText = TestThreePageText.split(" ");
-  const max_pages = parseInt(
-    SplitStartingPageText[SplitStartingPageText.length - 1]
-  );
-
+  const max_pages = 5;
   const FirstTableEntries = [];
 
   // Paginate forwards
-  const FirstTableEntrySelector = "_react=TableComponent >> td >> nth=0";
   for (let i = 2; i < max_pages + 1; i++) {
-    const OriginalFirstTableEntry = await page
-      .locator(FirstTableEntrySelector)
-      .innerText();
+    const OriginalFirstTableEntry = await firstElementTextLocator.innerText();
     // Click the next button
-    await page.locator(ForwardButtonSelector).click();
+    await page
+      .getByRole("button")
+      .filter({ has: page.getByTestId(ForwardButtonTestID) })
+      .click();
     // Expect the page count to have incremented
     await expect(page.locator(PaginationSelector)).toContainText(
-      `Page ${i} of ${max_pages}`
+      `Page ${i} of `
     );
     // Expect the back button to be enabled
-    await expect
-      .soft(page.locator(BackButtonSelector).locator(".."))
-      .toBeEnabled();
+    await expect(
+      page
+        .getByRole("button")
+        .filter({ has: page.getByTestId(BackButtonTestID) })
+    ).toBeEnabled();
     // Expect the forwards button to be enabled
     if (i != max_pages) {
       await expect(
-        page.locator(ForwardButtonSelector).locator("..")
+        page
+          .getByRole("button")
+          .filter({ has: page.getByTestId(ForwardButtonTestID) })
       ).toBeEnabled();
     }
     // Expect the first entry to have changed on the new page
-    await expect(page.locator(FirstTableEntrySelector)).not.toHaveText(
+    await expect(firstElementTextLocator).not.toHaveText(
       OriginalFirstTableEntry
     );
     // Remember the first entry
@@ -57,14 +62,15 @@ test("Check forward and backwards pagination causes values to change", async ({
   // Paginate backwards
   for (let i = 0; i < max_pages - 1; i++) {
     const OldFirstTableEntry = FirstTableEntries[max_pages - i - 2];
-    await page.locator(BackButtonSelector).click();
+    await page
+      .getByRole("button")
+      .filter({ has: page.getByTestId(BackButtonTestID) })
+      .click();
     // Expect page number to be correct
     await expect(page.locator(PaginationSelector)).toContainText(
-      `Page ${max_pages - i - 1} of ${max_pages}`
+      `Page ${max_pages - i - 1} of `
     );
     // Expect page entry to be consistent with forward pagination
-    await expect(page.locator(FirstTableEntrySelector)).toHaveText(
-      OldFirstTableEntry
-    );
+    await expect(firstElementTextLocator).toHaveText(OldFirstTableEntry);
   }
 });

explorer/e2e/anvil/anvil-misc.spec.ts

@@ -1,27 +1,37 @@
 import { expect, test } from "@playwright/test";
+import { anvilTabs } from "./anvil-tabs";
 
 const PaginationSelector = "_react=Pagination";
-const BackButtonSelector = "data-testid=WestRoundedIcon";
-const ForwardButtonSelector = "data-testid=EastRoundedIcon";
+const BackButtonTestID = "WestRoundedIcon";
+const ForwardButtonTestID = "EastRoundedIcon";
 
 test.beforeEach(async ({ page }) => {
-  // Navigate to the BioSamples page
-  await page.goto("/explore/");
-  await page.locator("text=BioSamples").click();
-  await expect(page).toHaveURL("/explore/biosamples", { timeout: 10000 });
-  await expect(page.locator("text=Biosample Id")).toBeVisible();
+  // Navigate to the Donors page
+  await page.goto(anvilTabs.donors.url);
+  await expect(
+    page.getByRole("tab").getByText(anvilTabs.donors.tabName)
+  ).toBeVisible();
 });
 
-test("Check first page has correct buttons", async ({ page }) => {
+test("Check first page has disabled back and enabled forward pagination buttons on Donors Page", async ({
+  page,
+}) => {
   // Should start on first page
   await expect(page.locator(PaginationSelector)).toContainText("Page 1 of ");
   // Back Button should start disabled
-  await expect(page.locator(BackButtonSelector).locator("..")).toBeDisabled();
+  await expect(
+    page.getByRole("button").filter({ has: page.getByTestId(BackButtonTestID) })
+  ).toBeDisabled();
   // Forward button should start enabled
-  await expect(page.locator(ForwardButtonSelector).locator("..")).toBeEnabled();
+  await expect(
+    page
+      .getByRole("button")
+      .filter({ has: page.getByTestId(ForwardButtonTestID) })
+  ).toBeEnabled();
 });
 
-test("Check last page has correct buttons and that forward pagination increases the page count", async ({
+test.setTimeout(300000);
+test("Check that forward pagination increments the current page and that page count stays static for the first five pages on the donors tab", async ({
   page,
 }) => {
   // Should start on first page, and there should be multiple pages available
@@ -37,7 +47,10 @@ test("Check last page has correct buttons and that forward pagination increases
   );
   // Paginate forwards
   for (let i = 2; i < max_pages + 1; i++) {
-    await page.locator(ForwardButtonSelector).click();
+    await page
+      .getByRole("button")
+      .filter({ has: page.getByTestId(ForwardButtonTestID) })
+      .click();
     // Expect the page count to have incremented
     await expect(page.locator(PaginationSelector)).toContainText(
       `Page ${i} of ${max_pages}`
@@ -48,11 +61,13 @@ test("Check last page has correct buttons and that forward pagination increases
     `Page ${max_pages} of ${max_pages}`
   );
   // Expect the back button to be enabled on the last page
-  await expect
-    .soft(page.locator(BackButtonSelector).locator(".."))
-    .toBeEnabled();
+  await expect(
+    page.getByRole("button").filter({ has: page.getByTestId(BackButtonTestID) })
+  ).toBeEnabled();
   // Expect the forward button to be disabled
-  await expect
-    .soft(page.locator(ForwardButtonSelector).locator(".."))
-    .toBeDisabled();
+  await expect(
+    page
+      .getByRole("button")
+      .filter({ has: page.getByTestId(ForwardButtonTestID) })
+  ).toBeDisabled();
 });