[AAE-7160] Setup Playwright in ADF - Storybook testing (#7537)

* [AAE-7160] Setup Playwright in ADF - Storybook testing

* New test cases for groups component. Reorganize the files

* Add to package.json scripts - npm run playwright

* Change amount of workers

* Change workesr to 2

e2e-playwright/page-object/components/base.component.ts

@@ -0,0 +1,31 @@
+/*
+ * Copyright © 2005 - 2021 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 { Locator, Page } from '@playwright/test';
+import { PlaywrightBase } from '../playwright-base';
+
+export abstract class BaseComponent extends PlaywrightBase {
+    private rootElement: string;
+
+    constructor(page: Page,rootElement: string) {
+        super(page);
+        this.rootElement = rootElement;
+    }
+
+    /**
+     * Method which should be used across the repository, while creating
+     * reference to elements, which are in root element of component.
+     * @param cssLocator css selector as String. Need to be in the tree under the root element
+     * @param options if you want to localize it by text, then provide an optional hasText
+     * @returns Locator object
+     */
+     getChild(cssLocator: string, options?: { hasText: string | RegExp }): Locator {
+        return this.page.locator(`${this.rootElement} ${cssLocator}`, options);
+    }
+
+}

e2e-playwright/page-object/components/basic/error.component.ts

@@ -0,0 +1,19 @@
+/*
+ * Copyright © 2005 - 2021 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 ErrorComponent extends BaseComponent {
+    private static rootElement = 'mat-error';
+    public content = this.getChild('');
+
+    constructor(page: Page) {
+        super(page, ErrorComponent.rootElement);
+    }
+}

e2e-playwright/page-object/components/basic/index.ts

@@ -0,0 +1,11 @@
+/*
+ * Copyright © 2005 - 2021 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.
+ */
+
+export * from './error.component';
+export * from './listbox.component';
+export * from './validation.component';

e2e-playwright/page-object/components/basic/listbox.component.ts

@@ -0,0 +1,20 @@
+/*
+ * Copyright © 2005 - 2021 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 ListboxComponent extends BaseComponent {
+    private static rootElement = 'div[role=listbox]';
+    public allOptions = this.getChild('');
+    public oneOption = this.getChild('span >> span');
+
+    constructor(page: Page) {
+        super(page, ListboxComponent.rootElement);
+    }
+}

e2e-playwright/page-object/components/basic/validation.component.ts

@@ -0,0 +1,19 @@
+/*
+ * Copyright © 2005 - 2021 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 TooltipComponent extends BaseComponent {
+    private static rootElement = 'mat-tooltip-component';
+    public content = this.getChild('div');
+
+    constructor(page: Page) {
+        super(page, TooltipComponent.rootElement);
+    }
+}

e2e-playwright/page-object/components/index.ts

@@ -0,0 +1,10 @@
+/*
+ * Copyright © 2005 - 2021 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.
+ */
+
+export * from './basic';
+export * from './base.component';

e2e-playwright/page-object/index.ts

@@ -0,0 +1,10 @@
+/*
+ * Copyright © 2005 - 2021 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.
+ */
+
+export * from './components';
+export * from './stories/base.storie';

e2e-playwright/page-object/playwright-base.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright © 2005 - 2021 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';
+
+export abstract class PlaywrightBase {
+    public page: Page;
+
+    constructor(page: Page) {
+        this.page = page;
+    }
+}

e2e-playwright/page-object/stories/base.storie.ts

@@ -0,0 +1,30 @@
+/*
+ * Copyright © 2005 - 2021 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 { timeouts } from '../../utils/timeouts';
+import { ComponentTitles } from '../../models/component-titles.model';
+import { PlaywrightBase } from '../playwright-base';
+
+interface NavigateParameters { componentName: string; story: string };
+
+export class BaseStories extends PlaywrightBase {
+    private rootComponentTitle: string;
+
+    constructor(page: Page, rootComponentTitle: ComponentTitles) {
+        super(page);
+        this.rootComponentTitle = rootComponentTitle;
+    }
+
+    async navigateTo({ componentName, story }: NavigateParameters): Promise<void> {
+        await this.page.goto(`/iframe.html?id=${this.rootComponentTitle}-components-${componentName}--${story}`, {
+            waitUntil: 'networkidle',
+            timeout: timeouts.large
+        });
+    }
+}