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.

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

fix(TableToolbarSearch): allow screen reader navigation #7986

Conversation

emyarod
Copy link
Member

@emyarod emyarod commented Mar 4, 2021

Closes #7915

This PR removes the div wrapper around the table toolbar search component so that screen readers can focus on the input field. The search bar transitions are also fixed so that expanding the search bar now animates properly as well

Changelog

Testing / Reviewing

Confirm that the table toolbar search behavior and appearance matches the current component on top of being screen reader accessible

@emyarod
Copy link
Member Author

emyarod commented Mar 4, 2021

cc @carmacleod

@emyarod emyarod force-pushed the 7915-datatable-search-bar-screen-reader-support branch from fb11275 to de8f05e Compare March 4, 2021 21:31
@netlify
Copy link

netlify bot commented Mar 4, 2021

Deploy preview for carbon-elements ready!

Built with commit 99dddeb

https://deploy-preview-7986--carbon-elements.netlify.app

@netlify
Copy link

netlify bot commented Mar 4, 2021

Deploy preview for carbon-components-react ready!

Built with commit 99dddeb

https://deploy-preview-7986--carbon-components-react.netlify.app

Copy link
Contributor

@jnm2377 jnm2377 left a comment

Choose a reason for hiding this comment

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

🔥 The animation looks so nice!!

@jnm2377 jnm2377 requested review from a team and johnbister and removed request for a team March 5, 2021 23:28
Base automatically changed from master to main March 8, 2021 16:35
Copy link
Member

@tay1orjones tay1orjones left a comment

Choose a reason for hiding this comment

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

I don't have JAWS set up yet so can't confirm the screen reader action, but the rest is 👍

Copy link
Contributor

@dakahn dakahn left a comment

Choose a reason for hiding this comment

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

Tested with JAWS latest on Windows 10 using Chrome and the search role is read and recognized using insert+down arrow to read the page

@emyarod emyarod requested review from a team and jeanservaas and removed request for johnbister and a team March 16, 2021 15:12
@tw15egan tw15egan requested review from a team and removed request for jeanservaas March 29, 2021 21:42
@tw15egan tw15egan requested review from aagonzales and removed request for a team March 29, 2021 21:43
Copy link
Member

@aagonzales aagonzales left a comment

Choose a reason for hiding this comment

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

Nice!

@kodiakhq
Copy link
Contributor

kodiakhq bot commented Mar 29, 2021

This PR currently has a merge conflict. Please resolve this and then re-add the status: ready to merge 🎉 label.

Copy link
Contributor

@carmacleod carmacleod left a comment

Choose a reason for hiding this comment

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

Nice work, @emyarod !

@emyarod emyarod force-pushed the 7915-datatable-search-bar-screen-reader-support branch from de8f05e to 99dddeb Compare March 30, 2021 13:50
@github-actions
Copy link
Contributor

DCO Assistant Lite bot: Thanks for your submission! We ask that you sign our Developer Certificate of Origin before we can accept your contribution. You can sign the DCO by adding a comment below using this text:


I have read the DCO document and I hereby sign the DCO.


You can retrigger this bot by commenting recheck in this Pull Request

@kodiakhq kodiakhq bot merged commit 8abe3ae into carbon-design-system:main Mar 30, 2021
@emyarod emyarod deleted the 7915-datatable-search-bar-screen-reader-support branch March 30, 2021 15:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

DataTable search bar not recognized by screen reader
7 participants