Extjs6 Filefield inside fieldset working fine with Chrome and not working in FF

Question

(sencha fiddle for filefield inside fieldset)

I have a filefield inside a fieldset in extjs6. Fieldset is collapsed initially and I made filefield as button only. If I open the fieldset in chrome button shown and I don't see the button in firefox.

If I comment out line no 19 in the attached fiddle or make the fieldset open when starting, filefield looks good in both firefox and chrome.

Please refer the attached sencha fiddle and tell whats wrong.

Answer 1

Mohan, it sure does look like a bug. I noticed that if you start out not collapsed then it works OK. So as a workaround you can chage your config to start out not collapsed and then collapse it in the afterrender:

Ext.application({
    name : 'Fiddle',

    launch : function() {
        Ext.create('Ext.form.Panel', {
        title: 'Fieldsets with Files',
        //labelWidth: 75, 
        frame: true,
        bodyStyle: 'padding:5px 5px 0',
        width: 550,
        renderTo: Ext.getBody(),
        //layout: 'column', // arrange fieldsets side by side
        items: [{
            xtype : 'fieldset',
            name : 'docAttachment',
            border: 2,
            title : '<b>Attach your document</b>',
            collapsible : true,
            //collapsed : true,
            //layout : {
               // type : 'hbox',
               // align : 'center',
               // pack : 'center'
            //},
            items :[{
                xtype: 'fileuploadfield',
                name: 'fileuploads',
                buttonOnly: true,
                buttonText : 'Select a File...'
            }],
            listeners:{
                'afterrender':function(){this.collapse();}

            }
        }]
    });
    }
});