cal.com icon indicating copy to clipboard operation
cal.com copied to clipboard

accessibility: timezone selection `input` doesn't have a `label`

Open mfranzke opened this issue 4 months ago • 1 comments

Issue Summary

The invisible input-element that's being used to store the timezone selection (CSS selector .current-timezone input[role="combobox"]) doesn't include an (at least invisible) label.

Steps to Reproduce

  1. Go to a book event form.
  2. E.g. run Google Lighthouse out of Google Web Developer tools.

Actual Results

You'll get a report that the input doesn't have an associated label currently.

Expected Results

At best this label would be visible as well as most form elements should include a visible label according to WCAG Success Criterion C 3.3.2, but at least include this as a invisible one so that screenreaders could pick up that value.

Technical details

independent from browser environment.

Evidence

Go to Accessibility sub-tab underneath the Elements section within Google Developer tools after inspecting the input element and check for a textual description. Or just rerun Google Lighthouse to check for any reportings on this topic.

mfranzke avatar Oct 19 '24 10:10 mfranzke