Improve the accessibility of the Discover screen #12681
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
aria-expanded is a true/false/undefined state so we need to make sure
even if showFilter is undefined, we will print false (that's why the
double negation)
aria-haspopup doesn't really fit, since this is not a popup in the sense
the ARIA standard describes ("A popup is generally presented visually as
a group of items that appears to be on top of the main page content.")
Add aria-controls to reference the controlled element.
Fix elastic#12638 and toggle label when filter toggles
timroes
added
Project:Accessibility
Team:Platform-Design
timroes
changed the title
timroes
removed
the
Team:Platform-Design
aphelionz
approved these changes
Jul 11, 2017
snide
approved these changes
Jul 11, 2017
cjcenizal
previously requested changes
Jul 11, 2017
| > | ||
| <span aria-hidden="true" class="kuiIcon fa-gear"></span> | ||
| </button> | ||
| </h3> | ||
| </div> | ||
|
|
||
| <div class="sidebar-item discover-field-details" ng-show="showFilter"> | ||
| <div class="sidebar-item discover-field-details" ng-show="showFilter" id="discover-field-filter"> |
There was a problem hiding this comment.
Really minor nit, but per our HTML style guide, can we write IDs in camel case, for both this ID and the other ones we're adding?
There was a problem hiding this comment.
Absolutely not nit-picking, but me not reading the style-guide carefully enough. Thanks for pointing this out. Fixed it. The file itself (and I assume several others) contain quite some more ids not using camel-case. But I think, that needs to be addressed in a different PR.
timroes
changed the title
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR fixes several issues of the discovery app. Fixes #12635, #12642, #12636, #12638
Besides I added some addition a11y (
aria-expanded) to the collapsible side bar, add anaria-describedbyfrom the search input to the "lucene query syntax link", add somearia-controlswhere needed.