Opened 10 years ago

Closed 10 years ago

Last modified 10 years ago

#11995 closed defect (fixed)

DateTextBox has focus loop by press tab key

Reported by: JamesTung Owned by: bill
Priority: high Milestone: 1.6
Component: Dijit - Form Version: 1.5
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by bill)

There seems to be a bug in DateTextBox which presses tab key to switch focus in multiple DateTextBox fields. It becomes a loop and can not go to other place. ComboBox and ValidationTextBox have no problem.

Attachments (1)

TabLoopTest.html​ (1.8 KB) - added by JamesTung 10 years ago.

Download all attachments as: .zip

Change History (10)

Changed 10 years ago by JamesTung

Attachment: TabLoopTest.html​ added

comment:1 in reply to:  description Changed 10 years ago by JamesTung

Replying to JamesTung:

There seems to be a bug in DateTextBox? which presses tab key to switch focus in multiple DateTextBox? fields. You need to continue pressing tab key to switch focus. It becomes a loop and can not go to other place. ComboBox? and ValidationTextBox? have no problem.

comment:2 Changed 10 years ago by bill

Component: Date → Dijit
Description: modified (diff)
Owner: Adam Peller deleted

Thanks for attaching a test case. But I tried your test case on both FF3.6/mac and IE8/win, and it works fine for me. That's with no modifications to the test case, still running against CDN.

What are the exact steps to reproduce the problem, and what is it that you expected to happen vs. what actually did happen?

comment:3 Changed 10 years ago by JamesTung

If you change to use ValidationTextBox? or ComboBox?, you can using tab key to switch focus to urlbar and menubar of browser if continue to press tab key. But only DateTextBox? can not switch focus to urlbar and menubar of browser. It only keep focus in DateTextBox? fields.

comment:4 Changed 10 years ago by bill

Ah I see. It works better with the latest trunk code, in that the user can get focus back to the URL bar etc., although there's still an extra tab stop (at least on FF and IE) occurring on the Calendar widget's selected date, even though the drop down is closed and the Calendar is hidden.

Probably that problem occurs for other drop downs too, like ColorPalette.

comment:5 Changed 10 years ago by bill

Milestone: tbd → 1.6
Owner: set to bill
Status: new → assigned

OK, the extra tab stop(s) on all hidden drop downs are because the drop down is hidden via visibility:hidden rather than display:none.

comment:6 Changed 10 years ago by bill

Resolution: → fixed
Status: assigned → closed

(In [23299]) Hide popup/dropdown widgets using display:none rather than visibility:hidden and offscreen positioning. This is to avoid hidden popups being tab-navigable.

The moveOffScreen() method is still there for legacy code.

Fixes #11995 !strict.

comment:7 Changed 10 years ago by bill

(In [23343]) Due to form field autocomplete giving spurious test failures, just check dojo.global.dijit._curFocus to test whether focus worked. Refs #11995. Even setting autocomplete=false didn't stop the autocomplete on IE7.

comment:8 Changed 10 years ago by bill

(In [23865]) If a popup has focus, switch focus somewhere else before hiding the popup. This is an issue now that popups are hidden with display:none rather than visibility:hidden.

Specifically there were issues on IE where:

  1. nested popup had focus
  2. user clicked somewhere unfocusable on top level popup (ex: on a blank area)
  3. nested popup retained focused while it was hidden
  4. focus shifted to <body>
  5. top level popup (incorrectly) closed

Refs #11995 !strict.

comment:9 Changed 10 years ago by bill

Component: Dijit → Dijit - Form
Note: See TracTickets for help on using tickets.