Playwright e2e page objects

build/integration/Jenkinsfile

@@ -21,12 +21,12 @@ pipeline {
           docker.build('node-webtest', '-f build/integration/Dockerfile .').inside {
             sh 'yarn update:axonivy:next'
             sh 'yarn install'
-            dir ('integration/standalone/glsp-test-project') {
+            dir ('playwright/glsp-test-project') {
               maven cmd: "-ntp verify -Dengine.page.url=${params.engineSource}"
             }
           }
-          archiveArtifacts artifacts: 'integration/standalone/test-results/**', allowEmptyArchive: true
-          archiveArtifacts artifacts: 'integration/standalone/glsp-test-project/target/**/ivy.log', allowEmptyArchive: true
+          archiveArtifacts artifacts: 'playwright/test-results/**', allowEmptyArchive: true
+          archiveArtifacts artifacts: 'playwright/glsp-test-project/target/**/ivy.log', allowEmptyArchive: true
           withChecks('Integration WebTest') {
             junit testDataPublishers: [[$class: 'StabilityTestDataPublisher']], testResults: 'node_modules/**/report.xml'
           }

integration/standalone/.eslintrc.cjs

@@ -1,7 +1,7 @@
 /** @type {import('eslint').Linter.Config} */
 module.exports = {
   extends: ['../../configs/base.eslintrc.json', '../../configs/warnings.eslintrc.json', '../../configs/errors.eslintrc.json'],
-  ignorePatterns: ['**/{css,node_modules,lib}', 'vite.*.js', 'playwright.config.ts'],
+  ignorePatterns: ['**/{css,node_modules,lib}', 'vite.*.js'],
   parserOptions: {
     tsconfigRootDir: __dirname,
     project: 'tsconfig.json'

integration/standalone/package.json

@@ -15,7 +15,6 @@
     "@eclipse-glsp/client": "1.1.0-RC10"
   },
   "devDependencies": {
-    "@playwright/test": "1.38.1",
     "@types/uuid": "^9.0.7",
     "@vscode/codicons": "^0.0.25",
     "path-browserify": "^1.0.1",
@@ -28,12 +27,11 @@
   "type": "module",
   "scripts": {
     "clean": "rimraf lib build/* tsconfig.tsbuildinfo",
-    "lint": "eslint --ext .ts,.tsx ./src ./webtests",
+    "lint": "eslint --ext .ts,.tsx ./src",
     "lint:fix": "eslint --fix --ext .ts,.tsx ./src",
     "type": "tsc --noEmit",
     "build": "tsc --build",
     "build:production": "yarn type && vite build",
-    "webtest": "playwright test",
     "start": "vite"
   }
 }

integration/standalone/src/app.ts

@@ -1,36 +1,21 @@
 import {
-  Action,
-  CenterAction,
   configureServerActions,
   EnableToolPaletteAction,
   GLSPActionDispatcher,
   GLSPDiagramServer,
   listen,
+  NavigationTarget,
   RequestModelAction,
   RequestTypeHintsAction,
   SelectAction,
   TYPES
 } from '@eclipse-glsp/client';
-import { ApplicationIdProvider, GLSPClient, NavigationTarget } from '@eclipse-glsp/protocol';
-import {
-  IvyBaseJsonrpcGLSPClient,
-  ivyToolBarModule,
-  IVY_TYPES,
-  overrideIvyViewerOptions,
-  SwitchThemeActionHandler,
-  ToolBar
-} from '@axonivy/process-editor';
+import { ApplicationIdProvider, GLSPClient } from '@eclipse-glsp/protocol';
+import { IvyBaseJsonrpcGLSPClient, SwitchThemeActionHandler } from '@axonivy/process-editor';
 import { MessageConnection } from 'vscode-jsonrpc';
 import createContainer from './di.config';
-import { getParameters, getServerDomain, isInPreviewMode, isInViewerMode, isReadonly, isSecureConnection } from './url-helper';
-import {
-  EnableInscriptionAction,
-  EnableViewportAction,
-  MoveIntoViewportAction,
-  SetViewportZoomAction,
-  SwitchThemeAction,
-  ThemeMode
-} from '@axonivy/process-editor-protocol';
+import { getParameters, getServerDomain, isReadonly, isSecureConnection } from './url-helper';
+import { EnableInscriptionAction, EnableViewportAction, SwitchThemeAction, ThemeMode } from '@axonivy/process-editor-protocol';
 import { MonacoUtil } from '@axonivy/inscription-core';
 import { MonacoEditorUtil } from '@axonivy/inscription-editor';
 import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
@@ -52,9 +37,7 @@ const container = createContainer();
 const pmv = parameters.get('pmv') ?? '';
 const pid = parameters.get('pid') ?? '';
 const givenFile = parameters.get('file') ?? '';
-const highlight = parameters.get('highlight') ?? '';
 const selectElementIds = parameters.get('selectElementIds');
-const zoom = parameters.get('zoom') ?? '';
 const theme = (parameters.get('theme') as ThemeMode) ?? SwitchThemeActionHandler.prefsColorScheme();
 
 const diagramServer = container.get<GLSPDiagramServer>(TYPES.ModelSource);
@@ -76,56 +59,23 @@ async function initialize(connectionProvider: MessageConnection): Promise<void>
   actionDispatcher
     .dispatch(
       RequestModelAction.create({
-        options: { sourceUri: givenFile, app: app, pmv: pmv, pid: pid, highlight: highlight, readonly: isReadonly(), diagramType }
+        options: { sourceUri: givenFile, app: app, pmv: pmv, pid: pid, readonly: isReadonly(), diagramType }
       })
     )
-    .then(() => dispatchAfterModelInitialized(actionDispatcher))
-    .then(() => actionDispatcher.dispatch(RequestTypeHintsAction.create({ requestId: diagramType })))
     .then(() => {
-      if (isInViewerMode() || isInPreviewMode()) {
-        setViewerMode();
-      } else {
-        actionDispatcher.dispatch(EnableToolPaletteAction.create());
+      actionDispatcher.onceModelInitialized().finally(() => {
         MonacoUtil.initStandalone(editorWorker).then(() => MonacoEditorUtil.initMonaco(reactMonaco, theme));
         actionDispatcher.dispatch(EnableInscriptionAction.create({ server: webSocketBase, app, pmv }));
-      }
-      if (!isInPreviewMode()) {
-        actionDispatcher.dispatch(EnableViewportAction.create());
-      }
+        if (selectElementIds) {
+          const elementIds = selectElementIds.split(NavigationTarget.ELEMENT_IDS_SEPARATOR);
+          actionDispatcher.dispatch(SelectAction.create({ selectedElementsIDs: elementIds }));
+        }
+      });
     });
-}
-
-async function dispatchAfterModelInitialized(dispatcher: GLSPActionDispatcher): Promise<void> {
-  const actions: Action[] = [];
-  if (isNumeric(zoom)) {
-    actions.push(SetViewportZoomAction.create({ zoom: +zoom / 100 }));
-    actions.push(...showElement((ids: string[]) => CenterAction.create(ids, { animate: false, retainZoom: true })));
-  } else {
-    actions.push(...showElement((ids: string[]) => MoveIntoViewportAction.create({ elementIds: ids, animate: false, retainZoom: true })));
-  }
-  actions.push(SwitchThemeAction.create({ theme }));
-  return dispatcher.onceModelInitialized().finally(() => dispatcher.dispatchAll(actions));
-}
-
-function showElement(action: (elementIds: string[]) => Action): Action[] {
-  if (highlight) {
-    return [action([highlight])];
-  }
-  if (selectElementIds) {
-    const elementIds = selectElementIds.split(NavigationTarget.ELEMENT_IDS_SEPARATOR);
-    return [SelectAction.create({ selectedElementsIDs: elementIds }), action(elementIds)];
-  }
-  return [];
-}
-
-function isNumeric(num: any): boolean {
-  return !isNaN(parseFloat(num)) && isFinite(num);
-}
-
-function setViewerMode(): void {
-  container.get<ToolBar>(IVY_TYPES.ToolBar).disable();
-  container.unload(ivyToolBarModule);
-  overrideIvyViewerOptions(container, { hideSensitiveInfo: true });
+  actionDispatcher.dispatch(RequestTypeHintsAction.create({ requestId: diagramType }));
+  actionDispatcher.dispatch(EnableToolPaletteAction.create());
+  actionDispatcher.dispatch(EnableViewportAction.create());
+  actionDispatcher.dispatch(SwitchThemeAction.create({ theme }));
 }
 
 websocket.onerror = ev => alert('Connection to server errored. Please make sure that the server is running');

integration/standalone/src/url-helper.ts

@@ -12,15 +12,7 @@ export function isSecureConnection(): boolean {
 }
 
 export function isReadonly(): boolean {
-  return getParameters().get('readonly') === 'true' || isInViewerMode() || isInPreviewMode();
-}
-
-export function isInViewerMode(): boolean {
-  return getParameters().get('mode') === 'viewer';
-}
-
-export function isInPreviewMode(): boolean {
-  return getParameters().get('mode') === 'preview';
+  return getParameters().get('readonly') === 'true';
 }
 
 export function getParameters() {

integration/standalone/tsconfig.json

@@ -2,11 +2,11 @@
   "extends": "../../configs/tsconfig.integration.json",
   "compilerOptions": {
     "rootDir": ".",
-    "rootDirs": ["src", "webtests"],
+    "rootDirs": ["src"],
     "outDir": "lib",
     "noImplicitAny": false
   },
-  "include": ["src", "webtests"],
+  "include": ["src"],
   "references": [
     { "path": "../../packages/inscription/tsconfig.json" },
     { "path": "../../packages/editor/tsconfig.json" }