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

[ML] [Accessibility] Screen reader should announce field name as well as type for data visualizer card #31108 #34689

Merged
merged 7 commits into from
Apr 15, 2019
Merged

[ML] [Accessibility] Screen reader should announce field name as well as type for data visualizer card #31108 #34689

merged 7 commits into from
Apr 15, 2019

Conversation

PhilippBaranovskiy
Copy link
Contributor

@PhilippBaranovskiy PhilippBaranovskiy commented Apr 8, 2019 •
edited
Loading

Fix: #31108

Summary

Now the title bar constructor passes additional aria suffix to let it announce a type as well as a title.

  • checked with VoiceOver that all focusable elements get a visual highlighting

How it announces itself

On both these cards (the 1st is indexed, another one is a file visualized) screen reader announces type at first, then title.

Examples

keyword type, currency it says

Capture2

number type, products dot price it says

Capture

@PhilippBaranovskiy PhilippBaranovskiy self-assigned this Apr 8, 2019
@elasticmachine
Copy link
Contributor

Pinging @elastic/ml-ui

@PhilippBaranovskiy PhilippBaranovskiy requested a review from a team as a code owner April 8, 2019 09:10
@elasticmachine
Copy link
Contributor

💚 Build Succeeded

jgowdyelastic
jgowdyelastic approved these changes Apr 8, 2019
View reviewed changes
Copy link
Member

@jgowdyelastic jgowdyelastic left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

alexwizp
alexwizp approved these changes Apr 8, 2019
View reviewed changes
Copy link
Contributor

@alexwizp alexwizp left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

maryia-lapata
maryia-lapata approved these changes Apr 8, 2019
View reviewed changes
Copy link
Contributor

@maryia-lapata maryia-lapata left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@elasticmachine
Copy link
Contributor

💔 Build Failed

@jgowdyelastic jgowdyelastic self-requested a review April 9, 2019 15:01
@PhilippBaranovskiy PhilippBaranovskiy changed the title [ML] (Accessibility) Screen reader should announce field name as well as type for data visualizer card #31108 ❌ [ML] (Accessibility) Screen reader should announce field name as well as type for data visualizer card #31108 Apr 10, 2019
@elasticmachine
Copy link
Contributor

💔 Build Failed

@jgowdyelastic jgowdyelastic changed the title ❌ [ML] (Accessibility) Screen reader should announce field name as well as type for data visualizer card #31108 [ML] [WIP] (Accessibility) Screen reader should announce field name as well as type for data visualizer card #31108 Apr 10, 2019
@jgowdyelastic jgowdyelastic changed the title [ML] [WIP] (Accessibility) Screen reader should announce field name as well as type for data visualizer card #31108 [ML] [Accessibility] [WIP] Screen reader should announce field name as well as type for data visualizer card #31108 Apr 10, 2019
@elasticmachine
Copy link
Contributor

💔 Build Failed

@elasticmachine
Copy link
Contributor

💔 Build Failed

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@PhilippBaranovskiy PhilippBaranovskiy changed the title [ML] [Accessibility] [WIP] Screen reader should announce field name as well as type for data visualizer card #31108 [ML] [Accessibility] Screen reader should announce field name as well as type for data visualizer card #31108 Apr 12, 2019
peteharverson
peteharverson approved these changes Apr 12, 2019
View reviewed changes
Copy link
Contributor

@peteharverson peteharverson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested latest changes with ChromeVox and LGTM

jgowdyelastic
jgowdyelastic approved these changes Apr 12, 2019
View reviewed changes
Copy link
Member

@jgowdyelastic jgowdyelastic left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@PhilippBaranovskiy PhilippBaranovskiy merged commit d830aaf into elastic:master Apr 15, 2019
@PhilippBaranovskiy PhilippBaranovskiy deleted the 31108 branch April 15, 2019 07:03
@PhilippBaranovskiy PhilippBaranovskiy mentioned this pull request Apr 15, 2019
Merged
PhilippBaranovskiy added a commit to PhilippBaranovskiy/kibana that referenced this pull request Apr 15, 2019
@PhilippBaranovskiy
[ML] [Accessibility] Screen reader should announce field name as well…
efc4e45 
… as type for data visualizer card elastic#31108  (elastic#34689)

* card title announce itself including type and name on both data visualize card and indexed stats' cards
* aria labels moved from IconType to FieldTypesUtils; tabIndex moved from IconType to Card's component;
* refactoring ML components, moved some code to field_types_utils.js, rewritten field_type_icon component, tests are adjusted;
PhilippBaranovskiy added a commit that referenced this pull request Apr 15, 2019
@PhilippBaranovskiy
[ML] [Accessibility] Screen reader should announce field name as well…
5399055 
… as type for data visualizer card #31108  (#34689) (#35059)

* card title announce itself including type and name on both data visualize card and indexed stats' cards
* aria labels moved from IconType to FieldTypesUtils; tabIndex moved from IconType to Card's component;
* refactoring ML components, moved some code to field_types_utils.js, rewritten field_type_icon component, tests are adjusted;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@jgowdyelastic jgowdyelastic jgowdyelastic approved these changes

@alexwizp alexwizp alexwizp approved these changes

@maryia-lapata maryia-lapata maryia-lapata approved these changes

@peteharverson peteharverson peteharverson approved these changes

Assignees

@PhilippBaranovskiy PhilippBaranovskiy

Labels
backported :ml Project:Accessibility release_note:enhancement v7.2.0 WCAG A
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[ML] (Accessibility) Screen reader should announce field name as well as type for data visualizer card
6 participants
@PhilippBaranovskiy @elasticmachine @peteharverson @maryia-lapata @alexwizp @jgowdyelastic