Fixed #35507 -- Improved accessibility of search and filter elements in the admin changelist.

4 files changed, 17 insertions, 7 deletions

diff --git a/django/contrib/admin/templates/admin/change_list.html b/django/contrib/admin/templates/admin/change_list.html
index b0b4c31619..162560dabc 100644
--- a/django/contrib/admin/templates/admin/change_list.html
+++ b/django/contrib/admin/templates/admin/change_list.html
@@ -74,7 +74,7 @@
       </div>
       {% block filters %}
         {% if cl.has_filters %}
-          <nav id="changelist-filter" aria-labelledby="changelist-filter-header">
+          <search id="changelist-filter" aria-labelledby="changelist-filter-header">
             <h2 id="changelist-filter-header">{% translate 'Filter' %}</h2>
             {% if cl.is_facets_optional or cl.has_active_filters %}<div id="changelist-filter-extra-actions">
               {% if cl.is_facets_optional %}<h3>
@@ -86,7 +86,7 @@
               </h3>{% endif %}
             </div>{% endif %}
             {% for spec in cl.filter_specs %}{% admin_list_filter cl spec %}{% endfor %}
-          </nav>
+          </search>
         {% endif %}
       {% endblock %}
     </div>
diff --git a/django/contrib/admin/templates/admin/search_form.html b/django/contrib/admin/templates/admin/search_form.html
index 447b8039af..259c200965 100644
--- a/django/contrib/admin/templates/admin/search_form.html
+++ b/django/contrib/admin/templates/admin/search_form.html
@@ -1,6 +1,8 @@
 {% load i18n static %}
 {% if cl.search_fields %}
-<div id="toolbar"><form id="changelist-search" method="get" role="search">
+<div id="toolbar">
+<h2 id="changelist-search-form" class="visually-hidden">{% blocktranslate with name=cl.opts.verbose_name_plural %}Search {{ name }}{% endblocktranslate %}</h2>
+<form id="changelist-search" method="get" role="search" aria-labelledby="changelist-search-form">
 <div><!-- DIV needed for valid HTML -->
 <label for="searchbar"><img src="{% static "admin/img/search.svg" %}" alt="Search"></label>
 <input type="text" size="40" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar"{% if cl.search_help_text %} aria-describedby="searchbar_helptext"{% endif %}>
diff --git a/tests/admin_changelist/tests.py b/tests/admin_changelist/tests.py
index 6003ce47d8..7203daa6b0 100644
--- a/tests/admin_changelist/tests.py
+++ b/tests/admin_changelist/tests.py
@@ -1745,7 +1745,12 @@ class ChangeListTests(TestCase):
         response = m.changelist_view(request)
         self.assertContains(
             response,
-            '<form id="changelist-search" method="get" role="search">',
+            '<h2 id="changelist-search-form" class="visually-hidden">Search bands</h2>',
+        )
+        self.assertContains(
+            response,
+            '<form id="changelist-search" method="get" role="search" '
+            'aria-labelledby="changelist-search-form">',
         )
 
     def test_search_bar_total_link_preserves_options(self):
diff --git a/tests/admin_views/tests.py b/tests/admin_views/tests.py
index 13af96c004..9ea603423c 100644
--- a/tests/admin_views/tests.py
+++ b/tests/admin_views/tests.py
@@ -875,7 +875,8 @@ class AdminViewBasicTest(AdminViewBasicTestCase):
         response = self.client.get(reverse("admin:admin_views_thing_changelist"))
         self.assertContains(
             response,
-            '<nav id="changelist-filter" aria-labelledby="changelist-filter-header">',
+            '<search id="changelist-filter" '
+            'aria-labelledby="changelist-filter-header">',
             msg_prefix="Expected filter not found in changelist view",
         )
         self.assertNotContains(
@@ -930,7 +931,8 @@ class AdminViewBasicTest(AdminViewBasicTestCase):
         response = self.client.get(changelist_url)
         self.assertContains(
             response,
-            '<nav id="changelist-filter" aria-labelledby="changelist-filter-header">',
+            '<search id="changelist-filter" '
+            'aria-labelledby="changelist-filter-header">',
         )
         filters = {
             "chap__id__exact": {
@@ -1070,7 +1072,8 @@ class AdminViewBasicTest(AdminViewBasicTestCase):
         )
         self.assertContains(
             response,
-            '<nav id="changelist-filter" aria-labelledby="changelist-filter-header">',
+            '<search id="changelist-filter" '
+            'aria-labelledby="changelist-filter-header">',
         )
         self.assertContains(
             response,