search

firebase / firebaseui-web

FirebaseUI is an open-source JavaScript library for Web that provides simple, customizable UI bindings on top of Firebase SDKs to eliminate boilerplate code and promote best practices.
https://firebase.google.com/
Apache License 2.0
4.58k stars 1.06k forks source link

Accessibility bug: email <input> missing id attribute #639

Open WestonThayer opened 5 years ago

WestonThayer commented 5 years ago

[REQUIRED] Describe your environment

[REQUIRED] Describe the problem

Steps to reproduce:

  1. Go to the demo https://fir-ui-demo-84a6c.firebaseapp.com
  2. Click Sign in with email
  3. Inspect the email <input>

ACTUAL: There is a <label> next to it, with for="email", but the input does not have id="email". This means screen readers or other assistive technologies do not associate the label with the input

EXPECTED: It should be accessible

If you want to experience the issue with a screen reader, you can do it on macOS by starting VoiceOver, and TABing to the field. VoiceOver announces it as edible text, and gives no indication that this field is for you to input your email address.

image

sophieheb commented 4 years ago

Have created a suggested fix for this here: https://github.com/firebase/firebaseui-web/pull/655