Monaco Editor force resize editor

Question

I use the Monaco Editor.

My full code is too long to be posted here but this is my settings:

automaticLayout: true,
folding: false,
theme: 'vs-dark',
lineNumbers: 'off',
minimap: {
    enabled: false
}

Problem

• When I enlarge my window, the Monaco Editor follows as intended.
• When I reduce my Window, the Monaco Editor does not resize (height).

Question

How can I force a resize that I can trigger from my script?

What I've tried, that did not work

What did happend was that the console message was output on every window change, but not the Monaco height.

window.onresize = () => {
  console.log('Window resize');
  editor.layout();
});

Demo

I enlarge first and then reduce the height by making the developer console larger/smaller.

Answer 1

We have grappled with this too. The answer is to make the layout take an empty object rather than no parameter, so the resize function becomes

window.onresize = () => {
  console.log('Window resize');
  editor.layout({});
});

Note that typescript does not like this, as the object apparently should contain both width and height.

window.onresize = () => {
  console.log('Window resize');
  editor.layout({} as monaco.editor.IDimension);
});

Fixes that issue.