Focus not working

Describe the bug

It looks like calling editor.focus() does not work.

To Reproduce

Here is a minimal example (in TypeScript). The code tries to give the editor focus in the onEditorDidMount callback. The goal is that the user can start typing in the editor immediately.

import React from 'react';
import ReactDOM from 'react-dom';

import Editor from "@monaco-editor/react";
import * as monacoEditor from 'monaco-editor/esm/vs/editor/editor.api';

type IStandaloneCodeEditor = monacoEditor.editor.IStandaloneCodeEditor

const EditorWrapper = () => {

  const onEditorDidMount = (_: () => string, editor: IStandaloneCodeEditor) => {
    editor.setPosition({lineNumber: 1, column: 6})
    editor.focus()
  }

  return (
    <Editor
      height="90vh"
      theme="dark"
      language="markdown"
      value={"Hello world"}
      editorDidMount={onEditorDidMount}
    />
  );
}

ReactDOM.render(
  <React.StrictMode>
    <EditorWrapper/>
  </React.StrictMode>,
  document.getElementById('root')
);

Expected behavior

The editor should get focused.

Desktop (please complete the following information):

• OS: Ubuntu 18.04
• Browser: Firefox 83, Chrome 80.0.3987.162
• monaco-editor 0.21.2
• @monaco-editor/react: 3.7.0

Additional context

I was using Monaco editor before in a non-React context, and there the editor focusing was working fine. Therefore I would assume this is not an upstream Monaco editor issue, but rather an issue in the React integration?

[bluenote10]

Great, thanks for the fix!

[suren-atoyan]

@bluenote10 Here is the problem. In this line. After we trigger editorDidMount we call setIsEditorReady(true), which cause a re-rendering the MonacoContainer component. The last one re-renders the root of the editor, which leads to losing the focus.