Opened 5 years ago

Last modified 5 years ago

#9627 open bug

Datepicker: Inline Datepicker not screen reader or keyboard accessible

Reported by: dylanb Owned by:
Priority: minor Milestone: none
Component: ui.datepicker Version: 1.10.3
Keywords: a11y Cc:
Blocked by: Blocking:

Description (last modified by tj.vantoll)

A plethora of problems:

  • 1) The table markup does not work on OSX or iOS and so the weekdays are not announced when using table navigation (to fix for OS X, could use ARIA table roles and aria-labelledby to solve this for OS X but an iOS solution is more complicated and might require a re-think of the overall approach
  • 2) The Datepicker title is not associated with the table at all it should be implemented as the table caption (preferred), or as a heading that occurs prior to the table
  • 3) The prev and next buttons are not keyboard accessible because they do not have an href and do not have a role - could solve this by replacing them with input elements
  • 4) Because of the distance from the day elements to the next and previous buttons, keyboard shortcuts should be provided to go forward and backward by month

An alternative approach altogether would be to have the inline datepicker insert an (offscreen/clipped) input element into the document and then simply use the keyboard shortcuts that that approach provides (assuming that the screen reader issues are fixed with that implementation)

Change History (2)

comment:1 Changed 5 years ago by tj.vantoll

Description: modified (diff)
Keywords: a11y added

comment:2 Changed 5 years ago by tj.vantoll

Status: newopen
Summary: Inline Datepicker not screen reader or keyboard accessibleDatepicker: Inline Datepicker not screen reader or keyboard accessible

The datepicker rewrite fixes #3, but I'll have to check on the other bullet points, especially keyboard access.

Note: See TracTickets for help on using tickets.