vercel[bot]
commented
10 months ago The latest updates on your projects. Learn more about Vercel for Git ↗︎
| Name | Status | Preview | Comments | Updated (UTC) |
|---|---|---|---|---|
| emoji-picker-react | ❌ Failed (Inspect) | Nov 4, 2023 6:02pm |
ymatsakova
Added accessibility controls to fix the following issues: 1. Status message in Search field is not implemented Expected result: The status message "No results found" should be implemented and announced by the screen reader after searching "asd" without interrupting the reading flow.
Suggested fix: Implement a dynamic element and provide it with a role="status". Make sure to add an aria-live="polite" attribute so the element can be announced by screen readers.
2. Typeahead suggestions count not announced - Search field Expected result: The status message "${# of results} result(s)" should be implemented and announced by the screen reader without interrupting the reading flow.
Suggested fix: Use aria-describedby attached to descriptive text. Use aria-expanded attribute, autocomplete=“off” attribute. Provide a role=“alert” with the number of available results.
3. Incorrect role for control - Category Navigation Expected result: The screen reader should announce the tabs "Frequently used", "Smileys & People", etc with their correct role.
Suggested fix: Add role="tablist" and aria-label attribute to the tabs container. Each tab must have the following properties: role="tab", aria-selected="true/false". The first tab should have this value set to "true".
4. Element's state not defined programmatically - Category Navigation Expected result: Each tab should have an aria-selected="true" attribute and use JS to toggle the boolean property from false to true on user action.
5. Heading tag missing - Emoji Category Expected result: Category label should be wrapped into
h2tag as it functions as a title or subtitle.