tests(Playwright): Introduction of Page Object Models (POMs) to Playwright tests (#5557)

tests/utils/fixture.ts

@@ -0,0 +1,18 @@
+import { test as base } from 'playwright-test-coverage';
+import { MainToolbarPageObject, ViewportPageObject } from '../pages';
+
+type PageObjects = {
+  mainToolbarPageObject: MainToolbarPageObject;
+  viewportPageObject: ViewportPageObject;
+};
+
+export const test = base.extend<PageObjects>({
+  mainToolbarPageObject: async ({ page }, use) => {
+    await use(new MainToolbarPageObject(page));
+  },
+  viewportPageObject: async ({ page }, use) => {
+    await use(new ViewportPageObject(page));
+  },
+});
+
+export { expect } from 'playwright-test-coverage';

tests/utils/index.ts

@@ -7,6 +7,7 @@ import {
   simulateNormalizedClickOnElement,
   simulateNormalizedClicksOnElement,
 } from './simulateClicksOnElement';
+import { simulateNormalizedDragOnElement } from './simulateDragOnElement';
 import { reduce3DViewportSize } from './reduce3DviewportSize';
 import { getMousePosition, initializeMousePositionTracker } from './mouseUtils';
 import { getSUV } from './getSUV';
@@ -15,6 +16,7 @@ import { clearAllAnnotations } from './clearAllAnnotations';
 import { scrollVolumeViewport } from './scrollVolumeViewport';
 import { attemptAction } from './attemptAction';
 import { addLengthMeasurement } from './addLengthMeasurement';
+import { test, expect } from './fixture';
 
 export {
   visitStudy,
@@ -24,6 +26,7 @@ export {
   simulateDoubleClickOnElement,
   simulateNormalizedClickOnElement,
   simulateNormalizedClicksOnElement,
+  simulateNormalizedDragOnElement,
   reduce3DViewportSize,
   getMousePosition,
   initializeMousePositionTracker,
@@ -33,4 +36,6 @@ export {
   scrollVolumeViewport,
   attemptAction,
   addLengthMeasurement,
+  test,
+  expect,
 };

tests/utils/locators.ts

@@ -1,31 +0,0 @@
-import { Locator, Page } from '@playwright/test';
-
-export const viewportLocator = ({
-  page,
-  viewportId,
-}: {
-  page: Page;
-  viewportId: string;
-}): Locator => {
-  return page.locator(`css=div[data-viewportid="${viewportId}"]`);
-};
-
-export const viewportSVGLocator = ({
-  page,
-  viewportId,
-}: {
-  page: Page;
-  viewportId: string;
-}): Locator => {
-  return page.locator(`css=div[data-viewportid="${viewportId}"] svg`);
-};
-
-export const viewportSVGPathLocator = ({
-  page,
-  viewportId,
-}: {
-  page: Page;
-  viewportId: string;
-}): Locator => {
-  return page.locator(`css=div[data-viewportid="${viewportId}"] svg path`);
-};