[Django] #34625: FilteredSelectMultiple widget’s elements aren’t labelled
Django
-------------------------------------+-------------------------------------
Reporter: Thibaud | Owner: nobody
Colas |
Type: Bug | Status: new
Component: | Version: 4.2
contrib.admin | Keywords: accessibility,
Severity: Normal | screen reader
Triage Stage: | Has patch: 0
Unreviewed |
Needs documentation: 0 | Needs tests: 0
Patch needs improvement: 0 | Easy pickings: 0
UI/UX: 1 |
-------------------------------------+-------------------------------------
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.
--
Ticket URL: <https://code.djangoproject.com/ticket/34625>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
Django
-------------------------------------+-------------------------------------
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
-------------------------------------+-------------------------------------
* Attachment "permissions-multiple.gif" added.
Django
-------------------------------------+-------------------------------------
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
-------------------------------------+-------------------------------------
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
-------------------------------------+-------------------------------------
Reporter: Thibaud Colas | Owner: nobody
Type: Bug | Status: new
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
screen reader |
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
* stage: Unreviewed => Accepted
--
Ticket URL: <https://code.djangoproject.com/ticket/34625#comment:2>
Django
-------------------------------------+-------------------------------------
Reporter: Thibaud Colas | Owner: nobody
Type: Bug | Status: new
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: accessibility, | Triage Stage: Accepted
screen reader |
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
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:
>
New description:
[[Image(https://code.djangoproject.com/raw-attachment/ticket/34625
/permissions-multiple.gif)]]
[https://github.com/django/django/blob/main/django/contrib/admin/static/admin/js/SelectFilter2.js#L38
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:3>
Django
-------------------------------------+-------------------------------------
Reporter: Thibaud Colas | Owner: nobody
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution: duplicate
Keywords: accessibility, | Triage Stage: Accepted
screen reader |
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
* status: new => closed
* resolution: => duplicate
Comment:
I see this was already reported in #34619 :) Closing
--
Ticket URL: <https://code.djangoproject.com/ticket/34625#comment:4>