test(e2e): added new cases

e2e/playwright.config.ts

@@ -28,7 +28,7 @@ export default defineConfig({
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
-    // baseURL: 'http://127.0.0.1:3000',
+    baseURL: 'https://d2ojv9ksm0gp58.cloudfront.net',
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'on-first-retry',
@@ -45,10 +45,4 @@ export default defineConfig({
     },
   ],
 
-  /* Run your local dev server before starting the tests */
-  // webServer: {
-  //   command: 'npm run start',
-  //   url: 'http://127.0.0.1:3000',
-  //   reuseExistingServer: !process.env.CI,
-  // },
 });

e2e/tests/base/base.po.ts

@@ -0,0 +1,8 @@
+import { Page } from '@playwright/test';
+
+export class BasePage {
+
+  constructor(protected page: Page) {}
+
+  public goto = (adress: string) => this.page.goto(adress);
+}

e2e/tests/dashboart-filter/dashboard-filter-panel.po.ts

@@ -0,0 +1,9 @@
+import { BasePage } from '../base/base.po';
+
+export class DashboartFilterpanelPage extends BasePage {
+  public readonly pageAdress = '/dashboard-filter-panel';
+
+
+  public gotoMainPage = async () => await this.goto(this.pageAdress);
+  public weightedPipelineValue = () => this.page.getByText('Weighted pipeline value (€)', {exact: true}).first();
+}

e2e/tests/dashboart-filter/dashboard-filter-panel.spec.ts

@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test';
+import { DashboartFilterpanelPage } from './dashboard-filter-panel.po';
+
+test.describe('Dashboard filter panel page', () => {
+  test('should have working initial screen', async ({ page }) => {
+    // given
+    const dashboartFilterpanelPage = new DashboartFilterpanelPage(page);
+
+    // when
+    await dashboartFilterpanelPage.gotoMainPage();
+    await dashboartFilterpanelPage.weightedPipelineValue().waitFor({ state: 'visible' });
+
+    // then
+    await expect(page).toHaveScreenshot('init-page.png', { maxDiffPixelRatio: 0.1, fullPage: true});
+  });
+});

e2e/tests/drag-n-drop-chart-library/drag-n-drop-chart-library.po.ts

@@ -0,0 +1,7 @@
+import { BasePage } from '../base/base.po';
+
+export class DragNDropChartLibraryPage extends BasePage {
+  public readonly pageAdress = '/drag-n-drop-chart-library';
+
+  public gotoMainPage = async () => await this.goto(this.pageAdress);
+}

e2e/tests/drag-n-drop-chart-library/drag-n-drop-chart-library.spec.ts

@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test';
+import { DragNDropChartLibraryPage } from './drag-n-drop-chart-library.po';
+
+test.describe('Drag and drop page', () => {
+  test('should have working initial screen', async ({ page }) => {
+    // given
+    const dragNDropChartLibraryPage = new DragNDropChartLibraryPage(page);
+
+    // when
+    await dragNDropChartLibraryPage.gotoMainPage();
+
+    // then
+    await expect(page).toHaveScreenshot('init-page.png', { maxDiffPixelRatio: 0.1, fullPage: true});
+  });
+});
+

e2e/tests/report-builder/report-builder.po.ts

@@ -1,16 +1,10 @@
-import { Page } from '@playwright/test';
+import { BasePage } from '../base/base.po';
 
-export class ReportBuilderPage {
-  /**
-   * @todo: Extract to config file
-   */
-  public readonly URL = 'https://d2ojv9ksm0gp58.cloudfront.net/report-builder/';
+export class ReportBuilderPage extends BasePage {
+  public readonly pageAdress = '/report-builder/';
 
-  constructor(
-    private page: Page,
-  ) {}
-
-  public gotoMainPage = () => this.page.goto(this.URL);
+  public gotoMainPage = async () => await this.goto(this.pageAdress);
+
   public tableContainer = () => this.page.locator('.regular-table-container');
   public chartOneBar = () => this.page.locator('.bars-container .bar').first();
-}
+}

e2e/tests/report-builder/report-builder.spec.ts

@@ -1,5 +1,5 @@
 import { test, expect } from '@playwright/test';
-import { ReportBuilderPage } from './report-builder.po';
+import { ReportBuilderPage } from './report-builder.po.ts';
 
 test.describe('Report builder', () => {
   test('should have working initial screen', async ({ page }) => {
@@ -12,6 +12,6 @@ test.describe('Report builder', () => {
     await reportBuilderPage.chartOneBar().waitFor({ state: 'visible' });
 
     // then
-    await expect(page).toHaveScreenshot('init-page.png', { threshold: 0.35 });
+    await expect(page).toHaveScreenshot('init-page.png', { maxDiffPixelRatio: 0.1, fullPage: true});
   });
 });

e2e/tests/wearables-dashboard/wearables-dashboard.po.ts

@@ -0,0 +1,8 @@
+import { BasePage } from '../base/base.po';
+
+export class WearablesDashboardPage extends BasePage {
+  public readonly pageAdress = '/wearables-dashboard';
+
+  public gotoMainPage = async () => await this.goto(this.pageAdress);
+  public NumberOfStepsChart = () => this.page.getByText('Number of steps by minute', {exact: true});
+}

e2e/tests/wearables-dashboard/wearables-dashboard.spec.ts

@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test';
+import { WearablesDashboardPage } from '../wearables-dashboard/wearables-dashboard.po';
+
+test.describe('Wearables dashboard', () => {
+  test('should have working initial screen', async ({ page }) => {
+    // given
+    const wearablesDashboardPage = new WearablesDashboardPage(page);
+
+    // when
+    await wearablesDashboardPage.gotoMainPage();
+    await wearablesDashboardPage.NumberOfStepsChart().waitFor({ state: 'visible' });
+
+    // then
+    await expect(page).toHaveScreenshot('init-page.png', { maxDiffPixelRatio: 0.1, fullPage: true});
+  });
+});