Skip to content

[BUG] Ensure every form element has a label (label - https://accessibilityinsights.io/info-examples/web/label) #1430

@clemlesne

Description

@clemlesne

Describe the bug

The Accessibility Insights for Web extension reports an accessibility issue to the input element.

Element path: input[multiple=""]

Snippet: <input multiple="" tabindex="-1" type="file" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: 0px -1px -1px 0px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;">

How to fix: 
Fix any of the following:
  Element does not have an implicit (wrapped) <label>
  Element does not have an explicit <label>
  aria-label attribute does not exist or is empty
  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
  Element has no title attribute
  Element has no placeholder attribute
  Element's default semantics were not overridden with role="none" or role="presentation"

Additional context

  • react-dropzone v14.3.8
  • Accessibility Insights for Web v2.46.0

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions