#34625: FilteredSelectMultiple widget’s elements aren’t labelled
-------------------------------------+-------------------------------------
Reporter: Thibaud Colas | Owner: nobody
Type: Bug | Status: new
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: accessibility, | Triage Stage:
screen reader | Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
Description changed by Thibaud Colas:
Old description:
> In the admin UI, the `FilteredSelectMultiple` is missing labels for some
> of its elements. Here’s a recording of the widget’s UI, and what users
> would get for it in VoiceOver:
>
> There are two problems here:
>
> - "Filter edit text" – it’s not ideal for both of those to have the same
> label. Ideally each side would have a separate label ("Filter Available
> permissions", "Filter Chosen permissions"). This could be achieved with
> adding an `aria-describedby` on the filter `input` elements, pointing to
> the "Available permissions" text (and same for chosen permissions).
> - "list box" – those `select` elements don’t have a label at all. This
> needs to be added by transforming the `h2` elements into `label`, with a
> `for` pointing at each field.
>
> In both cases it seems the fix should be implemented in [SelectFilter2.js
> https://github.com/django/django/blob/main/django/contrib/admin/static/admin/js/SelectFilter2.js#L38].
>
> In Django itself, only `contrib.auth` group and user model forms use the
> `filter_horizontal` ModelAdmin API which has the issue. Not quite sure
> whether this widget is meant to be reused by users or not.
New description:
In the admin UI, the `FilteredSelectMultiple` is missing labels for some
of its elements. Here’s a recording of the widget’s UI, and what users
would get for it in VoiceOver:
[[Image(https://code.djangoproject.com/raw-attachment/ticket/34625
/permissions-multiple.gif)]]
There are two problems here:
- "Filter edit text" – it’s not ideal for both of those to have the same
label. Ideally each side would have a separate label ("Filter Available
permissions", "Filter Chosen permissions"). This could be achieved with
adding an `aria-describedby` on the filter `input` elements, pointing to
the "Available permissions" text (and same for chosen permissions).
- "list box" – those `select` elements don’t have a label at all. This
needs to be added by transforming the `h2` elements into `label`, with a
`for` pointing at each field.
In both cases it seems the fix should be implemented in [SelectFilter2.js
https://github.com/django/django/blob/main/django/contrib/admin/static/admin/js/SelectFilter2.js#L38].
In Django itself, only `contrib.auth` group and user model forms use the
`filter_horizontal` ModelAdmin API which has the issue. Not quite sure
whether this widget is meant to be reused by users or not.
--
--
Ticket URL: <https://code.djangoproject.com/ticket/34625#comment:1>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
--
You received this message because you are subscribed to the Google Groups
"Django updates" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/django-updates/010701887c73b847-b9629d56-071a-4ad9-9cb0-e8fd8e3913d9-000000%40eu-central-1.amazonses.com.
