Tooltip for ComboBox, FilteringSelect not positioned properly

[stekell2]

For ComboBox or FilteringSelect, if using a tooltip (dijit.Tooltip with connectId), the tooltip (when on the right) covers up the right portion of the widget rather than being fully to the right of the widget. It covers up the area used by the down arrow. Thus making it seem impossible to use the arrow.

If you use set the promptMessage of the dijit instead, it will be positioned properly - fully to the right of the widget. A dijit.Tooltip should be positioned like this and not cover up the down arrow.

I just verified its still like this in 1.2rc1

[bill]

This is admittedly confusing but actually the issue is that you are specifying the wrong connectId to the Tooltip widget. Remember that the connectId is a DOM node id, not a widget id... If you declare a CombobBox with id=foo, then the <input> node itself gets id=foo and the domNode (which wraps the input node AND the arrow) get id=widget_foo. (Check in firebug to see this.)

So if you do <span dojoType=dijit.Tooltip connectId=widget_foo> ... then it should work.

[stekell2]

Using connectId=widget_foo creates another problem. The tooltip no longer appear when the input is focused. It only appears on onmouseover. The tooltip should appear when the input receives focus and the user is entering data. This is how it works with connectId=foo. Actually, with connectId=foo it works on both mouseover and focus. Which is good, whereas promptMessage only works on focus. Anyway to get this to work on both?

Also, using widget_foo there's a bizarre positioning problem that remains with Firefox 2 (I haven't tried FF3 yet, but IE7 is ok). I haven't found a consistant way to repeat this, but maybe 10% of the time a mouseover results in the incorrect positioning like before.

[bill]

Ah, I see your point about the focus events... that's understandable. We connect to the onFocus event on the connectId node but of course the focus event is on the <input> not the surrounding <div>.

Not sure how to fix that; IIRC focus events don't bubble. Might need some more infrastructure to support this properly.

It seems like you should be able to use the validation messages (invalidPrompt etc.) to get tooltips on form widgets. That doesn't solve your problem?

[bill]

OK I think I can check in a fix so that

<span dojoType=dijit.Tooltip connectId=widget_foo>

works.

Like I said above, you shouldn't need to use a tooltip directly for ComboBox / FilteringSelect, but perhaps the fix will be useful in other cases when focus goes somewhere inside the anchor node.

[bill]

In [27526]:

Modify Tooltip to respond to focus events that occur inside of the anchor node. Fixes #7760 !strict

Also fixing bug with removing focusin/focusout listeners, exposed by Tooltip_a11y.html test after above change, fixes #14595 !strict. Seems like removing focusin/focusout listeners should be part of dijit/tests/on.html but there's not much point at the moment, because for some reason the focus tests in that file are commented out.