ColorArea: remove aria-roledescription on iOS/Android #2547
Conversation
This file contains hidden or 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
To better reflect behavior of slider inputs with mobile screen readers on iOS and Android, each input should be labeled by its individual channel name and we should remove aria-roledescription so the input is identified simply as a slider control.
majornista
requested review from
dannify,
devongovett and
snowystinger
as code owners
On iOS/Android, the aria-valuetext for each slider within the ColorArea control should just be the value for that channel, and need not include the value for the second channel. The value for all three channels is included as the title attribute.
snowystinger
approved these changes
Nov 11, 2021
majornista
added a commit
to majornista/react-spectrum-v3
that referenced
this pull request
Nov 11, 2021
* ColorArea: remove aria-roledescription on iOS/Android To better reflect behavior of slider inputs with mobile screen readers on iOS and Android, each input should be labeled by its individual channel name and we should remove aria-roledescription so the input is identified simply as a slider control. * ColorArea: change aria-valuetext for iOS/Android On iOS/Android, the aria-valuetext for each slider within the ColorArea control should just be the value for that channel, and need not include the value for the second channel. The value for all three channels is included as the title attribute. * ColorArea: include channel name in aria-valuetext for iOS/Android
snowystinger
added a commit
that referenced
this pull request
Feb 25, 2022
* Initial ColorArea implementation * refactor aria back to stately * more refactoring * refactor step logic and defaults * tests and subsequent fixes from tests * Add uncontrolled to tests * Add size story * use snaptovalue and add page steps * remove dead code * rename variable to make more sense, fix description * Add isDisabled based on Spectrum designs * add min size * add prop description * Get back to no useMove changes * Combine the useMove frequently appears with useKeyboard (#2508) * Combine the useMove frequently appears with useKeyboard * fix merge mistake * Remove isPage from useMove, add modifier keys * continue propagation for keys we don't handle * have aria pass through the step size Co-authored-by: Rob Snow <[email protected]> * ColorArea: remove aria-roledescription on iOS/Android (#2547) * ColorArea: remove aria-roledescription on iOS/Android To better reflect behavior of slider inputs with mobile screen readers on iOS and Android, each input should be labeled by its individual channel name and we should remove aria-roledescription so the input is identified simply as a slider control. * ColorArea: change aria-valuetext for iOS/Android On iOS/Android, the aria-valuetext for each slider within the ColorArea control should just be the value for that channel, and need not include the value for the second channel. The value for all three channels is included as the title attribute. * ColorArea: include channel name in aria-valuetext for iOS/Android * Add formatting for color name and value based on locale * allow for differences in formatting strings * fix lint * @trivial remove extra whitespace/redundant afterEach * fix: tests * fix remaining issues before merges on main make it in * incorporate michaels a11y and locale fixes Co-authored-by: Michael Jordan <[email protected]> Co-authored-by: Daniel Lu <[email protected]> Co-authored-by: GitHub <[email protected]>
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.
To better reflect behavior of slider inputs with mobile screen readers on iOS and Android, each input should be labeled by its individual channel name and we should remove aria-roledescription so the input is identified simply as a slider control.
Relates to: #2483, #1732 and #1118 in particular: #2483 (comment)
✅ Pull Request Checklist:
📝 Test Instructions:
input[type=range]elements within the ColorArea component.input[type=range]elements within the ColorArea component.Since each slider within the ColorArea control adjusts independently on mobile, it doesn't make sense to describe them as a "2D slider".
🧢 Your Project:
Adobe/Accessibility