QuickTip does not show whole title

[jlindbergh]

REQUIRED INFORMATIONExt version tested:

• Ext 4.0.7

Browser versions tested against:

• Chrome 17
• IE9
• Firefox 10

DOCTYPE tested against:

• HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"

Description:

• When creating a tooltip with a "title" property longer than the "text" property, the title gets cut off.

Steps to reproduce the problem:

• The easiest way to reproduce is to go to the QuickTipManager in the Sencha docs http://docs.sencha.com/ext-js/4-0/#!...uickTipManager and edit the example under "// Manually register a quick tip for a specific element" to contain a title that is longer than the text. Then click "Live preview".

The result that was expected:

• A bold title showing the entirety of the title, plus the shorter text (not bold) shown under it.

The result that occurs instead:

• The bold title is cut off at the first word that becomes longer than the quicktip text.

Screenshot:Ext4-qtip-bug.pngTest Case:

Ext.tip.QuickTipManager.register({    target: 'quickTipContainer',    title: 'My long (and dynamic) title ',    text: 'Detail info'});

HELPFUL INFORMATIONPossible fix:

• not provided

Additional CSS used:

• only default ext-all.css

Operating Systems tested:

• Ubuntu 11.10
• Windows 7

[jlindbergh]

The obvious workaround is to set the quicktip text to something like "<b>My long and possibly dynamic title</b><br>The short text." but I consider the current behaviour a bug, so I'm reporting is as such.

Best regards,
/jlindbergh

[jlindbergh]

Is this considered a bug? Is it fixed in the upcoming release of ExtJS 4.1?

[CptS]

I think this is a bug and it seems that it hasn't been fixed in the current release.
I tested the following code in firebug on the docs page of ExtJS 4.1 and I get the same error:

var tip = Ext.create('Ext.tip.ToolTip', { 
    title: 'aaaaaaaaaaa bbbbbbbbbb ccccccccccccc', 
    html: 'abc', 
    renderTo: Ext.getBody() 
});
tip.showAt([200,100]); 

And there is another bug. If I try the following, there is a space between title and body (I think it was reserved for a second line of the title, which it doesn't have).

Ext.defer(function() { 
    tip.update('abc<br/>aaaaaaaa bbbbbbbb ccccccccc'); 
//    tip.doLayout(); 
}, 2000); 

The commented line will fix the problem in my case, but this couldn't be the solution.

For the moment I put the following code in the launch-function of my application as a workaround (This only works for automatically generated QuickTips, e.g. in a TreePanel):

Ext.tip.QuickTipManager.getQuickTip().on('resize', function(tip) {
    tip.doLayout();
    var headerDom = tip.header.el.select('.x-tip-header-text').elements[0];
    var headerWidth = Ext.get(headerDom).getWidth() + (tip.getEl().getPadding('lr') * 2);
    if(tip.getWidth() < headerWidth) {
        tip.setWidth(headerWidth);
    }
}, this); 

[CptS]

Hi,

it's not fixed in 4.2.0.663.
And there is another bug: In an Ext.tree.Panel the qtitle (from json data) is hidden, only the qtip is shown.