add the rest of navbar test cases

.github/workflows/e2e.yml

@@ -152,12 +152,12 @@ jobs:
         run: |
           cd chaise
           make testallfeatures-playwright
-      # - name: Run delete prohibited test spec
-      #   id: test-delete-prohibited
-      #   continue-on-error: true
-      #   run: |
-      #     cd chaise
-      #     make testdeleteprohibited-playwright
+      - name: Run delete prohibited test spec
+        id: test-delete-prohibited
+        continue-on-error: true
+        run: |
+          cd chaise
+          make testdeleteprohibited-playwright
       - name: Check on all features confirmation test spec
         if: always() && steps.test-all-features-confirmation.outcome != 'success'
         run: exit 1
@@ -167,9 +167,9 @@ jobs:
       - name: Check on all features test spec
         if: always() && steps.test-all-features.outcome != 'success'
         run: exit 1
-      # - name: Check on delete prohibited test spec
-      #   if: always() && steps.test-delete-prohibited.outcome != 'success'
-      #   run: exit 1
+      - name: Check on delete prohibited test spec
+        if: always() && steps.test-delete-prohibited.outcome != 'success'
+        run: exit 1
       - uses: actions/upload-artifact@v3
         if: always()
         with:

Makefile

@@ -186,7 +186,7 @@ testallfeaturesconfirmation-playwright: playwright-ALL_FEATURES_CONFIRMATION_PAR
 testdeleteprohibited: test-DELETE_PROHIBITED_PARALLEL_TESTS
 
 .PHONY: testdeleteprohibited-playwright
-testdeleteprohibited-playwright: playwright-DELETE_PROHIBITED_PARALLEL_TESTS
+testdeleteprohibited-playwright: playwright-DELETE_PROHIBITED_PARALLEL_TESTS_PLAYWRIGHT
 
 
 #Rule to run the default chaise configuration tests in parallel

docs/dev-docs/e2e-test-writing.md

@@ -16,7 +16,17 @@ In this document we try to summarize what are the best practices while writing t
 	- (More applicable in ERMrestJS)Although it's preferable to not modify other schemas and create your very own schema that covers some specific test cases.
 - If you have multiple expect in your `it`, make sure they have their own error message.
 
--
+- Use `expect.soft` if this is one of steps and we should be able to run the next steps even if it fails.
+
+- Common wait-fors:
+
+```
+profileModal.waitFor({ state: 'visible' });
+
+profileModal.waitFor({ state: 'attached' });
+
+profileModal.waitFor({ state: 'detached' });
+```
 
 
 ## Test FAQ

docs/dev-docs/e2e-test.md

@@ -174,6 +174,10 @@ TODO
 
 TODO
 
+```
+page.pause();
+```
+
 ## Writing test
 
 Please use [this link](e2e-test-writing.md) to find more information about how to write new test cases.

test/playwright/locators/modal.ts

@@ -0,0 +1,11 @@
+import { Locator, Page } from '@playwright/test';
+
+export default class ModalLocators {
+  static getProfileModal(page: Page) : Locator {
+    return page.locator('.profile-popup');
+  }
+
+  static getCloseBtn (modal: Locator) : Locator {
+    return modal.locator('.modal-close');
+  }
+}

test/playwright/locators/navbar.ts

@@ -5,32 +5,32 @@ export default class NavbarLocators {
     return page.locator('#mainnav');
   }
 
-  static getBanner(key: string, page: Page) : Locator {
+  static getBanner(key: string, page: Page): Locator {
     let selector = '.chaise-navbar-banner-container';
     if (key) {
-        selector += '.chaise-navbar-banner-container-' + key;
+      selector += '.chaise-navbar-banner-container-' + key;
     }
     return page.locator(selector);
   }
 
-  static getBannerContent(key: string, page: Page) : Locator {
+  static getBannerContent(key: string, page: Page): Locator {
     const banner = NavbarLocators.getBanner(key, page);
     return banner.locator('.markdown-container');
   }
 
-  static getBannerDismissBtn (key: string, page: Page) {
-    const banner =  NavbarLocators.getBanner(key, page);
+  static getBannerDismissBtn(key: string, page: Page) {
+    const banner = NavbarLocators.getBanner(key, page);
     return banner.locator('.close');
-}
-
-  static getTitle (page: any) {
-    return page.locator('#brand-text');
   }
 
-  static getBrandImage(page: any) {
+  static getBrandImage(page: Page) {
     return page.locator('#brand-image')
   }
 
+  static getBrandText(page: Page) {
+    return page.locator('#brand-text')
+  }
+
   static getUsername(page: Page) {
     return page.locator('.username-display');
   }

test/playwright/locators/page.ts

@@ -1,4 +1,4 @@
-import { Locator, Page, BrowserContext } from '@playwright/test';
+import { Locator, BrowserContext } from '@playwright/test';
 
 export default class PageLocators {
 

test/playwright/locators/recordset.ts

@@ -0,0 +1,16 @@
+import { Locator, Page } from '@playwright/test';
+
+export default class RecordsetLocators {
+  static async waitForRecordsetPageReady(page: Page) {
+    await RecordsetLocators.getRecordSetTable(page).waitFor({ state: 'visible' });
+  }
+
+  static async waitForAggregates(page: Page) {
+    page.locator('.table-column-spinner').waitFor({ state: 'hidden' });
+  }
+
+  static getRecordSetTable(page: Page): Locator {
+    return page.locator('.recordset-table');
+  }
+
+}

test/playwright/setup/playwright.configuration.ts

@@ -1,10 +1,9 @@
 import { defineConfig, devices } from '@playwright/test';
 import { resolve } from 'path';
-import { TestOptions } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.model';
 import os from 'os';
 
-
-export const STORAGE_STATE = resolve(__dirname, '../.auth/user.json');
+import { TestOptions } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.model';
+import { STORAGE_STATE } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.parameters';
 
 const getConfig = (options: TestOptions) => {
 
@@ -19,6 +18,8 @@ const getConfig = (options: TestOptions) => {
     throw new Error('ERMREST_URL and CHAISE_BASE_URL env variables are required.');
   }
 
+  const reporterFolder = resolve(__dirname, `./../../../playwright-report/${options.testName}`);
+
   const config = defineConfig({
 
     testMatch: options.testMatch,
@@ -40,15 +41,13 @@ const getConfig = (options: TestOptions) => {
 
     // Reporter to use
     reporter: process.env.CI ? [
-      ['html', { open: 'never', outputFolder: resolve(__dirname, `./../../../playwright-report/${options.testName}`) }],
+      ['html', { open: 'never', outputFolder: reporterFolder }],
       ['github']
     ] : [
-      ['html', { open: 'never', outputFolder: resolve(__dirname, `./../../../playwright-report/${options.testName}`) }],
+      ['html', { open: 'never', outputFolder: reporterFolder }],
       ['list', { printSteps: true }]
     ],
 
-    // outputDir: resolve(__dirname, './../../../playwright-output'),
-
     globalSetup: require.resolve('./playwright.setup'),
     globalTeardown: require.resolve('./playwright.teardown'),
 

test/playwright/setup/playwright.parameters.ts

@@ -0,0 +1,39 @@
+import { resolve } from 'path';
+
+export const ERMREST_URL = process.env.ERMREST_URL;
+
+/**
+ * return the catalog created for tests
+ * (populated during setup)
+ */
+export const getCatalogID = () : string => {
+  return process.env.CATALOG_ID!;
+}
+
+
+/**
+ * This is where we're writing the entities to.
+ *
+ * There are some system generated columns that we might want to know the value of,
+ * entities will have those. The problem is that we cannot just attach this variable
+ * to `global` since we might run test specs in multiple threads via sharding.
+ * Therefore we are writing these data this file, and then removing the file
+ *
+ * TODO is this limitation true with playwright?
+ */
+export const ENTITIES_PATH = 'entities.json';
+
+
+/**
+ * return the session object for the main user (catalog owner).
+ * (populated during setup)
+ */
+export const getMainUserSessionObject = () => {
+  return  JSON.parse(process.env.WEBAUTHN_SESSION!);
+}
+
+
+/**
+ * the file that contains the logged in browser state
+ */
+export const STORAGE_STATE = resolve(__dirname, '../.auth/user.json');

test/playwright/setup/playwright.pretest.ts

@@ -1,4 +1,6 @@
 import { test } from '@playwright/test';
+
+// utils
 import { performLogin } from '@isrd-isi-edu/chaise/test/playwright/utils/user-utils';
 
 test.describe('Login user', () => {

test/playwright/setup/playwright.setup.ts

@@ -5,7 +5,7 @@ import fs from 'fs';
 
 import { TestOptions } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.model';
 import { removeCatalog, setupCatalog } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.import';
-import { ENTITIES_PATH } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.constant';
+import { ENTITIES_PATH, getCatalogID } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.parameters';
 
 /**
  *
@@ -279,7 +279,7 @@ function registerCallbacks(testConfiguration: any) {
   // If an uncaught exception is caught then simply call cleanup
   // to remove the created schema/catalog/tables if catalogId is not null
   process.on('uncaughtException', function (err) {
-    const catalogId = process.env.CATALOG_ID;
+    const catalogId = getCatalogID();
     console.log(`in error : catalogId ${catalogId}`);
     console.dir(err);
     const cb = () => {

test/playwright/setup/playwright.teardown.ts

@@ -3,7 +3,7 @@ import fs from 'fs';
 
 import { TestOptions } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.model';
 import { removeCatalog } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.import';
-import { ENTITIES_PATH } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.constant';
+import { ENTITIES_PATH, getCatalogID } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.parameters';
 
 async function globalTeardown(config: FullConfig) {
   /**
@@ -31,7 +31,7 @@ async function globalTeardown(config: FullConfig) {
   //   promises.push(pImport.deleteHatracNamespaces(testConfiguration.authCookie, testConfiguration.hatracNamespaces));
   // }
 
-  const catalogId = process.env.CATALOG_ID;
+  const catalogId = getCatalogID();
   if (testConfiguration.cleanup && testConfiguration.setup && catalogId != null) {
     await removeCatalog(catalogId);
   }

test/playwright/specs/all-features-confirmation/navbar/no-logo.spec.ts

@@ -1,11 +1,14 @@
 import { test, expect } from '@playwright/test';
+
+// locators
 import NavbarLocators from '@isrd-isi-edu/chaise/test/playwright/locators/navbar';
 import PageLocators from '@isrd-isi-edu/chaise/test/playwright/locators/page';
-import { getMainUserSessionObject } from '@isrd-isi-edu/chaise/test/playwright/utils/user-utils';
+
+// utils
+import { getMainUserSessionObject, getCatalogID } from '@isrd-isi-edu/chaise/test/playwright/setup/playwright.parameters';
 
 test.describe('Navbar', () => {
-  const CATALOG_ID = process.env.CATALOG_ID;
-  const PAGE_URL = `/recordset/#${CATALOG_ID!}/product-navbar:accommodation`;
+  const PAGE_URL = `/recordset/#${getCatalogID()}/product-navbar:accommodation`;
 
   test.beforeEach(async ({ page, baseURL }) => {
     await page.goto(`${baseURL}${PAGE_URL}`);
@@ -20,7 +23,7 @@ test.describe('Navbar', () => {
 
     await test.step('should display the right title from chaiseConfig.', async () => {
       // default heuristics
-      await expect.soft(NavbarLocators.getTitle(page)).toHaveText('Chaise');
+      await expect.soft(NavbarLocators.getBrandText(page)).toHaveText('Chaise');
     });
 
     await test.step('should include the headTitle from chaiseConfig in the tab title (head > title)', async () => {
@@ -94,7 +97,7 @@ test.describe('Navbar', () => {
 
         const newPage = await PageLocators.clickNewTabLink(searchOption, context);
         await newPage.waitForURL('**/chaise/search/#1/isa:dataset**');
-        newPage.close();
+        await newPage.close();
       });
     }
 
@@ -112,9 +115,8 @@ test.describe('Navbar', () => {
 
       // check that clicking opens the link
       const newPage = await PageLocators.clickNewTabLink(datasetOption, context);
-      page.pause();
-      await newPage.waitForURL(`**/chaise/recordset/#${CATALOG_ID}/isa:dataset**`);
-      newPage.close();
+      await newPage.waitForURL(`**/chaise/recordset/#${getCatalogID()}/isa:dataset**`);
+      await newPage.close();
     });
   });
 
@@ -124,8 +126,9 @@ test.describe('Navbar', () => {
     const loginMenu = NavbarLocators.getLoginMenu(page);
 
     await test.step('should show the "Display Name" of the logged in user in the top right based on chaise-config property', async () => {
-      const name = getMainUserSessionObject().client.display_name;
-      await expect.soft(NavbarLocators.getUsername(page)).toHaveText(name);
+      const session = getMainUserSessionObject();
+      expect.soft(session.client).toBeTruthy();
+      await expect.soft(username).toHaveText(session.client.display_name);
     });
 
     await test.step('clicking on username should open the login dropdown menu.', async () => {