TooltipDialog - popups all have dotted line border around content (FF only)

[guest]

Open TooltipDialog? dijit/tests/test_Dialog.html on Firefox 2.0 and you'll notice a dotted border around the inner content. Does not repro on IE 7.

[bill]

Right this is by design to show that you are focused on the dialog. Not sure why it isn't showing in IE7.

[guest]

Can you make this optional? I think it looks cleaner without.

[becky]

As of Sept. 6, 2007 I see the focus rectangle in IE7 as well.

Focus is put onto the tooltip dialog so that its title will be spoken by the screen readers and so keyboard users will know where focus is. We may be able to add code to find the first focusable item in the dialog and set focus to that. If there is no focusable item then focus would be set to the dialog container (as it is today). But, that all depends upon the screen reader picking up that focus has shifted to the dialog and speaking the dialog info as well as the current focus item. This needs further investigation which I probably won't have time for in 1.0.

I do not want to make setting focus to the dialog optional as it affects both screen reader users and keyboard users. Until we can set focus directly to an item, the keyboard user needs to know where focus is. Another option would be to use CSS to make the focus rectangle invisible - this is always bad for a11y because the keyboard user would not know where focus is.

Am leaving open for now but will likely move to 1.1.

[becky]

Moving to 1.1. Will fix when we address #4411 and have routine to find first focusable item in a container (#4413).

[becky]

fixed in [12144]. When tooltip dialog opens focus is now set to the first focusable item in the content. If there is not a focusable item the focus will be set to the tooltip dialog container and you will still see the dotted line border around the content. If you have no focusable item in a tooltip dialog contents, consider using a tooltip as long as the content is not too long. Or, provide some focusable item (even if you just set a tabindex=0 on the header text) so there is some element to give focus to. This will improve screen reader usability - if there is a focusable item the screen reader will inform the user of the item and that it is within a dialog. If there is no focusable item, the screen reader does not announce the dialog.