#16231 closed defect (fixed)
TreeNode loses focus outline on IE9
Reported by: | dacagl | Owned by: | bill |
---|---|---|---|
Priority: | undecided | Milestone: | 1.9 |
Component: | Dijit | Version: | 1.8.0 |
Keywords: | Cc: | ||
Blocked By: | Blocking: |
Description
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:
- Navigate to http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/tests/tree/test_Tree.html
- Tab to 'Contents' root node in first Tree example
- Label is outlined with a dotted box to signify focus
- Use Right arrow key to expand contents
- Use Down arrow key to move to first child node
- 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.
Change History (5)
comment:1 Changed 8 years ago by
Milestone: | tbd → 1.9 |
---|
comment:3 Changed 8 years ago by
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!
comment:4 Changed 8 years ago by
I tried this in 1.6 and 1.7 and could not reproduce the missing focus border.
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:
(although that should be removed since we no longer support FF3)