#9627 open bug ()

Opened October 27, 2013 03:44PM UTC

Last modified October 29, 2013 02:21AM UTC

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

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)

Attachments (0)
Change History (2)

Changed October 29, 2013 02:17AM UTC by tj.vantoll comment:1

description: 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) \ → 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) \
keywords: → a11y

Changed October 29, 2013 02:21AM UTC by tj.vantoll comment:2

status: new → open
summary: Inline Datepicker not screen reader or keyboard accessible → Datepicker: 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.