Weird textfield border problem with non-resizable windows

[smares]

Hey guys, I am having a weird problem with a textfield border disappearing when the parent window's resizable property is set to false. Here's my code for the window:

Ext.define('abc.view.Login', {
    extend: 'Ext.window.Window',
    
    alias: 'widget.login',
    
    autoShow: true,
    closable: false,
    draggable: false,
    modal: true,
    resizable: false,
    title : 'Login',

    initComponent: function() {
        this.items = [
            {
                xtype: 'form',
                
                bodyPadding: 10,
                
                items: [
                    {
                        name : 'username',
                        xtype: 'textfield',
                        allowBlank: false,
                        fieldLabel: 'Username'
                    },
                    {
                        name : 'password',
                        xtype: 'textfield',
                        allowBlank: false,
                        fieldLabel: 'Password',
                        inputType: 'password'
                    },
                ]
            }
        ];

        this.buttons = [
            {
                text: 'Login',
            }
        ];
    
        this.callParent(arguments);
    }
});

It gets called by Viewport:

Ext.define('abc.view.Viewport', {
    extend: 'Ext.container.Viewport',
    
    requires: [
        'abc.view.Login'
    ],
    
    layout: 'fit',
    
    initComponent: function() {
        this.items = [
            {
                xtype: 'login'
            }
        ];
    
        this.callParent(arguments);
    }
});

Viewport is used by my application:

Ext.application({
    name:                'abc',

    appFolder:            'cms',
    
    autoCreateViewport:    true,

    launch: function() {
    }
});

If I set resizable to true (or simply comment the line), both text fields have a border. If resizable is false, the last text field does not have a border. The problem appears to be caused by the fact that when resizable is false, the text field also has the class "x-viewport" which has "border: 0 none;".

Is this a bug or am I doing something wrong?

[tobiu]

actually it is not a good practise to add window into items of a container since they are floating above it. so, i would just call:

Ext.create('abc.view.Login');

since it has the autoShow config set to true.

let me know if this does already fixes your sizing issue.

[smares]

Indeed, thanks!