Skip to content

Lighthouse report and accessibility  #963

Open
@fabswt

Description

@fabswt

Description

Running a Lighthouse report for mobile on the playground (opened in a new window) returns this warning about a missing accessible name:

image

Getting the same on my own site running Autocomplete version 1.6.2.

Running a simple document.getElementById('autocomplete-0-label') confirms that there is no such element. (Meanwhile document.getElementsByClassName('aa-Autocomplete')[0] shows the autocomplete element to, indeed, exist with attribute aria-labelledby="autocomplete-0-label".)

Please note:

  • Said label is missing on the empty state on mobile.
  • It's fine after loading some data (performing a search) on mobile.
  • It's fine on desktop.

Reproduction

Go to the playground and run Lighthouse for mobile.

Expected behavior

Would expect:

  • the label to exist any time '.aa-Autocomplete' exists.
  • the warning from Lighthouse to be gone.

Environment

Added bonus...

...the joy and satisfaction of knowing you'll help me reach a score of 100 on Accessibility 😁
image

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions