monaco-editor: [Bug] Multiple editor instances only latest created instance is working properly

Reproducible in vscode.dev or in VS Code Desktop?

Not reproducible in vscode.dev or VS Code Desktop

Reproducible in the monaco editor playground?

Not reproducible in the monaco editor playground

Monaco Editor Playground Code

/* HTML CONTENT
<div id="container" style="height: 50%"></div>
<div id="container2" style="height: 50%"></div>
*/

const model = monaco.editor.createModel("function hello() {\n\talert('Hello world!');\n}", 'javascript');
const model1 = monaco.editor.createModel("function test() {\n\talert('Hello test!');\n}", 'javascript');
const editor = monaco.editor.create(document.getElementById('container'), {
    model
});
const editor2 = monaco.editor.create(document.getElementById('container2'), {
    model:model1
});

editor.addCommand(monaco.KeyMod.CtrlCmd|monaco.KeyMod.Shift|monaco.KeyCode.KeyF, ()=> {
    const pos = editor.getPosition();
    console.log('pos', pos)
});
editor2.addCommand(monaco.KeyMod.CtrlCmd|monaco.KeyMod.Shift|monaco.KeyCode.KeyF, ()=> {
    const pos = editor2.getPosition();
    console.log('pos2', pos)
});

Actual Behavior

Triggering crtl + shift + f in the first instance, the custom command of the second instance will be triggered.

Expected Behavior

Triggering crtl + shift + f in any editor instance should trigger the command of the correct editor instance.

Additional Context

No response

About this issue

Original URL
State: open
Created 2 years ago
Reactions: 17
Comments: 19 (3 by maintainers)

Most upvoted comments

This has also been impacting us for the last few months since updating to a newer release of the editor (we are currently using 0.34.1). In our case a user may have multiple editors open (i.e. editing multiple source file). We use custom key binding CTRL + S to save the model displayed in the “active” editor. In prior versions this worked as expected, now the CTRL + S command is routed to the most-recently-opened editor instance rather than the active/in-focus editor instance, meaning that:

users are accidently saving files they do not intend to save, and
files that users think they have saved are not actually saved (i.e. they lose work) This is making our users quite unhappy.

ihqtim on Nov 24, 2022

A simpler workaround than the ones I’ve seen above might be to use actions instead of commands:

Playground link

spahnke on Jul 18, 2023

@stoanarrr You can re add the command when the editor focus, it works for me:

addCommand () {
    this.editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS, () => {
    });
    this.editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyR, () => {
    });
    this.editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyMod.Shift | monaco.KeyCode.KeyR, () => {
    });
    this.editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.Period, () => {
    });
  }
this.editor.onDidFocusEditorText(() => {
        this.addCommand();
    });

yuanzhibang-tool on Feb 8, 2023

Hello everyone, Several months have passed. How is this problem fixed?

dingiyan on Jul 20, 2022

So it is a regression in 0.32.0?

hediet on Feb 7, 2022

Both editor instances get injected the same instance of StandaloneKeybindingService. Thus, this is currently by design. However, I can see that this looks like a bug.

I’ll tag this as feature request to use independent keybinding services for different editors.

hediet on Feb 7, 2022

Hello，The latest version I am currently using still has this issue. Is there a plan to fix it, or is there currently any other solution available

AmamiyaCx on Mar 14, 2024

Ok, thats weird. Because currently I’m using the 0.31.1 version in my project with multiple editor instances and the behaviour is like the expected one.

steinerjakob on Feb 7, 2022