GridPanel emptyText not deferring for bound store

[incutonez]

I have an override for Ext.grid.Panel that adds a generic emptyText message for all grids. I have noticed that for grids with bound stores, the emptyText isn't deferred when the store is loading (or even before it's loaded). If the store isn't bound, it defers the emptyText. Please see this Fiddle and code:

Ext.application({
    name : 'Fiddle',

    launch : function() {
        Ext.override(Ext.grid.Panel, {
            emptyText: 'There were no records returned'
        });
        Ext.define('NoProxy', {
            extend: 'Ext.data.Model',
            fields: ['name']
        });
        Ext.define('MyViewModel', {
            extend: 'Ext.app.ViewModel',
            alias: 'viewmodel.myview',
            stores: {
                myStore: {
                    model: 'NoProxy',
                    proxy: {
                        type: 'ajax',
                        url: 'data2.json'
                    }
                }
            }
        });
        Ext.define('MyViewController', {
            extend: 'Ext.app.ViewController',
            alias: 'controller.myview',
            init: function() {
                var me = this;
                setTimeout(function() {
                    me.getStore('myStore').load();
                }, 1000);
            }
        });
        Ext.define('MyView', {
            extend: 'Ext.grid.Panel',
            renderTo: Ext.getBody(),
            height: 400,
            width: 400,
            controller: 'myview',
            viewModel: {
                type: 'myview'
            },
            title: '(WRONG) Shows Empty Text',
            columns: [
                {text: 'Name', dataIndex: 'name'}
            ],
            bind: {
                store: '{myStore}'
            }
        });
        var myStore = Ext.create('Ext.data.Store', {
            model: 'NoProxy',
            proxy: {
                type: 'ajax',
                url: 'data2.json'
            }
        });
        Ext.define('MyViewController2', {
            extend: 'Ext.app.ViewController',
            alias: 'controller.myview2',
            init: function() {
                var me = this;
                setTimeout(function() {
                    myStore.load();
                }, 1000);
            }
        });
        Ext.define('MyView2', {
            extend: 'Ext.grid.Panel',
            renderTo: Ext.getBody(),
            height: 400,
            width: 400,
            controller: 'myview2',
            viewModel: {
                type: 'myview'
            },
            title: '(RIGHT) Waits for Empty Text',
            columns: [
                {text: 'Name', dataIndex: 'name'}
            ],
            store: myStore
        });
        Ext.create('MyView');
        Ext.create('MyView2');
    }
});

I believe this bug might be associated with this bug.

[incutonez]

Bump.

[Stefan B]

Bump again (still in Ext 6).

[toddtreb]

See below an override I have made for ExtJS 6.5.0.775.
From my quick testing it seems fine, but try at your own risk.

Ext.define('AppName.overrides.view.AbstractView', {    
    override: 'Ext.view.AbstractView',


    /*
        Fixes an issue where grids with bound stores will ALWAYS show the emptyText before the first load, regardless of
        the deferEmptyText config.


        The issue occurs because bound stores get added to the view after init, so the AbstractView refresh method gets
        called twice. This causes me.refreshCounter to be 2 and so the emptyText is shown.
        Adding a loadCount check should fix it.


        Issue reported, but no Sencha response at:
        https://www.sencha.com/forum/showthread.php?302968-GridPanel-emptyText-not-deferring-for-bound-store
     */
    addEmptyText: function() {
        var me = this,
            store = me.getStore();


        if (me.emptyText && !store.isLoading()
            && (!me.deferEmptyText
                || (me.refreshCounter > 1 && store.loadCount > 0) //Added loadCount check
                || store.isLoaded())) {
            me.emptyEl = Ext.core.DomHelper.insertHtml('beforeEnd', me.getTargetEl().dom, me.emptyText);
        }
    }
});