Skip to content

bug(material-select): Failing accessibility score due to aria roles #21354

@heintj

Description

@heintj

Reproduction

Steps to reproduce:

  1. Navigate to https://material.angular.io/components/select/overview
  2. Go to examples
  3. Run a plugin which checks accessibility scores of a page.
    I ran axe and lighthouse (lighthouse I believe is always included in google chrome) and both are failing on aria roles.

Expected Behavior

Accessibility score of 100

Actual Behavior

Accessibility score of 91 (lighthouse which is included in google chrome)
Schermafbeelding 2020-12-15 om 11 16 01

The axe plugin is telling me as follows:
Fix the following:
Required ARIA child role not present: textbox.
For each of the mat-selects on the page.

I'm seeing same results on my app, which is running with @angular/material 10.2.7 and latest of angular 10.x.x.

Currently the role of the mat-select is combobox, which according to documentation of a11y indeed requires a child role of textbox: https://www.digitala11y.com/combobox-role/

Environment

  • Angular: latest of 10.x.x and whatever is running in the documentation
  • CDK/Material: 10.2.7 and 11.0.3
  • Browser(s): I am using google chrome latest

Metadata

Metadata

Assignees

No one assigned

    Labels

    AccessibilityThis issue is related to accessibility (a11y)P2The issue is important to a large percentage of users, with a workaroundarea: material/select

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions