Unable to force layout recalculation of editor inside a tab panel component

[parky128]

I am struggling with an instance of ngx-monaco-editor inside a primeng tab panel which seems to 'lose' its size calculations when switching to another tab, changing the model value bound to the editor and then switching back to the initial tab again.

https://stackblitz.com/edit/primeng9-tabs-monaco-editor

Steps to replicate using url above:

• The 'Editor' tab will be initially selected
• Select 'Tab 2'
• Click the 'change code' button
• Change back to the 'Editor' tab and now see that the editor has shrunk in size

Before:

After:

Inspecting in the dom, the originally assigned style is still present.

As you can see from the source code in my sample app, I also tried using the editor's layout method in the tab change event to attempt to force a recalculation of the size based on the container but this has made no difference

[parky128]

@GeoAstronaute I notice you have labelled this as a bug, is there a workaround\solution you can suggest I could try?

[jmarc-roy]

Hi @parky128,

I'm currently working on a new version that will hopefully tackle this issue and will let you know if I have any workaroud in the meantime.

EDIT

Here is a quick workround using your stackblitz example: link. => I pass explicitly the dimension as args to the editor.layout() method (as it's a fixed size in your example)

[jmarc-roy]

Should be fixed in v5.0.0