Skip to content

Data Component Enhancing Accessibility  #6630

@britt6612

Description

@britt6612

Enhancing Data component search and filter to meet better screen reader

Expected Behavior

  • After pressing "enter" in the search it should read out "number of results found" or "no results found"
  • On the filters button have an aria-label to let the user know how many filters are applied. (This has already been enhanced)
  • When clicking on apply filters it would be great if the results were ready out "number of results found" or "no results found"

Actual Behavior

  1. After pressing "enter" in the search nothing came back on the screen reader so it was not aware if there were results unless the user arrows down.
  2. On the filters button, it does not let you know how many filters are applied.
  3. When clicking on apply filters nothing came back on the screen reader so it was not aware if there were results unless the user arrows down.

URL, screen shot, or Codepen exhibiting the issue

Steps to Reproduce

Use JAWS or voiceover

  1. Type something into the search and press enter. Nothing is read out by the screenreader.
  2. Focus on the filters button. No information about the number of filters applied is read out.
  3. Press the apply filters button. No information about the # of results is read out.

https://storybook.grommet.io/?path=/story/layout-data-list--example

Your Environment

  • Grommet version:
  • Browser Name and version:
  • Operating System and version (desktop or mobile):

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

Status

Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions