Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Flyout Screen Reader Instructions Inconsistent #725

Closed
aphelionz opened this issue Apr 29, 2018 · 0 comments
Closed

Flyout Screen Reader Instructions Inconsistent #725

aphelionz opened this issue Apr 29, 2018 · 0 comments
Assignees
@cjcenizal
Labels
accessibility - WCAG A Level A WCAG Accessibility Criteria accessibility

Comments

@aphelionz
Copy link
Contributor

Steps to reproduce (assumes ChromeVox or similar)

  1. Open https://elastic.github.io/eui/#/layout/flyout in a new tab.
  2. Tab through to the first "Show Flyout" button
  3. Hit enter
  4. Note that the screen reader reads "You can use ESC to close this window"
  5. Press esc to close the flyout
  6. Tab to the next "Show Flyout" button
  7. Press enter

Actual Result

The screen reader reads nothing for the second flyout

Expected Result

The screen reader should read the header of the flyout and then "you can press escape to close this flyout"

Category: #724: Elastic UI Flyout Accessibility
Relevant WCAG Criteria: [3.3.2 Input Assistance: Labels or Instructions(https://www.w3.org/WAI/WCAG20/quickref/#qr-minimize-error-cues)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@cjcenizal cjcenizal

Labels
accessibility - WCAG A Level A WCAG Accessibility Criteria accessibility
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@aphelionz @cjcenizal