tsWorker module build error, or can't create web workers (+ undefined warnings)

[jhk-mjolner]

Hi,

I've updated monaco-languageclient from a previous setup, and that seems to have broken the LSP over websocket in such a way that initialization seemed to work, but the "textDocument/didOpen" message and other messages that should be sent while interacting with the document was never sent.
I couldn't figure out what was missing, so I've tried using and adapting to the monaco-editor-wrapper. But if I copy-paste the configureMonacoWorkers method from https://github.com/TypeFox/monaco-languageclient/blob/main/packages/examples/src/common/client/utils.ts and use it like in https://github.com/TypeFox/monaco-languageclient/blob/main/packages/examples/src/ts/wrapperTs.ts, I get the following compile error:

./node_modules/monaco-editor-wrapper/dist/workers/tsWorker-es.js - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/src/tools/babel/webpack-loader.js):
SyntaxError: <PROJECT_FOLDER>\node_modules\monaco-editor-wrapper\dist\workers\tsWorker-es.js: Unexpected token, expected "," (101756:16)

  101754 |       if (Y.inlineSourceMap) {
  101755 |         const be = oe.toString();
> 101756 |         return `data:application/json;base64,${Yie(bu, be)}`;
         |                 ^
  101757 |       }
  101758 |       const ae = oc(Ou(N.checkDefined(Ce)));
  101759 |       if (Y.mapRoot) {

Which doesn't make sense to me, as it looks like valid javascript to me and my IDE.

If I instead create my own worker factory function that only matches and creates the two workers in configureMonacoWorkers, and doesn't use useWorkerFactory from 'monaco-editor-wrapper/workerFactory' and thereby avoids referencing monaco-editor-wrapper\dist\workers\tsWorker-es.js, it compiles.
It seems to also work at runtime, but I get some weird runtime warnings that has me concerned something is broken.
I get Could not create web worker(s). Falling back to loading web worker code in main thread, which might cause UI freezes. Please see https://github.com/microsoft/monaco-editor#faq but the faq only states I can't load web workers when using file://, which I'm not.
I also get two warnings that just outputs undefined, one seemingly coming from the call to .initAndStart on the wrapper, and the other coming from an import of PushPipe, which doesn't make sense to me.
I also need to import '@codingame/monaco-vscode-json-default-extension' for the LSP communication to work, and I don't know why, except that the file atm is declared to be json. My goal is to support another custom extension and language with a custom LSP server.

I'd like to have the web workers load correctly, avoid weird nonsensical undefined warnings, and avoid making my own worker factory, if possible.
Do you have any suggestions or ideas on how I could proceed?

Both issues feel like it could be an issue with webpack, but I've had no luck trying to make it closer to https://github.com/TypeFox/monaco-languageclient/blob/main/verify/webpack/webpack.config.js
Messing around with tsconfig.json also did not seem to help.

My code using the monaco editor: https://github.com/Open-Pectus/Open-Pectus/blob/jhk/use-monaco-wrapper/openpectus/frontend/src/app/details/method-editor/monaco-editor.component.ts
webpack config, tsconfigs, package.json and angular.json are in: https://github.com/Open-Pectus/Open-Pectus/tree/jhk/use-monaco-wrapper/openpectus/frontend

Slightly related question as it might circumvent the issue if it is a webpack problem:

I've tried migrating from webpack to esbuild before, but was hindered because it was impossible to configure it correctly as angular isn't using vite (except as dev server) and all the documentation/plugins were for either webpack or vite.
I can see in https://github.com/TypeFox/monaco-languageclient/blob/main/verify/angular/angular.json that you at least have a simple build using esbuild in angular. Would you expect I should be able to migrate my angular to using esbuild now? Is it supported?

Sorry it's a jumble of several problems and questions, but I'm not having a good time keeping track of it all myself.

[kaisalmen]

Hi @jhk-mjolner angular build problems are an unresolved issue right now (there are two open issues right now). Webpack dev server was no longer working and the esbuild approach is also not working in dev mode because the esbuild plugin we use with vite does not work there.

Once CodinGame/monaco-vscode-api#555 is done and the new packages are available my plan is to re-asses the current status and then I will try to fix the Angular issues.

[jhk-mjolner]

Just to give an update of my problems when using the newest versions:

I've updated to latest versions:
monaco-editor: 0.52.2
monaco-editor-wrapper: 6.2.3
monaco-languageclient: 9.2.3

I'm using the useWorkerFactory imported from monaco-languageclient/workerFactory, but still mimicking https://github.com/TypeFox/monaco-languageclient/blob/main/packages/examples/src/common/client/utils.ts for its use.
I'm no longer importing monaco-vscode-json-default-extension, as that can't resolved for some reason (is that expected?).

It compiles, but I get the following compile-time warning from webpack:
./node_modules/@codingame/monaco-vscode-cb805e61-7d70-50d9-b937-bf6481ea0c17-common/vscode/src/vs/amdX.js:143:12-29 - Warning: Critical dependency: the request of a dependency is an expression

And I get the following runtime error, which also prevents the monaco editor from loading at all:

Uncaught (in promise) TypeError: logger.getLevel is not a function
    at set logger (bufferLog.js:15:30)
    at index.js:767:22
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (asyncToGenerator.js:3:1)
    at _next (asyncToGenerator.js:17:1)
    at asyncToGenerator.js:22:1
    at new Promise (<anonymous>)
    at asyncToGenerator.js:14:1
    at index.js:772:2
    at lifecycle.js:38:81

Whether or not I pass the logger from the monacoWorkerFactory callback in the WrapperConfig to the useWorkerFactory method doesn't appear to make a difference.

I haven't spent much time trying to fix the above problems, as I expect I probably can't without further changes in the libraries. My plan is to check back again in a week or two, unless you have ideas for something I could try.

[kaisalmen]

It compiles, but I get the following compile-time warning from webpack:
./node_modules/@codingame/monaco-vscode-cb805e61-7d70-50d9-b937-bf6481ea0c17-common/vscode/src/vs/amdX.js:143:12-29 - Warning: Critical dependency: the request of a dependency is an expression

@CGNonofr any idea regarding this? This is also shows in our webpack verification build: https://github.com/TypeFox/monaco-languageclient/actions/runs/13139121387/job/36661648306

[CGNonofr]

It compiles, but I get the following compile-time warning from webpack:
./node_modules/@codingame/monaco-vscode-cb805e61-7d70-50d9-b937-bf6481ea0c17-common/vscode/src/vs/amdX.js:143:12-29 - Warning: Critical dependency: the request of a dependency is an expression

@CGNonofr any idea regarding this? This is also shows in our webpack verification build: https://github.com/TypeFox/monaco-languageclient/actions/runs/13139121387/job/36661648306

Very surprising, it seems indeed that the published package contains unwanted code, but that code is not here if I build locally 🤔

[jhk-mjolner]

Thanks for the quick responses and fix! 😃

At the moment I can't check it myself, or check whether it also fixes the crash i get from BufferLog (more specifically @codingame/monaco-vscode-cea4d01f-6526-5c2f-8b09-b168fead499f-common/vscode/src/vs/platform/log/common/bufferLog.js), as the update hasn't been released through monaco-languageclient package yet.
But I'll check when it does release. And if it still crashes, I'll create a separate issue focusing on that alone, and leave this issue closed (or do you prefer I reopen this?).

[kaisalmen]

@jhk-mjolner new release will be available at some point today

[CGNonofr]

@jhk-mjolner new release will be available at some point today

Wouldn't it be possible to be less strict on monaco-vscode-api version so that we can integrates patch fixes without updating monaco-languageclient?

[kaisalmen]

@CGNonofr yes, I had the same idea this morning. We did that before v13