Skip to content

Issues loading monaco web worker cross domain #684

@darind

Description

@darind

monaco-editor version: 0.10.1
Browser: Chrome 63.0.3239.132
OS: Windows 10

When I am loading the Monaco script from a different domain, from time to time, I am getting the following warning in the browser console:

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

Here's my code to load the monaco editor:

var loaderScript = document.createElement("script");
loaderScript.type = "text/javascript";
loaderScript.src = "https://unpkg.com/monaco-editor@0.10.1/min/vs/loader.js";
loaderScript.async = true;
loaderScript.setAttribute("crossOrigin", "anonymous");
loaderScript.onload = function() {
    require.config({ paths: { "vs": "https://unpkg.com/monaco-editor@0.10.1/min/vs" } });
    var proxyScript = `self.MonacoEnvironment = {
	baseUrl: "https://unpkg.com/monaco-editor@0.10.1/min/"
};
importScripts("https://unpkg.com/monaco-editor@0.10.1/min/vs/base/worker/workerMain.js");`;
    var proxy = URL.createObjectURL(new Blob([proxyScript], { type: "text/javascript" }));
    window["MonacoEnvironment"] = { getWorkerUrl: function() { return proxy; } };

    require(["vs/editor/editor.main"], () => {
        var editor = monaco.editor.create(document.getElementById("editor"));
        var m = monaco.editor.createModel("export class Foo {}", "typescript", monaco.Uri.from({ path: "index.ts" }));
        editor.setModel(m);
    });
};
document.body.appendChild(loaderScript);

What would be the proper steps to debug this issue and more specifically the workerMain.js script which apparently is posting some error to the main thread through the defaultWorkerFactory.ts:

return new WebWorker(moduleId, workerId, this._label || 'anonymous' + workerId, onMessageCallback, (err) => {
    logOnceWebWorkerWarning(err);
    this._webWorkerFailedBeforeError = err;
    onErrorCallback(err);
});

Unfortunately placing a breakpoint inside this method and inspecting the err variable doesn't bring much information about the actual cause of this issue.

Additional observations:

  • Loading the monaco editor from the same domain never causes this warning to be shown
  • Slower internet connection to the CDN hosting the monaco editor dependencies increases the chances of getting this warning.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions