Quicktips broken in ExtJS 4.1.3

[djohnanderson]

ExtJS 4.1.3
Chrome Browser

All my QuickTips in my dialogs stopped working going between ExtJS 4.1.1a to ExtJS 4.1.3. I tracked it down to a new method that showed up in ExtJS 4.1.3: Ext.tip.QuickTip now implements Show:

    show: function(){
        var me = this,
            fromDelay = me.fromDelayShow;
            
        // We're coming from a delayed show, so check whether
        // the attribute has been removed before we show it 
        if (fromDelay && me.targetTextEmpty()) {
            me.onShowVeto();
            delete me.activeTarget;
            return;
        }
        me.callParent(arguments);    
    },

In my case the first time show is called, fromDelay and me.targetTextEmpty() return true so we never end up calling the parent to show the tip. removing the return after delete.activeTarget fixes the problem.

Here's how I create the QuickTip: I added an attribute to a a field called helpText. After my field is rendered I call a method inhjectHelpTextIcon to add the quick tip:

                Ext.override(Ext.form.Field, {
                    afterRender: function() {
                        this.callOverridden(arguments);
                        Console.Utilities.injectHelpTextIcon.call(this);
                    }
                });

    injectHelpTextIcon: function() {
        var label, helpImage;


        if (this.helpText) {
            label = this.getEl().down('.x-form-item-label');
            if (label) {
                helpImage = label.createChild({
                    tag: 'span',
                    cls: 'info-tooltip',
                    style: 'margin-bottom: -2px; margin-left: 4px; padding: 0px;'
                });
                Ext.tip.QuickTipManager.register({
                    target: helpImage,
                    text: this.helpText,
                    baseCls: 'custom-x-tip',
                    dismissDelay: 60 * 60 * 1000 // 0 is suppose to be forever but it doesn't work in 4.1
                });
            }
        }
    },

Also, setting dimissDelay to 0 doesn't cause the tip to never go away.

[mitchellsimoens]

Can I get a locally runnable test case?

[djohnanderson]

Create a blank application with Sencha Cmd. Then replace App/app/view/Viewport.js with this:

Ext.override(Ext.form.field.Base, {
    afterRender: function() {
        var label, helpImage;


        this.callOverridden(arguments);
        if (this.helpText) {
            label = this.getEl().down('.x-form-item-label');
            if (label) {
                Ext.tip.QuickTipManager.register({
                    target: label,
                    baseCls: 'custom-x-tip',
                    dismissDelay: 60 * 60 * 1000 // 0 is suppose to be forever but it doesn't work in 4.1
                });
            }
        }
    }
});


// Ext.override(Ext.tip.QuickTip, {
//     show: function(){
//         var me = this,
//             fromDelay = me.fromDelayShow;
// 
//         // We're coming from a delayed show, so check whether
//         // the attribute has been removed before we show it 
//         if (fromDelay && me.targetTextEmpty()) {
//             me.onShowVeto();
//             delete me.activeTarget;
//             // ExtJS 4.1.3 returns here and doesn't call the parent to show the tip
//             // http://www.sencha.com/forum/showthread.php?255445-Quicktips-broken-in-ExtJS-4.1.3&p=934994#post934994
//         }
//         me.callParent(arguments);    
//     }
// });


Ext.define('Console.view.Viewport', {
    renderTo: Ext.getBody(),
    extend: 'Ext.container.Viewport',
    requires:[
        'Ext.tab.Panel',
        'Ext.layout.container.Border'
    ],


    layout: {
        type: 'border'
    },


    items: [{
        region: 'west',
        xtype: 'panel',
        title: 'west',
        width: 150,
        items: {
            xtype: 'textfield',
            fieldLabel: 'Name',
            helpText: true
        }
    },{
        region: 'center',
        xtype: 'tabpanel',
        items:[{
            title: 'Center Tab 1'
        }]
    }]
}, function () {
});

Run the example and hover over the "Name" textfield and the tip won't show. Comment in the fix and it will show