Skip to content

GitLab

  • Projects
  • Groups
  • Snippets
  • Help
    • Loading...
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in
A
Accessibility
  • Project overview
    • Project overview
    • Details
    • Activity
    • Releases
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 6
    • Issues 6
    • List
    • Boards
    • Labels
    • Service Desk
    • Milestones
  • Merge Requests 0
    • Merge Requests 0
  • CI / CD
    • CI / CD
    • Pipelines
    • Jobs
    • Schedules
  • Operations
    • Operations
    • Incidents
    • Environments
  • Analytics
    • Analytics
    • CI / CD
    • Repository
    • Value Stream
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Members
    • Members
  • Collapse sidebar
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
  • Development
  • Accessibility
  • Issues
  • #10

Closed
Open
Opened Jul 03, 2018 by Monish Deb@monish.debDeveloper

Make datepicker accessible

The Civi datepicker field aren't accessible which means that other than cursor actions, you can select date from calendar using control keys.

This is about making datepicker accessible and here's a working example how it will look like after completing changes- https://dequeuniversity.com/library/aria/date-pickers/sf-date-picker

A user should be able to use datepicker with the help of control keys, not just cursor actions, and tasks involved are:

  1. Tab to select date input field
  2. On date field select calendar dialog, focus on current or default date.
  3. Tab action switches to previous/next/month/year button
  4. Show a close button on down right corner that has a tabstop.
  5. Left/Right/Up/Down to change day/month/year.
  6. Enter to select
Edited Jul 04, 2018 by JoeMurray
Assignee
Assign to
None
Milestone
None
Assign milestone
Time tracking
None
Due date
None
Reference: dev/accessibility#10