@axinom/mosaic-e2e-page-model 0.17.12 → 0.17.13-rc.3

package/dist/esm/ui-selectors/toast-notifications.d.ts

@@ -0,0 +1,48 @@
+import { ComponentModel } from '@axinom/mosaic-e2e-ui-selectors';
+import { type FrameLocator, type Locator, type Page } from '@playwright/test';
+/**
+ * A model for a toast notifications
+ * with methods to get individual toast messages.
+ */
+export declare class Notifications extends ComponentModel {
+    /**
+     * A model for the toast notifications.
+     * @param parent  The parent playwright page, frame or component model.
+     * @param xpath  A relative xpath selector to this element from the parent.
+     */
+    constructor(parent: Page | FrameLocator, xpath?: string);
+    /**
+     * This method gets a visible notification by position.
+     * Position 1 is the first notification.
+     * Negative numbers count from the end.
+     * @param position The position of the notification.
+     * @returns A model for the notification.
+     */
+    getNotification(position?: number): Notification;
+    /**
+     * This method gets a visible notification by title.
+     * @param title A title of the notification.
+     * @returns A model for the notification.
+     */
+    getNotificationByTitle(title: string): Notification;
+}
+/**
+ * A model for individual toast notification message
+ */
+export declare class Notification extends ComponentModel {
+    message: Locator;
+    /**
+     * @returns A locator to the notification message title.
+     */
+    getNotificationTitle(): Locator;
+    /**
+     * @returns A locator to the notification message body.
+     */
+    getNotificationBody(): Locator;
+    /**
+     * This method closes the notification.
+     * @returns a promise that resolves when the notification is removed from the DOM.
+     */
+    closeToast(): Promise<void>;
+}
+//# sourceMappingURL=toast-notifications.d.ts.map

package/dist/esm/ui-selectors/toast-notifications.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-notifications.d.ts","sourceRoot":"","sources":["../../../src/ui-selectors/toast-notifications.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE9E;;;GAGG;AACH,qBAAa,aAAc,SAAQ,cAAc;IAC/C;;;;OAIG;gBAED,MAAM,EAAE,IAAI,GAAG,YAAY,EAC3B,KAAK,SAA4C;IAKnD;;;;;;OAMG;IACH,eAAe,CAAC,QAAQ,SAAI,GAAG,YAAY;IAI3C;;;;OAIG;IACH,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,YAAY;CAMpD;AAED;;GAEG;AACH,qBAAa,YAAa,SAAQ,cAAc;IAC9C,OAAO,EAAE,OAAO,CAAuB;IAEvC;;OAEG;IACH,oBAAoB,IAAI,OAAO;IAI/B;;OAEG;IACH,mBAAmB,IAAI,OAAO;IAI9B;;;OAGG;IACG,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;CAIlC"}

package/dist/esm/ui-selectors/toast-notifications.js

@@ -0,0 +1,64 @@
+import { ComponentModel } from '@axinom/mosaic-e2e-ui-selectors';
+import {} from '@playwright/test';
+/**
+ * A model for a toast notifications
+ * with methods to get individual toast messages.
+ */
+export class Notifications extends ComponentModel {
+    /**
+     * A model for the toast notifications.
+     * @param parent  The parent playwright page, frame or component model.
+     * @param xpath  A relative xpath selector to this element from the parent.
+     */
+    constructor(parent, xpath = '//*[@data-test-id="toast-notification"]') {
+        super(parent, xpath);
+    }
+    /**
+     * This method gets a visible notification by position.
+     * Position 1 is the first notification.
+     * Negative numbers count from the end.
+     * @param position The position of the notification.
+     * @returns A model for the notification.
+     */
+    getNotification(position = 1) {
+        return new Notification(this, ``, position);
+    }
+    /**
+     * This method gets a visible notification by title.
+     * @param title A title of the notification.
+     * @returns A model for the notification.
+     */
+    getNotificationByTitle(title) {
+        return new Notification(this, `[.//*[@data-test-id="toast-title" and text()="${title}"]]`);
+    }
+}
+/**
+ * A model for individual toast notification message
+ */
+export class Notification extends ComponentModel {
+    constructor() {
+        super(...arguments);
+        this.message = this.getLocator(``);
+    }
+    /**
+     * @returns A locator to the notification message title.
+     */
+    getNotificationTitle() {
+        return this.getLocator(`//*[@data-test-id="toast-title"]`);
+    }
+    /**
+     * @returns A locator to the notification message body.
+     */
+    getNotificationBody() {
+        return this.getLocator(`//*[@data-test-id="toast-body"]`);
+    }
+    /**
+     * This method closes the notification.
+     * @returns a promise that resolves when the notification is removed from the DOM.
+     */
+    async closeToast() {
+        await this.getLocator(`//*[@data-test-id="toast-close"]`).click();
+        return this.message.waitFor({ state: 'detached' });
+    }
+}
+//# sourceMappingURL=toast-notifications.js.map

package/dist/esm/ui-selectors/toast-notifications.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-notifications.js","sourceRoot":"","sources":["../../../src/ui-selectors/toast-notifications.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAA8C,MAAM,kBAAkB,CAAC;AAE9E;;;GAGG;AACH,MAAM,OAAO,aAAc,SAAQ,cAAc;IAC/C;;;;OAIG;IACH,YACE,MAA2B,EAC3B,KAAK,GAAG,yCAAyC;QAEjD,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACvB,CAAC;IAED;;;;;;OAMG;IACH,eAAe,CAAC,QAAQ,GAAG,CAAC;QAC1B,OAAO,IAAI,YAAY,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,CAAC,CAAC;IAC9C,CAAC;IAED;;;;OAIG;IACH,sBAAsB,CAAC,KAAa;QAClC,OAAO,IAAI,YAAY,CACrB,IAAI,EACJ,iDAAiD,KAAK,KAAK,CAC5D,CAAC;IACJ,CAAC;CACF;AAED;;GAEG;AACH,MAAM,OAAO,YAAa,SAAQ,cAAc;IAAhD;;QACE,YAAO,GAAY,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IAwBzC,CAAC;IAtBC;;OAEG;IACH,oBAAoB;QAClB,OAAO,IAAI,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC;IAC7D,CAAC;IAED;;OAEG;IACH,mBAAmB;QACjB,OAAO,IAAI,CAAC,UAAU,CAAC,iCAAiC,CAAC,CAAC;IAC5D,CAAC;IAED;;;OAGG;IACH,KAAK,CAAC,UAAU;QACd,MAAM,IAAI,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC,KAAK,EAAE,CAAC;QAClE,OAAO,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,CAAC;IACrD,CAAC;CACF"}

package/dist/esm/ui-selectors/ui-shell-model.d.ts

@@ -0,0 +1,158 @@
+import { Hub, LandingPageHeader, LandingPageTiles, PageHeader } from '@axinom/mosaic-e2e-ui-selectors';
+import { type Page } from '@playwright/test';
+import { Breadcrumbs } from './breadcrumbs.js';
+import { NavigationPanel } from './navigation-panel.js';
+import { Notifications } from './toast-notifications.js';
+/**
+ * A model representing the Mosaic UI including methods for navigation.
+ * This model should be used for page and UI components which are provided by Mosaic as a service.
+ *
+ * Use this model to interact with:
+ * - The breadcrumbs bar (on any page)
+ * - The landing page
+ * - The settings hub page
+ * - Pages, settings or mod*a*ls of any managed service (Image, Video, etc)
+ */
+export declare class UiShellModel {
+    /** The playwright page object. */
+    protected readonly page: Page;
+    constructor(
+    /** The playwright page object. */
+    page: Page);
+    /** A model for the breadcrumbs bar. */
+    readonly breadcrumbs: Breadcrumbs;
+    /** A model for the header on the landing page. */
+    readonly landingPageHeader: LandingPageHeader;
+    /** A model for the landing page tiles. */
+    readonly landingPageTiles: LandingPageTiles;
+    /** A model for the settings page header. */
+    readonly settingsPageHeader: PageHeader;
+    /** A model for the settings pages navigation hub. */
+    readonly settingsPageHub: Hub;
+    /** A model for navigation panel */
+    readonly navigationPanel: NavigationPanel;
+    /** A model for toast notifications */
+    readonly notifications: Notifications;
+    /**
+     * This method navigates to the landing page breadcrumb.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Click the first (home) breadcrumb
+     * - Wait for a page transition to complete
+     */
+    navigateToBreadcrumbHome(): Promise<void>;
+    /**
+     * This method navigates to the 'previous' breadcrumb.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Click the last-but-one breadcrumb
+     * - Wait for a page transition to complete
+     */
+    navigateToBreadcrumbPrevious(): Promise<void>;
+    /**
+     * This method navigates to the 'refresh' breadcrumb.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Click the last breadcrumb
+     * - Wait for a page transition to complete
+     */
+    navigateToBreadcrumbRefresh(): Promise<void>;
+    /**
+     * This method navigates to a landing page tile by label.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Navigate to the home breadcrumb (if not already on the landing page)
+     * - Navigate to a tile by label
+     * - Wait for a page transition to complete
+     */
+    navigateToLandingPageTile(label: string): Promise<void>;
+    /**
+     * This method navigates to a settings page tile by label.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * @deprecated Please use `goToNavigationPanelSettingsItem` instead
+     *
+     * The following steps will be taken:
+     * - Navigate to the home breadcrumb (if not already on the landing page)
+     * - Navigate to the 'Settings' tile
+     * - Navigate to a tile by group label and tile label
+     * - Wait for a page transition to complete
+     */
+    navigateToSettingsTile(groupLabel: string, tileLabel: string): Promise<void>;
+    /**
+     * Navigates to specified Settings page item using navigation panel
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Navigate to the home breadcrumb (if not already on the landing page)
+     * - Navigate to the Settings category
+     * - In case `groupLabel` is provided navigate to the navigation item group by group label and expand the it
+     * - Navigate to the navigation item by item label
+     * - Wait for a page transition to complete
+     * @param itemLabel Navigation item label
+     * @param groupLabel Label of navigation item group in Settings category, that needs to be expanded
+     */
+    goToNavigationPanelSettingsItem(itemLabel: string, groupLabel?: string): Promise<void>;
+    /**
+     * Navigates to the specified navigation panel page using Navigation Panel item text
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Expand the menu (if not on a home view where the navigation panel is already visible)
+     * - Navigate to the navigation category by category label
+     * - In case `groupLabel` is provided Navigate to the navigation item group by group label and expand the group
+     * - Navigate to the navigation item by item label
+     * - Wait for a page transition to complete
+     * @param categoryLabel Navigation category label
+     * @param itemLabel Label of navigation item
+     * @param groupLabel Label of navigation item group in category, that needs to be expanded
+     */
+    goToNavigationPanelItem(categoryLabel: string, itemLabel: string, groupLabel?: string): Promise<void>;
+    /**
+     * Navigates to the specified navigation panel page using HTML element attribute `data-test-id`
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Expand the menu (if not on a home view where the navigation panel is already visible)
+     * - Navigate to the navigation category by category label
+     * - In case `groupLabel` is provided Navigate to the navigation item group by group label and expand the group
+     * - Navigate to the navigation item by item label
+     * - Wait for a page transition to complete
+     * @param itemTestId data-test-id attribute of navigation item
+     * @param groupTestId data-test-id attribute of navigation item group
+     */
+    goToNavigationPanelItemByTestIds(itemTestId: string, groupTestId?: string): Promise<void>;
+    /**
+     *  Click a Page Header action by its visible label.
+     *
+     * Behavior:
+     * - If the target action is directly visible in the header, click it.
+     * - Otherwise, click the "More" overflow button and then click the target action in the menu.
+     *
+     * This helper does not wait for any subsequent navigation; callers should
+     * await navigation or network idle states as needed.
+     * @param actionToSelect data-test-id attribute of navigation item
+     */
+    clickPageHeaderAction(actionToSelect: string): Promise<void>;
+    /**
+     * This method waits for a page transition to complete while another promise is being resolved.
+     * The two async processes run in parallel inside a `Promise.all` which prevents
+     * problems with race conditions. See: https://playwright.dev/docs/events.
+     *
+     * By convention, mosaic library methods which begin with "navigate" already use this method so it does not need to be used explicitly.
+     *
+     * Example usage:
+     * ```
+     * await uiShell.waitForPageTransition(
+     *  uiWorkflows.list.getRow(1).actionButton.click(),
+     * );
+     * ```
+     */
+    get waitForPageTransition(): (promise: Promise<any>) => Promise<void>;
+    private expandNavigationPanel;
+}
+//# sourceMappingURL=ui-shell-model.d.ts.map

package/dist/esm/ui-selectors/ui-shell-model.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-shell-model.d.ts","sourceRoot":"","sources":["../../../src/ui-selectors/ui-shell-model.ts"],"names":[],"mappings":"AACA,OAAO,EACL,GAAG,EACH,iBAAiB,EACjB,gBAAgB,EAChB,UAAU,EACX,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD;;;;;;;;;GASG;AACH,qBAAa,YAAY;IAErB,kCAAkC;IAClC,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI;;IAD7B,kCAAkC;IACf,IAAI,EAAE,IAAI;IAG/B,uCAAuC;IACvC,QAAQ,CAAC,WAAW,cAA8B;IAElD,kDAAkD;IAClD,QAAQ,CAAC,iBAAiB,oBAAoC;IAE9D,0CAA0C;IAC1C,QAAQ,CAAC,gBAAgB,mBAAmC;IAE5D,4CAA4C;IAC5C,QAAQ,CAAC,kBAAkB,aAA6B;IAExD,qDAAqD;IACrD,QAAQ,CAAC,eAAe,MAAsB;IAE9C,mCAAmC;IACnC,QAAQ,CAAC,eAAe,kBAAkC;IAE1D,sCAAsC;IACtC,QAAQ,CAAC,aAAa,gBAAgC;IAEtD;;;;;;;OAOG;IACG,wBAAwB,IAAI,OAAO,CAAC,IAAI,CAAC;IAY/C;;;;;;;OAOG;IACG,4BAA4B,IAAI,OAAO,CAAC,IAAI,CAAC;IAMnD;;;;;;;OAOG;IACG,2BAA2B,IAAI,OAAO,CAAC,IAAI,CAAC;IAMlD;;;;;;;;OAQG;IACG,yBAAyB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAgB7D;;;;;;;;;;;OAWG;IACG,sBAAsB,CAC1B,UAAU,EAAE,MAAM,EAClB,SAAS,EAAE,MAAM,GAChB,OAAO,CAAC,IAAI,CAAC;IAIhB;;;;;;;;;;;;OAYG;IACG,+BAA+B,CACnC,SAAS,EAAE,MAAM,EACjB,UAAU,CAAC,EAAE,MAAM,GAClB,OAAO,CAAC,IAAI,CAAC;IAIhB;;;;;;;;;;;;;OAaG;IACG,uBAAuB,CAC3B,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,MAAM,EACjB,UAAU,CAAC,EAAE,MAAM,GAClB,OAAO,CAAC,IAAI,CAAC;IAuBhB;;;;;;;;;;;;OAYG;IACG,gCAAgC,CACpC,UAAU,EAAE,MAAM,EAClB,WAAW,CAAC,EAAE,MAAM,GACnB,OAAO,CAAC,IAAI,CAAC;IAuBhB;;;;;;;;;;OAUG;IACG,qBAAqB,CAAC,cAAc,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IA4BlE;;;;;;;;;;;;;OAaG;IACH,IAAI,qBAAqB,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAmBpE;YAEa,qBAAqB;CAWpC"}

package/dist/esm/ui-selectors/ui-shell-model.js

@@ -0,0 +1,265 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { Hub, LandingPageHeader, LandingPageTiles, PageHeader, } from '@axinom/mosaic-e2e-ui-selectors';
+import {} from '@playwright/test';
+import { Breadcrumbs } from './breadcrumbs.js';
+import { NavigationPanel } from './navigation-panel.js';
+import { Notifications } from './toast-notifications.js';
+/**
+ * A model representing the Mosaic UI including methods for navigation.
+ * This model should be used for page and UI components which are provided by Mosaic as a service.
+ *
+ * Use this model to interact with:
+ * - The breadcrumbs bar (on any page)
+ * - The landing page
+ * - The settings hub page
+ * - Pages, settings or mod*a*ls of any managed service (Image, Video, etc)
+ */
+export class UiShellModel {
+    constructor(
+    /** The playwright page object. */
+    page) {
+        this.page = page;
+        /** A model for the breadcrumbs bar. */
+        this.breadcrumbs = new Breadcrumbs(this.page);
+        /** A model for the header on the landing page. */
+        this.landingPageHeader = new LandingPageHeader(this.page);
+        /** A model for the landing page tiles. */
+        this.landingPageTiles = new LandingPageTiles(this.page);
+        /** A model for the settings page header. */
+        this.settingsPageHeader = new PageHeader(this.page);
+        /** A model for the settings pages navigation hub. */
+        this.settingsPageHub = new Hub(this.page);
+        /** A model for navigation panel */
+        this.navigationPanel = new NavigationPanel(this.page);
+        /** A model for toast notifications */
+        this.notifications = new Notifications(this.page);
+    }
+    /**
+     * This method navigates to the landing page breadcrumb.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Click the first (home) breadcrumb
+     * - Wait for a page transition to complete
+     */
+    async navigateToBreadcrumbHome() {
+        const breadcrumb = this.breadcrumbs.getBreadcrumb(1);
+        try {
+            await breadcrumb.waitFor({ state: 'visible' });
+        }
+        catch {
+            throw new Error(`The breadcrumbs home button is not visible. Is the management system loaded and signed in?`);
+        }
+        await this.waitForPageTransition(breadcrumb.click());
+    }
+    /**
+     * This method navigates to the 'previous' breadcrumb.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Click the last-but-one breadcrumb
+     * - Wait for a page transition to complete
+     */
+    async navigateToBreadcrumbPrevious() {
+        const breadcrumb = this.breadcrumbs.getBreadcrumb(-2);
+        await breadcrumb.waitFor({ state: 'visible' });
+        await this.waitForPageTransition(breadcrumb.click());
+    }
+    /**
+     * This method navigates to the 'refresh' breadcrumb.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Click the last breadcrumb
+     * - Wait for a page transition to complete
+     */
+    async navigateToBreadcrumbRefresh() {
+        const breadcrumb = this.breadcrumbs.getBreadcrumb(-1);
+        await breadcrumb.waitFor({ state: 'visible' });
+        await this.waitForPageTransition(breadcrumb.click());
+    }
+    /**
+     * This method navigates to a landing page tile by label.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Navigate to the home breadcrumb (if not already on the landing page)
+     * - Navigate to a tile by label
+     * - Wait for a page transition to complete
+     */
+    async navigateToLandingPageTile(label) {
+        const tile = this.landingPageTiles.getTileByLabel(label);
+        // If there is more than 1 breadcrumb visible then navigate to home
+        if (await this.breadcrumbs.getBreadcrumb(2).isVisible()) {
+            await this.navigateToBreadcrumbHome();
+        }
+        try {
+            await tile.waitFor({ state: 'visible' });
+        }
+        catch {
+            throw new Error(`Landing page tile with label '${label}' is not visible. Is the label correct? Is the service enabled for this environment?`);
+        }
+        await this.waitForPageTransition(tile.click());
+    }
+    /**
+     * This method navigates to a settings page tile by label.
+     * The management system must be loaded & signed in before using this method.
+     *
+     * @deprecated Please use `goToNavigationPanelSettingsItem` instead
+     *
+     * The following steps will be taken:
+     * - Navigate to the home breadcrumb (if not already on the landing page)
+     * - Navigate to the 'Settings' tile
+     * - Navigate to a tile by group label and tile label
+     * - Wait for a page transition to complete
+     */
+    async navigateToSettingsTile(groupLabel, tileLabel) {
+        this.goToNavigationPanelSettingsItem(tileLabel, groupLabel);
+    }
+    /**
+     * Navigates to specified Settings page item using navigation panel
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Navigate to the home breadcrumb (if not already on the landing page)
+     * - Navigate to the Settings category
+     * - In case `groupLabel` is provided navigate to the navigation item group by group label and expand the it
+     * - Navigate to the navigation item by item label
+     * - Wait for a page transition to complete
+     * @param itemLabel Navigation item label
+     * @param groupLabel Label of navigation item group in Settings category, that needs to be expanded
+     */
+    async goToNavigationPanelSettingsItem(itemLabel, groupLabel) {
+        await this.goToNavigationPanelItem('Settings', itemLabel, groupLabel);
+    }
+    /**
+     * Navigates to the specified navigation panel page using Navigation Panel item text
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Expand the menu (if not on a home view where the navigation panel is already visible)
+     * - Navigate to the navigation category by category label
+     * - In case `groupLabel` is provided Navigate to the navigation item group by group label and expand the group
+     * - Navigate to the navigation item by item label
+     * - Wait for a page transition to complete
+     * @param categoryLabel Navigation category label
+     * @param itemLabel Label of navigation item
+     * @param groupLabel Label of navigation item group in category, that needs to be expanded
+     */
+    async goToNavigationPanelItem(categoryLabel, itemLabel, groupLabel) {
+        const category = this.navigationPanel.getCategoryByLabel(categoryLabel);
+        let item;
+        await this.expandNavigationPanel();
+        if (groupLabel) {
+            const group = category.getNavigationItemGroupByLabel(groupLabel);
+            try {
+                await group.expand();
+            }
+            catch {
+                throw new Error(`Navigation panel item '${categoryLabel}>${groupLabel}>${itemLabel}' is not visible. Is the label(s) correct? Is the service enabled for this environment?`);
+            }
+            item = group.getNavItemByLabel(itemLabel);
+        }
+        else {
+            item = category.getNavigationItemByLabel(itemLabel);
+        }
+        await this.waitForPageTransition(item.click());
+    }
+    /**
+     * Navigates to the specified navigation panel page using HTML element attribute `data-test-id`
+     * The management system must be loaded & signed in before using this method.
+     *
+     * The following steps will be taken:
+     * - Expand the menu (if not on a home view where the navigation panel is already visible)
+     * - Navigate to the navigation category by category label
+     * - In case `groupLabel` is provided Navigate to the navigation item group by group label and expand the group
+     * - Navigate to the navigation item by item label
+     * - Wait for a page transition to complete
+     * @param itemTestId data-test-id attribute of navigation item
+     * @param groupTestId data-test-id attribute of navigation item group
+     */
+    async goToNavigationPanelItemByTestIds(itemTestId, groupTestId) {
+        let item;
+        await this.expandNavigationPanel();
+        if (groupTestId) {
+            const group = this.navigationPanel.getNavigationItemGroupById(groupTestId);
+            try {
+                await group.expand();
+            }
+            catch {
+                throw new Error(`Navigation panel item '${groupTestId}>${itemTestId}' is not visible. Is the label(s) correct? Is the service enabled for this environment?`);
+            }
+            item = group.getNavItemById(itemTestId);
+        }
+        else {
+            item = this.navigationPanel.getNavigationItemById(itemTestId);
+        }
+        await this.waitForPageTransition(item.click());
+    }
+    /**
+     *  Click a Page Header action by its visible label.
+     *
+     * Behavior:
+     * - If the target action is directly visible in the header, click it.
+     * - Otherwise, click the "More" overflow button and then click the target action in the menu.
+     *
+     * This helper does not wait for any subsequent navigation; callers should
+     * await navigation or network idle states as needed.
+     * @param actionToSelect data-test-id attribute of navigation item
+     */
+    async clickPageHeaderAction(actionToSelect) {
+        if (await this.page
+            .locator(`//div[contains(@class, 'PageHeaderAction_label')]/span[@data-test-id='label' and normalize-space(.)='${actionToSelect}']`)
+            .isVisible()) {
+            await this.page
+                .locator(`//div[contains(@class, 'PageHeaderAction_label')]/span[@data-test-id='label' and normalize-space(.)='${actionToSelect}']`)
+                .dblclick();
+        }
+        else {
+            await this.page
+                .locator("//button[@data-test-id='action']//span[@data-test-id='label' and normalize-space(.)='More']")
+                .nth(1)
+                .dblclick();
+            await this.page
+                .locator(`//div[contains(@class, 'PageHeaderAction_label')]/span[@data-test-id='label' and normalize-space(.)='${actionToSelect}']`)
+                .dblclick();
+        }
+    }
+    /**
+     * This method waits for a page transition to complete while another promise is being resolved.
+     * The two async processes run in parallel inside a `Promise.all` which prevents
+     * problems with race conditions. See: https://playwright.dev/docs/events.
+     *
+     * By convention, mosaic library methods which begin with "navigate" already use this method so it does not need to be used explicitly.
+     *
+     * Example usage:
+     * ```
+     * await uiShell.waitForPageTransition(
+     *  uiWorkflows.list.getRow(1).actionButton.click(),
+     * );
+     * ```
+     */
+    get waitForPageTransition() {
+        const animationActive = this.page.locator('//*[contains(@class, "animate-forward-enter-active") or contains(@class, "animate-backward-enter-active") or contains(@class, "animate-none-enter-active")]');
+        const animationDone = this.page.locator('//*[contains(@class, "animate-forward-enter-done") or contains(@class, "animate-backward-enter-done") or contains(@class, "animate-none-enter-done")]');
+        // The method is a getter, because we need to make sure this promise is started first (see https://playwright.dev/docs/events):
+        // Wait for the animation-active marker then the animation-done marker
+        const firstPromise = animationActive
+            .waitFor({ state: 'attached' })
+            .then(() => animationDone.waitFor({ state: 'attached' }));
+        // After starting that promise, we return a function which will accept the second promise as an argument
+        return async (promise) => {
+            // await both promises in `Promise.all`
+            await Promise.all([firstPromise, promise]);
+        };
+    }
+    async expandNavigationPanel() {
+        const expandMenuButton = this.page.locator(`//*[@data-test-id="hamburger-menu-button"]`);
+        // If expand menu button visible (not on a home view), expand the menu
+        if (await expandMenuButton.isEnabled()) {
+            expandMenuButton.click();
+            await this.navigationPanel.panel.waitFor({ state: 'visible' });
+        }
+    }
+}
+//# sourceMappingURL=ui-shell-model.js.map

package/dist/esm/ui-selectors/ui-shell-model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-shell-model.js","sourceRoot":"","sources":["../../../src/ui-selectors/ui-shell-model.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axinom/mosaic-e2e-page-model",
-  "version": "0.17.12",
+  "version": "0.17.13-rc.3",
   "description": "A page model for testing an Axinom Mosaic Management System with Playwright.",
   "author": "Axinom",
   "license": "PROPRIETARY",
@@ -13,17 +13,28 @@
     "dist",
     "src"
   ],
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/cjs/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/cjs/index.d.ts",
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
+    },
+    "./package.json": "./package.json"
+  },
   "scripts": {
     "clean": "rimraf dist",
-    "build": "yarn clean && tsc",
+    "build": "yarn clean && tsc --project tsconfig.build.json && tsc --project tsconfig.build.esm.json && node ../../scripts/write-esm-markers.js",
     "build:ci": "yarn workspaces focus && yarn build",
-    "lint": "eslint . --ext .ts,.tsx,.js --color --cache",
-    "dev": "tsc -w"
+    "ts:validate": "tsc && yarn build && yarn check:esm-interop",
+    "check:esm-interop": "node ./scripts/check-esm-interop.mjs",
+    "dev": "tsc -w --project tsconfig.build.json",
+    "lint": "eslint . --ext .ts,.tsx,.js --color --cache"
   },
   "dependencies": {
-    "@axinom/mosaic-e2e-ui-selectors": "^0.16.9"
+    "@axinom/mosaic-e2e-ui-selectors": "^0.16.10-rc.3"
   },
   "devDependencies": {
     "@playwright/test": "1.58.0",
@@ -36,5 +47,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "98e66a89515085442669171be27025b926104ab2"
+  "gitHead": "9c7831acd6fcced9a09f97ffd4c9d67ee1b3b640"
 }

package/src/index.ts

@@ -1,5 +1,5 @@
-export * from './managed-services';
-export * from './page-model';
-export * from './service-model';
-export * from './sign-in';
-export * from './ui-selectors';
+export * from './managed-services/index.js';
+export * from './page-model.js';
+export * from './service-model.js';
+export * from './sign-in/index.js';
+export * from './ui-selectors/index.js';