Update project and implement select tests

.eslintrc.js

@@ -7,14 +7,6 @@ module.exports = {
         tsconfigRootDir: __dirname,
         project: 'tsconfig.eslint.json'
     },
-    settings: {
-        // Necessary for aliasing paths: https://www.typescriptlang.org/tsconfig#paths
-        'import/resolver': {
-            typescript: {
-                project: ['packages/glsp-playwright/tsconfig.json', 'tsconfig.json']
-            }
-        }
-    },
     rules: {
         'no-null/no-null': 'off', // Accessing the browser DOM returns "null" instead of "undefined"
         'no-restricted-imports': [

.vscode/settings.json

@@ -6,8 +6,8 @@
 {
   "editor.formatOnSave": true,
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true,
-    "source.organizeImports": true
+    "source.fixAll.eslint": "explicit",
+    "source.organizeImports": "explicit"
   },
   "eslint.validate": ["javascript", "typescript"],
   "search.exclude": {

examples/workflow-test/.env.example

@@ -1,6 +1,6 @@
-# For Theia and VSCode instances
-GLSP_SERVER_DEBUG="true"
-GLSP_SERVER_PORT="8081"
+GLSP_SERVER_DEBUG="true" # For Theia and VSCode instances to connect to an external server
+GLSP_SERVER_PORT="8081" 
+GLSP_SERVER_PLAYWRIGHT_MANAGED="true" # To allow Playwright to manage/start the server 
 GLSP_WEBSOCKET_PATH="workflow"
 
 # Configurations

examples/workflow-test/README.md

@@ -2,6 +2,40 @@
 
 This package contains code examples that demonstrate how to test diagram editors using the [Graphical Language Server Platform (GLSP)](https://github.com/eclipse-glsp/glsp).
 
+<details>
+  <summary>Expand test list</summary>
+
+| Feature                                                                              |      Standalone      | Theia Integration | Eclipse Integration | VS Code Integration |
+| ------------------------------------------------------------------------------------ | :------------------: | :---------------: | :-----------------: | :-----------------: |
+| Model Saving                                                                         |          -           |         -         |          -          |          -          |
+| Model Dirty State                                                                    |                      |         -         |          -          |          -          |
+| Model SVG Export                                                                     |          -           |         -         |          -          |          -          |
+| Model Layout                                                                         |          -           |         -         |          -          |          -          |
+| Restoring viewport on re-open                                                        |                      |         -         |                     |                     |
+| Model Edit Modes<br>- Edit<br>- Read-only                                            |   <br>-<br>-&nbsp;   |    <br>-<br>-     |   <br>-<br>&nbsp;   |  <br>-<br>-&nbsp;   |
+| Client View Port<br>- Center<br>- Fit to Screen                                      |      <br>-<br>-      |    <br>-<br>-     |     <br>-<br>-      |     <br>-<br>-      |
+| Client Status Notification                                                           |          -           |         -         |          -          |          -          |
+| Client Message Notification                                                          |          -           |         -         |                     |          -          |
+| Client Progress Reporting                                                            |                      |         -         |                     |          -          |
+| Element Selection                                                                    |          ✓           |         ✓         |          -          |          ✓          |
+| Element Hover                                                                        |          -           |         -         |          -          |          -          |
+| Element Validation                                                                   |          -           |         -         |          -          |          -          |
+| Element Navigation                                                                   |                      |         -         |          -          |          -          |
+| Element Type Hints                                                                   |          -           |         -         |          -          |          -          |
+| Element Creation and Deletion                                                        |          -           |         -         |          -          |          -          |
+| Node Change Bounds<br>- Move<br>- Resize                                             |      <br>-<br>-      |    <br>-<br>-     |     <br>-<br>-      |     <br>-<br>-      |
+| Node Change Container                                                                |          -           |         -         |          -          |          -          |
+| Edge Reconnect                                                                       |          -           |         -         |          -          |          -          |
+| Edge Routing Points                                                                  |          -           |         -         |          -          |          -          |
+| Ghost Elements                                                                       |          -           |         -         |          -          |          -          |
+| Element Text Editing                                                                 |          -           |         -         |          -          |          -          |
+| Clipboard (Cut, Copy, Paste)                                                         |          -           |         -         |          -          |          -          |
+| Undo / Redo                                                                          |          -           |         -         |          -          |          -          |
+| Contexts<br>- Context Menu<br>- Command Palette<br>- Tool Palette                    |    <br><br>-<br>-    |  <br>-<br>-<br>-  |   <br><br>-<br>-    |   <br>-<br>-<br>-   |
+| Accessibility Features (experimental) <br>- Search<br>- Move <br>- Zoom <br>- Resize | <br>-<br>-<br>-<br>- |                   |                     |                     |
+| Helper Lines (experimental)                                                          |          -           |         -         |          -          |          -          |
+</details>
+
 ## Prerequisites
 
 The following libraries/frameworks need to be installed on your system:

examples/workflow-test/configs/project.config.ts

@@ -0,0 +1,118 @@
+/********************************************************************************
+ * Copyright (c) 2024 EclipseSource and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import {
+    GLSPPlaywrightOptions,
+    StandaloneIntegrationOptions,
+    TheiaIntegrationOptions,
+    VSCodeIntegrationOptions
+} from '@eclipse-glsp/glsp-playwright';
+import { PlaywrightTestOptions, PlaywrightWorkerArgs, PlaywrightWorkerOptions, Project, devices } from '@playwright/test';
+import * as path from 'path';
+import { getEnv } from './utils';
+
+const projectDevices = devices['Desktop Chrome'];
+
+export function createStandaloneProject(): Project<PlaywrightTestOptions & GLSPPlaywrightOptions, PlaywrightWorkerArgs>[] {
+    const url = getEnv('STANDALONE_URL');
+
+    if (url === undefined) {
+        console.error(`[Worker: ${process.env.TEST_PARALLEL_INDEX}] Standalone project can not be created.\n`);
+        return [];
+    }
+
+    const standaloneIntegrationOptions: StandaloneIntegrationOptions = {
+        type: 'Standalone',
+        url
+    };
+
+    return [
+        {
+            name: 'standalone',
+            testMatch: ['**/*.spec.js'],
+            use: {
+                ...projectDevices,
+                integrationOptions: standaloneIntegrationOptions
+            }
+        }
+    ];
+}
+
+export function createTheiaProject(): Project<PlaywrightTestOptions & GLSPPlaywrightOptions, PlaywrightWorkerOptions>[] {
+    const url = getEnv('THEIA_URL');
+
+    if (url === undefined) {
+        console.error(`[Worker: ${process.env.TEST_PARALLEL_INDEX}] Theia project can not be created.\n`);
+        return [];
+    }
+
+    const theiaIntegrationOptions: TheiaIntegrationOptions = {
+        type: 'Theia',
+        url,
+        widgetId: 'workflow-diagram',
+        workspace: '../workspace',
+        file: 'example1.wf'
+    };
+
+    return [
+        {
+            name: 'theia',
+            testMatch: ['**/*.spec.js'],
+            use: {
+                ...projectDevices,
+                baseURL: theiaIntegrationOptions.url,
+                integrationOptions: theiaIntegrationOptions
+            }
+        }
+    ];
+}
+
+export function createVSCodeProject(): Project<PlaywrightTestOptions & GLSPPlaywrightOptions, PlaywrightWorkerOptions>[] {
+    const vsixId = getEnv('VSCODE_VSIX_ID');
+    const vsixPath = getEnv('VSCODE_VSIX_PATH');
+
+    if (vsixId === undefined || vsixPath === undefined) {
+        console.error(`[Worker: ${process.env.TEST_PARALLEL_INDEX}] VSCode project can not be created.\n`);
+        return [];
+    }
+
+    const vscodeIntegrationOptions: VSCodeIntegrationOptions = {
+        type: 'VSCode',
+        workspace: '../workspace',
+        file: 'example1.wf',
+        vsixId,
+        vsixPath,
+        storagePath: path.join(__dirname, '../playwright/.storage/vscode.setup.json')
+    };
+
+    return [
+        {
+            name: 'vscode-setup',
+            testMatch: ['setup/vscode.setup.js'],
+            use: {
+                integrationOptions: vscodeIntegrationOptions
+            }
+        },
+        {
+            name: 'vscode',
+            testMatch: ['**/*.spec.js'],
+            dependencies: ['vscode-setup'],
+            use: {
+                integrationOptions: vscodeIntegrationOptions
+            }
+        }
+    ];
+}

examples/workflow-test/src/utils.ts → examples/workflow-test/configs/utils.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2023 EclipseSource and others.
+ * Copyright (c) 2024 EclipseSource and others.
  *
  * This program and the accompanying materials are made available under the
  * terms of the Eclipse Public License v. 2.0 which is available at
@@ -14,9 +14,11 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-export function getDefined(val?: string): string {
-    if (val === undefined || val === null) {
-        throw new Error('Given value is not defined');
+export function getEnv(parameter: string, log: boolean = true): string | undefined {
+    const val = process.env[parameter];
+
+    if (log && (val === undefined || val === null)) {
+        console.error(`[Worker: ${process.env.TEST_PARALLEL_INDEX}] Parameter "${parameter}" not found in process.env`);
     }
     return val;
 }

examples/workflow-test/configs/webserver.config.ts

@@ -0,0 +1,53 @@
+/********************************************************************************
+ * Copyright (c) 2024 EclipseSource and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import { GLSPPlaywrightOptions } from '@eclipse-glsp/glsp-playwright';
+import { PlaywrightTestConfig } from '@playwright/test';
+import { getEnv } from './utils';
+
+export function isManagedServer(): boolean {
+    const env = getEnv('GLSP_SERVER_PLAYWRIGHT_MANAGED', false);
+    return env === undefined || env === 'true';
+}
+
+export function hasRunningServer(config: PlaywrightTestConfig<GLSPPlaywrightOptions>): boolean {
+    const webserver = config.webServer;
+
+    const isArray = Array.isArray(webserver);
+    return !isManagedServer() || (isArray && webserver.length > 0) || (!isArray && webserver !== undefined);
+}
+
+export function createWebserver(): PlaywrightTestConfig['webServer'] {
+    if (!isManagedServer()) {
+        return [];
+    }
+
+    const port = getEnv('GLSP_SERVER_PORT');
+
+    if (port === undefined) {
+        console.error('Webserver will be not created.\n');
+        return [];
+    }
+
+    return [
+        {
+            command: `yarn start:server -w -p ${+port}`,
+            port: +port,
+            reuseExistingServer: !process.env.CI,
+            stdout: 'ignore'
+        }
+    ];
+}

examples/workflow-test/package.json

@@ -47,11 +47,8 @@
   "devDependencies": {
     "@eclipse-glsp-examples/workflow-server-bundled": "~2.0.1",
     "@eclipse-glsp/glsp-playwright": "~2.0.0",
-    "@playwright/test": "^1.34.3",
-    "@theia/playwright": "1.39.0",
-    "commander": "^10.0.1",
+    "@playwright/test": "^1.40.1",
     "dotenv": "^16.0.3",
-    "mvn-artifact-download": "5.1.0",
     "ts-dedent": "^2.2.0",
     "tsx": "^3.12.4"
   },

examples/workflow-test/playwright.config.ts

@@ -15,42 +15,14 @@
  ********************************************************************************/
 import 'reflect-metadata';
 
-import type {
-    GLSPPlaywrightOptions,
-    StandaloneIntegrationOptions,
-    TheiaIntegrationOptions,
-    VSCodeIntegrationOptions
-} from '@eclipse-glsp/glsp-playwright';
+import type { GLSPPlaywrightOptions } from '@eclipse-glsp/glsp-playwright';
 import type { PlaywrightTestConfig } from '@playwright/test';
-import { devices } from '@playwright/test';
 import * as dotenv from 'dotenv';
-import * as path from 'path';
-import { getDefined } from './src/utils';
+import { createStandaloneProject, createTheiaProject, createVSCodeProject } from './configs/project.config';
+import { createWebserver, hasRunningServer } from './configs/webserver.config';
 
 dotenv.config();
 
-const standaloneIntegrationOptions: StandaloneIntegrationOptions = {
-    type: 'Standalone',
-    url: getDefined(process.env.STANDALONE_URL)
-};
-
-const theiaIntegrationOptions: TheiaIntegrationOptions = {
-    type: 'Theia',
-    url: getDefined(process.env.THEIA_URL),
-    widgetId: 'workflow-diagram',
-    workspace: '../workspace',
-    file: 'example1.wf'
-};
-
-const vscodeIntegrationOptions: VSCodeIntegrationOptions = {
-    type: 'VSCode',
-    workspace: '../workspace',
-    file: 'example1.wf',
-    vsixId: getDefined(process.env.VSCODE_VSIX_ID),
-    vsixPath: getDefined(process.env.VSCODE_VSIX_PATH),
-    storagePath: path.join(__dirname, 'playwright/.storage/vscode.setup.json')
-};
-
 /**
  * See https://playwright.dev/docs/test-configuration.
  */
@@ -69,48 +41,12 @@ const config: PlaywrightTestConfig<GLSPPlaywrightOptions> = {
         actionTimeout: 0,
         trace: 'on-first-retry'
     },
-    webServer: [
-        {
-            command: `yarn start:server -w -p ${+getDefined(process.env.GLSP_SERVER_PORT)}`,
-            port: +getDefined(process.env.GLSP_SERVER_PORT),
-            reuseExistingServer: !process.env.CI,
-            stdout: 'ignore'
-        }
-    ],
-    projects: [
-        {
-            name: 'standalone',
-            testMatch: ['**/*.spec.js'],
-            use: {
-                ...devices['Desktop Chrome'],
-                integrationOptions: standaloneIntegrationOptions
-            }
-        },
-        {
-            name: 'theia',
-            testMatch: ['**/*.spec.js'],
-            use: {
-                ...devices['Desktop Chrome'],
-                baseURL: theiaIntegrationOptions.url,
-                integrationOptions: theiaIntegrationOptions
-            }
-        },
-        {
-            name: 'vscode-setup',
-            testMatch: ['setup/vscode.setup.js'],
-            use: {
-                integrationOptions: vscodeIntegrationOptions
-            }
-        },
-        {
-            name: 'vscode',
-            testMatch: ['**/*.spec.js'],
-            dependencies: ['vscode-setup'],
-            use: {
-                integrationOptions: vscodeIntegrationOptions
-            }
-        }
-    ]
+    webServer: createWebserver(),
+    projects: []
 };
 
+if (hasRunningServer(config)) {
+    config.projects = [...createStandaloneProject(), ...createTheiaProject(), ...createVSCodeProject()];
+}
+
 export default config;

examples/workflow-test/src/graph/elements/task-automated.po.ts

@@ -16,7 +16,9 @@
 import {
     ChildrenAccessor,
     Mix,
-    NodeMetadata, PNode, SVGMetadataUtils,
+    NodeMetadata,
+    PNode,
+    SVGMetadataUtils,
     useClickableFlow,
     useCommandPaletteCapability,
     useDraggableFlow,