ExtJS6 Launch Modal Window fron ViewController - extjs

Question

I am attempting to launch a modal window from within a viewcontroller. Consider the following code (also located at https://fiddle.sencha.com/#fiddle/1335):
Ext.application({
name : 'Fiddle',
launch : function() {
Ext.define('Window1',{
extend: 'Ext.window.Window',
controller: 'winctrl',
xtype: 'window1',
initComponent: function(){
Ext.apply(this,{
title:'Window 1',
width: 400,
height: 400,
layout: {type:'hbox',pack:'center',align:'middle'},
items:[{
xtype: 'button',
text: 'Click Me!',
handler: 'btnClickMeClick'
}]
});
this.callParent(arguments);
}
});
Ext.define('Window2',{
extend: 'Ext.window.Window',
xtype: 'window2',
initComponent: function(){
Ext.apply(this,{
title: 'Window 2',
width: 200,
height: 200,
modal: true,
//renderTo: Ext.getBody(),
layout: {type:'hbox',pack:'center',align:'middle'},
items:[{
html: 'Modal Looks Odd',
listeners:{
afterrender: 'htmlRender'
}
}]
});
this.callParent(arguments);
}
});
Ext.define('WinCtrl',{
extend: 'Ext.app.ViewController',
alias:'controller.winctrl',
btnClickMeClick: function(){
this.dialog = this.getView().add({xtype:'window2'});
this.dialog.show();
},
htmlRender: function(){
console.log(this.dialog);
}
});
Ext.widget('window1').show();
}
});
The problem I am running into is that when window 2 is launched it is modal only to the view that launched it and I need the window to be modal to the entire document. If run as is, the htmlRender function will log the window 2 object correctly. I attempted to set the renderTo: Ext.getBody() on window 2; however, I am unable to access it's object when it is rendered. In this case, htmlRender logs an "undefined" for the window 2 object.
I need some help allowing window 2 to be rendered as a modal to the document while allowing me to reference its object. Thanks for any help.

Answer 1

Don't add the window to that view, replace:
this.dialog = this.getView().add({xtype:'window2'})
With:
this.dialog = Ext.widget('window2');
Working example: https://fiddle.sencha.com/#fiddle/1338

Answer 2

I was able to work around this issue by setting the renderConfig:Ext.getBody() on window, removing the listener on the html item and adding a listener for the show event on window2: https://fiddle.sencha.com/#fiddle/133j