Skip to content

Latest commit

 

History

History
143 lines (99 loc) · 8.65 KB

README.md

File metadata and controls

143 lines (99 loc) · 8.65 KB
Raw

Eclipse GLSP-Playwright Example

This package contains code examples that demonstrate how to test diagram editors using the Graphical Language Server Platform (GLSP).

Expand test list
Feature Standalone Theia Integration VS Code Integration
Model Saving - - -
Model Dirty State - -
Model SVG Export - - -
Model Layout - - -
Restoring viewport on re-open -
Model Edit Modes
- Edit
- Read-only
-
- 
-
-
-
- 
Client View Port
- Center
- Fit to Screen
-
-
-
-
-
-
Client Status Notification - - -
Client Message Notification - - -
Client Progress Reporting - -
Element Selection ✓ ✓ ✓
Element Hover ✓ ✓ ✓
Element Validation ✓ ✓ ✓
Element Navigation ✓ ✓ x
Element Type Hints ✓ ✓ ✓
Element Creation and Deletion ✓ ✓ ✓
Node Change Bounds
- Move
- Resize
✓
✓
✓
✓
✓
✓
Node Change Container - - -
Edge Reconnect ✓ ✓ ✓
Edge Routing Points ✓ ✓ ✓
Ghost Elements - - -
Element Text Editing ✓ ✓ ✓
Clipboard (Cut, Copy, Paste) - - -
Undo / Redo ✓ ✓ x
Contexts
- Context Menu
- Command Palette
- Tool Palette

-
-
-
-
-
-
-
-
Accessibility Features (experimental)
- Search
- Move
- Zoom
- Resize
-
-
-
-
Helper Lines (experimental) - - -

Prerequisites

The following libraries/frameworks need to be installed on your system:

Min versions

Default installations:

Structure

  • ./src: This folder provides the page objects necessary for the Workflow Example.
  • ./tests: The test cases are implemented in this folder. Every GLSP-Playwright feature has the respective test cases for demonstration purposes provided here.
  • playwright.config.ts: The Playwright configuration. More information is available in the Playwright Documentation.

Preparations

We use the GLSP-Client repository to run the tests. Please clone it to your machine and follow the steps to install it or you can use yarn repo prepare to automatically clone and build the repositories.

Next, create a new .env file with the content of .env.example in the workflow-test folder. This file contains private information about your environment, so do not commit it. Afterward, provide for the keys in .env file the necessary data.

Building the examples

The example project has to be built using yarn. Simply execute the task [Playwright] Build all or the following command in the root folder:

yarn

The different versions share the same server instance. The server will be started automatically by Playwright.

Testing the Standalone version

The test cases can be executed by executing the task [Playwright] Test Standalone or the following command in the workflow-test folder:

yarn test:standalone

Testing the Theia version

It is necessary to first start the Theia instance manually.

Afterward, the test cases can be executed by executing the task [Playwright] Test Theia or the following command in the workflow-test folder:

yarn test:theia

Testing the VS Code version

GLSP-Playwright will download and start the necessary VS Code instances automatically.

The user needs to provide the path of the vsix file in the .env file. Then the test cases can be executed by executing the task [Playwright] Test VS Code or the following command in the workflow-test folder:

yarn test:vscode

Development

Use the Watch All task to rebuild the project automatically after doing changes.

Note: The test files will be also rebuild.

Debugging

  1. Read the Playwright Debug Documentation.
  2. Install the VSCode Playwright Extension.

Live Debugging

const locator = task.locate();
  • Click on the locator variable to highlight it within the browser

Extractors

Using the powerful debugger coming with Playwright is the recommended way to debug the test cases. Still, to provide more information, we offer util functions to extract additional context information. See the debug tests for instructions on how to use them.

More information

For more information, please visit the Eclipse GLSP Umbrella repository and the Eclipse GLSP Website. If you have questions, please raise them in the discussions and have a look at our communication and support options.