TreeNode loses focus outline on IE9

[dacagl]

Using the keyboard to navigate TreeNodes? of a Dijit Tree widget, the focus (dotted box around the label) disappears in some cases on IE9. I can reproduce the problem on the Dijit Tree test website (​http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/tests/tree/test_Tree.html). I'm currently pointing at a local 1.8.0 version of Dojo for my playpen version and see the problem there as well.

Steps to reproduce:

1. Navigate to ​http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/tests/tree/test_Tree.html
2. Tab to 'Contents' root node in first Tree example
3. Label is outlined with a dotted box to signify focus
4. Use Right arrow key to expand contents
5. Use Down arrow key to move to first child node
6. Focus outline disappears but if you hit Right arrow, Africa node expands and sometimes the Focus indicator shows back up

I mostly notice the problem of the disappearing focus indicator when use the Down and Up arrows to navigate through the children. If I move to another browser window, the focus indicator usually reappears.

[bill]

OK, I see it happening, thanks for the report.

I think IE tries to not show the focus outline except when it's helpful, which (for plain-old HTML pages) means when the user starts tabbing around, or sending keystrokes into the focused node. That hypothesis matches the behavior you described above.

As for a fix, I guess it means we need to do a synthetic focus outline for Tree. There are a few of those already in dijit.css, for example:

.dj_ff3 .dj_a11y div.dijitSplitter:focus {
	outline-style:dotted;
	outline-width: 2px;
}

(although that should be removed since we no longer support FF3)

[bill]

In [29877]:

Workaround IE9 behavior where down arrowing through TreeNodes doesn't show focus outline. Also removing some rules for FF3. Fixes #16231.

[dacagl]

Thank you Bill! I just tried out the CSS workaround for my playpen and it works like a charm! Thank you for your fast response!

[haysmark]

I tried this in 1.6 and 1.7 and could not reproduce the missing focus border.

[bill]

Still happens in 1.8 though.