[ACS-4697] Fix Playwright Paginations (#3012)

e2e/playwright/shared/page-objects/components/dataTable/data-table.component.ts

@@ -9,6 +9,7 @@
 import { Locator, Page } from '@playwright/test';
 import { BaseComponent } from '../base.component';
 import { MatMenuComponent } from './mat-menu.component';
+import { PaginationActionsType, PaginationComponent } from '../pagination.component';
 
 export class DataTableComponent extends BaseComponent {
   private static rootElement = 'adf-datatable';
@@ -18,6 +19,7 @@ export class DataTableComponent extends BaseComponent {
     super(page, rootElement);
   }
 
+  public pagination = new PaginationComponent(this.page);
   getEmptyFolderLocator = this.getChild('.adf-empty-folder');
   getEmptyContentTitleLocator = this.getChild('adf-empty-content .adf-empty-content__title');
   getEmptyContentSubTitleLocator = this.getChild('adf-empty-content .adf-empty-content__subtitle');
@@ -115,6 +117,7 @@ export class DataTableComponent extends BaseComponent {
    * @param action provide which action you want to perform
    */
   async performActionFromExpandableMenu(name: string | number, action: string): Promise<void> {
+    await this.goThroughPagesLookingForRowWithName(name);
     const actionButtonLocator = await this.getActionLocatorFromExpandableMenu(name, action);
     await actionButtonLocator.click();
     await this.spinnerWaitForReload();
@@ -140,4 +143,25 @@ export class DataTableComponent extends BaseComponent {
     await this.getRowByName(name).click({ button: 'right' });
     return this.contextMenuActions.getButtonByText(action);
   }
+
+  async goThroughPagesLookingForRowWithName(name: string | number): Promise<void> {
+    await this.spinnerWaitForReload();
+    if (await this.getRowByName(name).isVisible()) {
+      return null;
+    }
+
+    if ((await this.pagination.currentPageLocator.textContent()) !== ' Page 1 ') {
+      await this.pagination.navigateToPage(1);
+    }
+
+    const maxPages = (await this.pagination.totalPageLocator.textContent()).match(/\d/)[0];
+    for (let page = 1; page <= Number(maxPages); page++) {
+      if (await this.getRowByName(name).isVisible()) {
+        break;
+      }
+      await this.pagination.getArrowLocatorFor(PaginationActionsType.NextPageSelector).isEnabled();
+      await this.pagination.getArrowLocatorFor(PaginationActionsType.NextPageSelector).click();
+      await this.spinnerWaitForReload();
+    }
+  }
 }

e2e/playwright/shared/page-objects/components/mat-menu.component.ts

@@ -0,0 +1,23 @@
+/*
+ * Copyright © 2005 - 2023 Alfresco Software, Ltd. All rights reserved.
+ *
+ * License rights for this program may be obtained from Alfresco Software, Ltd.
+ * pursuant to a written agreement and any use of this program without such an
+ * agreement is prohibited.
+ */
+
+import { Page } from '@playwright/test';
+import { BaseComponent } from './base.component';
+
+export class MatMenuComponent extends BaseComponent {
+  private static rootElement = '.mat-menu-content';
+
+  constructor(page: Page) {
+    super(page, MatMenuComponent.rootElement);
+  }
+
+  public getMenuItemsLocator = this.getChild('button');
+  public getMenuItemTextLocator = this.getChild('[data-automation-id="menu-item-title"]');
+
+  public getButtonByText = (text: string) => this.getChild('button', { hasText: text });
+}

e2e/playwright/shared/page-objects/components/pagination.component.ts

@@ -0,0 +1,52 @@
+/*
+ * Copyright © 2005 - 2023 Alfresco Software, Ltd. All rights reserved.
+ *
+ * License rights for this program may be obtained from Alfresco Software, Ltd.
+ * pursuant to a written agreement and any use of this program without such an
+ * agreement is prohibited.
+ */
+
+import { BaseComponent } from './base.component';
+import { Page } from '@playwright/test';
+import { MatMenuComponent } from './mat-menu.component';
+
+export enum PaginationActionsType {
+  PageSizeSelector = 'Page size selector',
+  CurrentPageSelector = 'Current page selector',
+  NextPageSelector = 'Next page button'
+}
+
+export class PaginationComponent extends BaseComponent {
+  private static rootElement = 'adf-pagination';
+
+  constructor(page: Page) {
+    super(page, PaginationComponent.rootElement);
+  }
+
+  private itemsPerPageMenu = new MatMenuComponent(this.page);
+
+  public currentPageLocator = this.getChild('.adf-pagination__current-page');
+  public totalPageLocator = this.getChild('.adf-pagination__total-pages');
+  public getArrowLocatorFor = (action: PaginationActionsType) => this.getChild(`[aria-label="${action}"]`);
+
+  async setItemsPerPage(amount: number): Promise<void> {
+    await this.getArrowLocatorFor(PaginationActionsType.PageSizeSelector).click();
+    await this.itemsPerPageMenu.getButtonByText(amount.toString()).click();
+    await this.spinnerWaitForReload();
+  }
+
+  async navigateToPage(pageNumber: number): Promise<void> {
+    await this.getArrowLocatorFor(PaginationActionsType.CurrentPageSelector).click();
+    await this.itemsPerPageMenu.getButtonByText(pageNumber.toString()).click();
+    await this.spinnerWaitForReload();
+  }
+
+  async spinnerWaitForReload(): Promise<void> {
+    try {
+      await this.page.locator('mat-progress-spinner').waitFor({ state: 'attached', timeout: 2000 });
+      await this.page.locator('mat-progress-spinner').waitFor({ state: 'detached', timeout: 2000 });
+    } catch (e) {
+      this.logger.info('Spinner was not present');
+    }
+  }
+}