Introduce capability to configue a MessagePort for the language client

- Update to vitest v1
- Move initServices to LanguageClientWrapper

package.json

@@ -17,32 +17,32 @@
     "start:example:server:python": "npm run start:server:python --workspace packages/examples"
   },
   "devDependencies": {
-    "@types/node": "~18.18.13",
+    "@types/node": "~20.10.4",
     "@types/shelljs": "~0.8.15",
     "@types/vscode": "~1.83.3",
-    "@typescript-eslint/eslint-plugin": "~6.12.0",
-    "@typescript-eslint/parser": "~6.12.0",
-    "@vitest/browser": "~0.34.6",
+    "@typescript-eslint/eslint-plugin": "~6.13.2",
+    "@typescript-eslint/parser": "~6.13.2",
+    "@vitest/browser": "~1.0.2",
     "editorconfig": "~2.0.0",
-    "eslint": "~8.54.0",
+    "eslint": "~8.55.0",
     "shelljs": "~0.8.5",
     "shx": "~0.3.4",
-    "typescript": "~5.3.2",
-    "vite": "~5.0.2",
-    "vitest": "~0.34.6",
-    "webdriverio": "~8.24.1"
+    "typescript": "~5.3.3",
+    "vite": "~5.0.6",
+    "vitest": "~1.0.2",
+    "webdriverio": "~8.24.12"
   },
   "overrides": {
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0"
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0"
   },
   "resolutions": {
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0"
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0"
   },
   "volta": {
-    "node": "18.18.2",
-    "npm": "9.9.0"
+    "node": "20.10.0",
+    "npm": "10.2.3"
   },
   "workspaces": [
     "packages/monaco-editor-wrapper",

packages/examples/package.json

@@ -1,34 +1,34 @@
 {
   "name": "monaco-editor-wrapper-examples",
   "private": true,
-  "version": "3.4.0",
+  "version": "3.5.0",
   "type": "module",
   "dependencies": {
-    "@codingame/monaco-vscode-configuration-service-override": "~1.83.12",
-    "@codingame/monaco-vscode-editor-service-override": "~1.83.12",
-    "@codingame/monaco-vscode-json-default-extension": "~1.83.12",
-    "@codingame/monaco-vscode-keybindings-service-override": "~1.83.12",
-    "@codingame/monaco-vscode-python-default-extension": "~1.83.12",
-    "@typefox/monaco-editor-react": "~2.4.0",
+    "@codingame/monaco-vscode-configuration-service-override": "~1.83.16",
+    "@codingame/monaco-vscode-editor-service-override": "~1.83.16",
+    "@codingame/monaco-vscode-json-default-extension": "~1.83.16",
+    "@codingame/monaco-vscode-keybindings-service-override": "~1.83.16",
+    "@codingame/monaco-vscode-python-default-extension": "~1.83.16",
+    "@typefox/monaco-editor-react": "~2.5.0",
     "http-server": "~14.1.1",
     "langium": "~2.1.3",
     "langium-statemachine-dsl": "~2.1.0",
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
     "monaco-editor-workers": "~0.44.0",
-    "monaco-editor-wrapper": "~3.4.0",
-    "monaco-languageclient": "~7.1.0",
-    "monaco-languageclient-examples": "~7.1.0",
+    "monaco-editor-wrapper": "~3.5.0",
+    "monaco-languageclient": "~7.2.0",
+    "monaco-languageclient-examples": "~7.2.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "request-light": "~0.7.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0",
     "vscode-uri": "~3.0.8",
     "vscode-languageclient": "~9.0.1",
     "vscode-languageserver": "~9.0.1",
     "vscode-json-languageservice": "~5.3.7"
   },
   "devDependencies": {
-    "@types/react": "~18.2.38",
+    "@types/react": "~18.2.42",
     "@types/react-dom": "~18.2.17",
     "ts-node": "~10.9.1"
   },
@@ -37,22 +37,21 @@
     "vscode": "$vscode"
   },
   "resolutions": {
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0"
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0"
   },
   "volta": {
-    "node": "18.18.2",
-    "npm": "9.9.0"
+    "node": "20.10.0",
+    "npm": "10.2.3"
   },
   "scripts": {
     "clean": "shx rm -rf ./dist ./libs *.tsbuildinfo",
     "compile": "tsc --build tsconfig.src.json",
     "copy:prepare": "shx mkdir -p ./libs",
     "copy:workers": "shx cp -fr ../../node_modules/monaco-editor-workers/dist ./libs/monaco-editor-workers",
     "copy:all": "npm run copy:prepare && npm run copy:workers",
-    "build:worker": "vite-node ./build/buildWorker.mts -- --script iife ../../node_modules/langium-statemachine-dsl/out/language-server/main-browser.js ./dist/worker/statemachineServerWorker.js",
     "build:bundle:wrapper": "vite --config  vite.bundle-mew.ts build",
-    "build": "npm run clean && npm run compile && npm run build:worker && npm run build:bundle:wrapper && npm run copy:all",
+    "build": "npm run clean && npm run compile && npm run build:bundle:wrapper && npm run copy:all",
     "start": "http-server --port 20002 ./",
     "start:server:json": "node --loader ts-node/esm ./src/servers/json-server.ts",
     "start:server:python": "node --loader ts-node/esm ./src/servers/python-server.ts"

packages/examples/src/langium/config/wrapperStatemachineConfig.ts

@@ -2,10 +2,9 @@ import getEditorServiceOverride from '@codingame/monaco-vscode-editor-service-ov
 import getKeybindingsServiceOverride from '@codingame/monaco-vscode-keybindings-service-override';
 import { useOpenEditorStub } from 'monaco-languageclient';
 import { UserConfig } from 'monaco-editor-wrapper';
-import { loadStatemachinWorker } from '../wrapperStatemachine.js';
 import { getTextContent } from '../../common.js';
 
-export const createLangiumGlobalConfig = async (): Promise<UserConfig> => {
+export const createLangiumGlobalConfig = async (worker: Worker, port?: MessagePort): Promise<UserConfig> => {
     const code = await getTextContent(new URL('./src/langium/content/example.statemachine', window.location.href));
 
     const extensionFilesOrContents = new Map<string, string | URL>();
@@ -14,8 +13,6 @@ export const createLangiumGlobalConfig = async (): Promise<UserConfig> => {
     extensionFilesOrContents.set('/statemachine-configuration.json', statemachineLanguageConfig);
     extensionFilesOrContents.set('/statemachine-grammar.json', responseStatemachineTm);
 
-    const stateMachineWorker = loadStatemachinWorker();
-
     return {
         wrapperConfig: {
             serviceConfig: {
@@ -66,7 +63,8 @@ export const createLangiumGlobalConfig = async (): Promise<UserConfig> => {
         languageClientConfig: {
             options: {
                 $type: 'WorkerDirect',
-                worker: stateMachineWorker
+                worker,
+                messagePort: port
             }
         }
     };

packages/examples/src/langium/reactStatemachine.tsx

@@ -4,10 +4,11 @@ import { MonacoEditorReactComp } from '@typefox/monaco-editor-react';
 import { createLangiumGlobalConfig } from './config/wrapperStatemachineConfig.js';
 
 import { buildWorkerDefinition } from 'monaco-editor-workers';
+import { loadStatemachinWorkerRegular } from './wrapperStatemachine.js';
 buildWorkerDefinition('../../../../node_modules/monaco-editor-workers/dist/workers', import.meta.url, false);
 
 const startEditor = async () => {
-    const langiumGlobalConfig = await createLangiumGlobalConfig();
+    const langiumGlobalConfig = await createLangiumGlobalConfig(loadStatemachinWorkerRegular());
     const comp = <MonacoEditorReactComp
         userConfig={langiumGlobalConfig}
         style={{

packages/examples/src/langium/worker/startLanguageServer.ts

@@ -0,0 +1,19 @@
+
+import { startLanguageServer, EmptyFileSystem } from 'langium';
+import { BrowserMessageReader, BrowserMessageWriter, createConnection } from 'vscode-languageserver/browser.js';
+import { createStatemachineServices } from 'langium-statemachine-dsl/out/language-server/statemachine-module.js';
+
+export const start = (port: MessagePort | DedicatedWorkerGlobalScope, name: string) => {
+    console.log(`Starting ${name}...`);
+    /* browser specific setup code */
+    const messageReader = new BrowserMessageReader(port);
+    const messageWriter = new BrowserMessageWriter(port);
+
+    const connection = createConnection(messageReader, messageWriter);
+
+    // Inject the shared services and language-specific services
+    const { shared } = createStatemachineServices({ connection, ...EmptyFileSystem });
+
+    // Start the language server with the shared services
+    startLanguageServer(shared);
+};

packages/examples/src/langium/worker/statemachine-server-port.ts

@@ -0,0 +1,15 @@
+import { start } from './startLanguageServer.js';
+
+declare const self: DedicatedWorkerGlobalScope;
+
+self.onmessage = async (event: MessageEvent) => {
+    const data = event.data;
+    if (data.port) {
+        start(data.port, 'statemachine-server-port');
+
+        setTimeout(() => {
+            // test independen communication
+            self.postMessage('started');
+        }, 1000);
+    }
+};

packages/examples/src/langium/worker/statemachine-server.ts

@@ -0,0 +1,5 @@
+import { start } from './startLanguageServer.js';
+
+declare const self: DedicatedWorkerGlobalScope;
+
+start(self, 'statemachine-server');

packages/examples/src/langium/wrapperStatemachine.ts

@@ -13,9 +13,24 @@ const startEditor = async () => {
         alert('Editor was already started!');
         return;
     }
-    const langiumGlobalConfig = await createLangiumGlobalConfig();
+
+    // init first worker regularly
+    const stateMachineWorkerRegular = loadStatemachinWorkerRegular();
+    const langiumGlobalConfig = await createLangiumGlobalConfig(stateMachineWorkerRegular);
     await wrapper.initAndStart(langiumGlobalConfig, document.getElementById('monaco-editor-root'));
-    const langiumGlobalConfig2 = await createLangiumGlobalConfig();
+
+    // init second worker with port for client and worker
+    const stateMachineWorkerPort = loadStatemachinWorkerPort();
+    // use callback to receive message back from worker independent of the message channel the LSP is using
+    stateMachineWorkerPort.onmessage = (event) => {
+        console.log('Received message from worker: ' + event.data);
+    };
+    const channel = new MessageChannel();
+    stateMachineWorkerPort.postMessage({
+        port: channel.port2
+    }, [channel.port2]);
+
+    const langiumGlobalConfig2 = await createLangiumGlobalConfig(stateMachineWorkerPort, channel.port1);
     await wrapper2.initAndStart(langiumGlobalConfig2, document.getElementById('monaco-editor-root2'));
 
     vscode.commands.getCommands().then((x) => {
@@ -42,13 +57,24 @@ export const run = async () => {
     }
 };
 
-export const loadStatemachinWorker = () => {
+export const loadStatemachinWorkerRegular = () => {
+    // Language Server preparation
+    const workerUrl = new URL('./src/langium/worker/statemachine-server.ts', window.location.href);
+    console.log(`Langium worker URL: ${workerUrl}`);
+
+    return new Worker(workerUrl, {
+        type: 'module',
+        name: 'Statemachine Server Regular',
+    });
+};
+
+export const loadStatemachinWorkerPort = () => {
     // Language Server preparation
-    const workerUrl = new URL('./dist/worker/statemachineServerWorker.js', window.location.href);
+    const workerUrl = new URL('./src/langium/worker/statemachine-server-port.ts', window.location.href);
     console.log(`Langium worker URL: ${workerUrl}`);
 
     return new Worker(workerUrl, {
         type: 'module',
-        name: 'Statemachine LS',
+        name: 'Statemachine Server Port',
     });
 };

packages/monaco-editor-react/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 All notable changes to npm module [@typefox/monaco-editor-react](https://www.npmjs.com/package/@typefox/monaco-editor-react) are documented in this file.
 
+## [2.5.0] - 2023-12-07
+
+- Updated to `monaco-editor-wrapper` `3.5.0`
+
 ## [2.4.0] - 2023-11-27
 
 - Updated to `monaco-editor-wrapper` `3.4.0`

packages/monaco-editor-react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typefox/monaco-editor-react",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "license": "MIT",
   "description": "React component for Monaco-Editor and Monaco Languageclient",
   "keywords": [
@@ -46,28 +46,28 @@
     "build": "npm run clean && npm run compile && npm run build:bundle"
   },
   "volta": {
-    "node": "18.18.2",
-    "npm": "9.9.0"
+    "node": "20.10.0",
+    "npm": "10.2.3"
   },
   "dependencies": {
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
-    "monaco-editor-wrapper": "~3.4.0",
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
+    "monaco-editor-wrapper": "~3.5.0",
     "react": "~18.2.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0"
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0"
   },
   "peerDependencies": {
-    "monaco-editor-wrapper": "~3.4.0"
+    "monaco-editor-wrapper": "~3.5.0"
   },
   "devDependencies": {
-    "@types/react": "~18.2.38"
+    "@types/react": "~18.2.42"
   },
   "overrides": {
     "monaco-editor": "$monaco-editor",
     "vscode": "$vscode"
   },
   "resolutions": {
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0"
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0"
   },
   "repository": {
     "type": "git",

packages/monaco-editor-wrapper/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to npm module [monaco-editor-wrapper](https://www.npmjs.com/package/monaco-editor-wrapper) are documented in this file.
 
+## [3.5.0] - 2023-11-07
+
+- Updated to `[email protected]` and `[email protected]`.
+- Introduce capability to use a `MessagePort` as end-point for a languageclient
+- Use vitest v1 for tests
+- Move `initServices` from `MonacoEditorLanguageClientWrapper` to `LanguageClientWrapper`
+
 ## [3.4.0] - 2023-11-27
 
 - Updated to `[email protected]` and `[email protected]`.

packages/monaco-editor-wrapper/package.json

@@ -1,6 +1,6 @@
 {
   "name": "monaco-editor-wrapper",
-  "version": "3.4.0",
+  "version": "3.5.0",
   "license": "MIT",
   "description": "Monaco-Editor and Monaco Languageclient Wrapper",
   "keywords": [
@@ -54,33 +54,33 @@
     "build": "npm run clean && npm run compile && npm run bundle"
   },
   "volta": {
-    "node": "18.18.2",
-    "npm": "9.9.0"
+    "node": "20.10.0",
+    "npm": "10.2.3"
   },
   "dependencies": {
-    "@codingame/monaco-vscode-configuration-service-override": "~1.83.12",
-    "@codingame/monaco-vscode-editor-service-override": "~1.83.12",
-    "@codingame/monaco-vscode-textmate-service-override": "~1.83.12",
-    "@codingame/monaco-vscode-theme-defaults-default-extension": "~1.83.12",
-    "@codingame/monaco-vscode-theme-service-override": "~1.83.12",
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
-    "monaco-languageclient": "~7.1.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0",
+    "@codingame/monaco-vscode-configuration-service-override": "~1.83.16",
+    "@codingame/monaco-vscode-editor-service-override": "~1.83.16",
+    "@codingame/monaco-vscode-textmate-service-override": "~1.83.16",
+    "@codingame/monaco-vscode-theme-defaults-default-extension": "~1.83.16",
+    "@codingame/monaco-vscode-theme-service-override": "~1.83.16",
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
+    "monaco-languageclient": "~7.2.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0",
     "vscode-languageclient": "~9.0.1",
     "vscode-languageserver-protocol":"~3.17.5",
     "vscode-ws-jsonrpc": "~3.1.0"
   },
   "peerDependencies": {
-    "monaco-languageclient": "~7.1.0",
+    "monaco-languageclient": "~7.2.0",
     "vscode-ws-jsonrpc": "~3.1.0"
   },
   "overrides": {
     "monaco-editor": "$monaco-editor",
     "vscode": "$vscode"
   },
   "resolutions": {
-    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.12 <1.84.0",
-    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.12 <1.84.0"
+    "monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.16 <1.84.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@>=1.83.16 <1.84.0"
   },
   "repository": {
     "type": "git",