Lichess4545 / heltour

Chess tournament management software for the Lichess4545 league
https://www.lichess4545.com/
MIT License
46 stars 37 forks source link

Availability slots in availability form not read by screen readers #449

Closed hopffgam closed 1 year ago

hopffgam commented 2 years ago

The toggles in the availability form are not read by screen readers. Blind users of our website don't know if a toggle is set to "available" or to "unavailable".

zbidwell commented 2 years ago

I looked into this briefly and I think I understand what is happening.

The available/unavailable toggles seem to be handled by this bootstrap plugin. The plugin seems to take a normal checkbox input and essentially replaces it with stuff that looks nice but isn't accessible at all.

I don't have time to fix it right away (maybe this weekend I'll try again to get a dev environment going), but I think the simplest idea might be to just wrap the checkbox with a div with an aria-label, then hook into the events on the checkbox to update that aria-label (the github for the plugin makes it seem like this would be easy, but who knows).

hopffgam commented 2 years ago

https://github.com/Lichess4545/heltour/blob/13160c63eaeb9f0c27856d9835d3687e2d5fb5c3/heltour/tournament/templates/tournament/availability.html#L44-L56 is the relevant place in the form. https://github.com/Lichess4545/heltour/blob/13160c63eaeb9f0c27856d9835d3687e2d5fb5c3/heltour/tournament/views.py#L1797 is the related view class.