Opened 12 years ago

Closed 12 years ago

#3596 closed defect (fixed)

need to make color button on test_button.html accessible

Reported by: Becky Gibson Owned by: simonjb
Priority: high Milestone: 0.9
Component: Accessibility Version: 0.9
Keywords: Cc:
Blocked By: Blocking:

Description

The new color button dropdown button on the dijit/tests/form/test_button.html page is not keyboard accessible. The color dropdown button example invokes a color palette - the color palette is keyboard accessible but there is no mechanism to get focus to it when it is opened via the dropdown button. Normally when the drop down button invokes a menu, the menu is opened and focus is put on the first menu item. When a drop down button is used with another type of popup we need to make certain that focus is put into the popup (in this case the color palette).

This may require some re-architecting of dropdown button and/or popup manager..

Attachments (1)

ColorPalette.diff (3.9 KB) - added by simonjb 12 years ago.

Download all attachments as: .zip

Change History (7)

comment:1 Changed 12 years ago by Becky Gibson

Owner: changed from Becky Gibson to simonjb

comment:2 Changed 12 years ago by bill

Right. Been talking to Adam about this kind of thing in general. Probably the DropDownButton? calls colorPalette.focus()? The key thing is that ColorPalette? doesn't (and shouldn't) know it's a popup.

comment:3 Changed 12 years ago by simonjb

Status: newassigned

test_Menu.html now also pops up a ColorPalette and has a similar problem. Whenever I open the ColorPalette via keyboard ("Different popup", second from bottom) I get an error:

this.currentSubmenu._focusFirstItem is not a function

comment:4 Changed 12 years ago by bill

(In [9550]) All widgets that popup are now required to implement either onExecute()/onCancel() or onChange() callbacks, so the parent widget knows when to close them. Think of Menu etc. as a sort of poor-man's dialog with auto-submit just by single mouse-click.

dijit.util.popup.open() changed so that it never closes the popup directly but rather notifies (via "onBlur" callback) when user has clicked something else on the screen, thereby suggesting the popup chain be closed.

dijit.util.popup.open() makes four callbacks now:

  • onExecute: when user clicks a menu item or hits the OK button on a TooltipDialog?
  • onCancel: when user hits ESC key or the cancel button on a dialog
  • onBlur: when user implicitly closes a dialog by clicking away or tabbing to a different node
  • onClose: called when the popup has been closed via user call to dijit.util.close(), closeAll() or closeTo()

Fixes #3603. Refs #3596.

Changed 12 years ago by simonjb

Attachment: ColorPalette.diff added

comment:5 Changed 12 years ago by simonjb

Attached a patch that:

  • calls dropDown.focus() in DropDownButton._toggleDropDown()
  • implements focus() for ColorPalette
  • renames onClick(), onMouseOver(), onBlur(), onFocus(), and onKeyDown() to onColorClick(), onColorMouseOver(), and so on; this change was made to make their role more explicit and to avoid a collision with the new onBlur() widget method (see [9550])
  • adds onColorMouseOut() to fix a bug that caused the highlight border to remain when a mouse left a color square whenever the browser window was not the currently selected one in Windows: one could 'paint' borders on squares by moving the mouse over a color palette

comment:6 Changed 12 years ago by simonjb

Resolution: fixed
Status: assignedclosed

(In [9593]) Fixes #3596: need to make color button on test_button.html accessible. Also adds ColorPalette?._onColorMouseOut() to fix a bug that caused the highlight border to remain when a mouse left a color square in the case that the browser window was not the currently selected one in Windows: one could 'paint' borders on squares by moving the mouse over a ColorPalette?.

Note: See TracTickets for help on using tickets.