Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-41259

Date picker / calendar widget: accessibility: Bug fixes needed for multiple accessibility issues with Date picker calendar widget



    • Type: Bug
    • Status: Awaiting Review
    • Priority: Major
    • Resolution: Unresolved
    • Affects Version/s: 11.4, 11.5 [Tentative], 12.0, 12.1, 12.2, 12.3, 12.4, 12.5, 12.6, 19.0, 20.0 [Tentative]
    • Fix Version/s: None
    • Labels:
    • Test Plan:

      Please add a Test Plan here.

      Please add a Test Plan here.


      The date picker (calendar widget) has multiple accessibility issues that need to be addressed:

      1. The calendar widget can be opened with a keyboard, but keyboard and screen reader users cannot interact with the calendar at all. If the functionality of the calendar widget cannot be made keyboard and screen reader accessible, it should not receive keyboard focus, and it should be ignored by assistive technology.
      2. The calendar pops up automatically as soon as you tab into/focus on a text date field. Since the calendar cannot be used by keyboard or screen reader users, it interferes with other content on the page with which they need to interact and causes confusion.
      3. The calendar has a pale yellow background highlight to identify "today's date". This identifying mark is not accessible to visually-impaired users. If we were to replace this yellow highlight, it would confuse the user as to which date they are actually selecting on the calendar vs. which is "today's date". The proposed fix is therefore to remove the yellow "today's date" mark to provide all users with the same experience.

      This is a parent jira for the issues listed above.

      Information about accessible date pickers can be found here: Deque Accessible Datepickers. The example provided on that page is keyboard accessible.

        Gliffy Diagrams


            Issue Links



                • Assignee:
                  maintenanceteam Core Team
                  rainribbon Tiffany Stull
                • Votes:
                  0 Vote for this issue
                  4 Start watching this issue


                  • Created:

                    Git Source Code