docsearch
docsearch copied to clipboard
fix(docsearch-react): accessibility improvements
These changes address some of the concerns raised in #1370.
Issues addressed:
- Incorrect role/attributes on dialog
- Focus lost/not managed when closing dialog
- Low-contrast text
Issues not addressed:
- Adding
aria-hidden
orinert
to the elements underlying the modal dialog (this was a heavier lift than I was prepared to undertake, and adding thearia-modal="true"
attribute to the dialog has addressed this issue for some ATs) - Incorrect role/attributes on the search input itself (I don't think the input should actually be a combobox as suggested in #1370, since its purpose is not to assist the user in completing the field, but rather producing a list of navigation links)
- Low-contrast icons (I wasn't prepared to create new icons)
Deploy Preview for docsearch ready!
Name | Link |
---|---|
Latest commit | f9c35768d42fdf547d1d0e5d8f763bc222b5e81b |
Latest deploy log | https://app.netlify.com/sites/docsearch/deploys/6320a2a2aed0700009b375cf |
Deploy Preview | https://deploy-preview-1391--docsearch.netlify.app |
Preview on mobile | Toggle QR Code...Use your smartphone camera to open QR code link. |
To edit notification comments on pull requests, go to your Netlify site settings.
This pull request is automatically built and testable in CodeSandbox.
To see build info of the built libraries, click here or the icon next to each commit SHA.
Latest deployment of this branch, based on commit 96f713ee47d889d63785243dac43f49ccd2a8534:
Sandbox | Source |
---|---|
Vanilla | Configuration |
The Netlify deployment was cancelled automatically due to lack of content changes. This PR does introduce changes to the UI behavior and markup, however, so a preview deployment would still be useful. Is there any way to manually deploy from this branch?
Hey, thanks for the contribution 💙, I'll take a look at it ASAP!
a preview deployment would still be useful. Is there any way to manually deploy from this branch?
Indeed, you can update this line to include packages/docsearch-react
too!
a preview deployment would still be useful. Is there any way to manually deploy from this branch?
Indeed, you can update this line to include
packages/docsearch-react
too!
I made the change you requested, but I didn't realize that Netlify was only being used to deploy the DocSearch website. I don't think it's necessary to trigger a preview deployment of the website when the contents of the docsearch-react package are changed.
Instead, it would be useful to preview the changes that are introduced by this PR in CodeSandbox. When I follow the link provided by the codesandbox-ci bot I see the build output, which is great, but it's unclear how to access a working preview of that package build. This would be the easiest way for you to review the PR changes in action. Any suggestions?
@isner @shortcuts this PR is from last year, is it still revelant ? If so, it probably needs a git rebase and solving the conflicts