From 2ec614c7bbfde428e0a0a04d84ae3e814893cd9e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Istv=C3=A1n=20So=C3=B3s?= <isoos@users.noreply.github.com>
Date: Thu, 7 Dec 2023 18:37:43 +0100
Subject: [PATCH] Title and accessible label for search input fields. (#7261)

---
 app/lib/frontend/templates/views/shared/search_banner.dart    | 4 ++++
 app/lib/frontend/templates/views/shared/site_header.dart      | 4 ++++
 app/test/frontend/golden/authorized_page.html                 | 2 +-
 app/test/frontend/golden/consent_page.html                    | 2 +-
 app/test/frontend/golden/create_publisher_page.html           | 2 +-
 app/test/frontend/golden/error_page.html                      | 2 +-
 app/test/frontend/golden/help_page.html                       | 2 +-
 app/test/frontend/golden/landing_page.html                    | 2 +-
 app/test/frontend/golden/my_activity_log_page.html            | 2 +-
 app/test/frontend/golden/my_liked_packages.html               | 2 +-
 app/test/frontend/golden/my_packages.html                     | 2 +-
 app/test/frontend/golden/my_publishers.html                   | 2 +-
 app/test/frontend/golden/pkg_activity_log_page.html           | 2 +-
 app/test/frontend/golden/pkg_admin_page.html                  | 2 +-
 app/test/frontend/golden/pkg_changelog_page.html              | 2 +-
 app/test/frontend/golden/pkg_example_page.html                | 2 +-
 app/test/frontend/golden/pkg_index_page.html                  | 2 +-
 app/test/frontend/golden/pkg_install_page.html                | 2 +-
 app/test/frontend/golden/pkg_score_page.html                  | 2 +-
 app/test/frontend/golden/pkg_show_page.html                   | 2 +-
 app/test/frontend/golden/pkg_show_page_discontinued.html      | 2 +-
 app/test/frontend/golden/pkg_show_page_flutter_plugin.html    | 2 +-
 app/test/frontend/golden/pkg_show_page_publisher.html         | 2 +-
 app/test/frontend/golden/pkg_show_page_retracted.html         | 2 +-
 .../golden/pkg_show_page_retracted_non_retracted_version.html | 2 +-
 app/test/frontend/golden/pkg_show_version_page.html           | 2 +-
 app/test/frontend/golden/pkg_versions_page.html               | 2 +-
 app/test/frontend/golden/publisher_activity_log_page.html     | 2 +-
 app/test/frontend/golden/publisher_admin_page.html            | 2 +-
 app/test/frontend/golden/publisher_list_page.html             | 2 +-
 app/test/frontend/golden/publisher_packages_page.html         | 2 +-
 .../frontend/golden/publisher_unlisted_packages_page.html     | 2 +-
 app/test/frontend/golden/search_page.html                     | 2 +-
 app/test/frontend/golden/topics_page.html                     | 2 +-
 app/test/task/testdata/goldens/packages/oxygen.html           | 2 +-
 app/test/task/testdata/goldens/packages/oxygen/changelog.html | 2 +-
 app/test/task/testdata/goldens/packages/oxygen/example.html   | 2 +-
 app/test/task/testdata/goldens/packages/oxygen/install.html   | 2 +-
 app/test/task/testdata/goldens/packages/oxygen/license.html   | 2 +-
 app/test/task/testdata/goldens/packages/oxygen/score.html     | 2 +-
 app/test/task/testdata/goldens/packages/oxygen/versions.html  | 2 +-
 .../task/testdata/goldens/packages/oxygen/versions/1.0.0.html | 2 +-
 .../goldens/packages/oxygen/versions/1.0.0/changelog.html     | 2 +-
 .../goldens/packages/oxygen/versions/1.0.0/example.html       | 2 +-
 .../goldens/packages/oxygen/versions/1.0.0/install.html       | 2 +-
 .../goldens/packages/oxygen/versions/1.0.0/license.html       | 2 +-
 .../goldens/packages/oxygen/versions/1.0.0/score.html         | 2 +-
 .../task/testdata/goldens/packages/oxygen/versions/2.0.0.html | 2 +-
 48 files changed, 54 insertions(+), 46 deletions(-)

diff --git a/app/lib/frontend/templates/views/shared/search_banner.dart b/app/lib/frontend/templates/views/shared/search_banner.dart
index 61849b0d90..db5cb9f4ee 100644
--- a/app/lib/frontend/templates/views/shared/search_banner.dart
+++ b/app/lib/frontend/templates/views/shared/search_banner.dart
@@ -25,6 +25,10 @@ d.Node searchBannerNode({
         autocomplete: 'on',
         autofocus: autofocus,
         value: queryText,
+        attributes: {
+          'title': 'Search',
+          'aria-label': 'Search',
+        },
       ),
       d.button(classes: ['icon'], ariaLabel: 'search'),
       if (showSearchFiltersButton)
diff --git a/app/lib/frontend/templates/views/shared/site_header.dart b/app/lib/frontend/templates/views/shared/site_header.dart
index 2fda58d802..df8742c38c 100644
--- a/app/lib/frontend/templates/views/shared/site_header.dart
+++ b/app/lib/frontend/templates/views/shared/site_header.dart
@@ -44,6 +44,10 @@ d.Node siteHeaderNode({
               name: 'q',
               placeholder: 'New search...',
               autocomplete: 'on',
+              attributes: {
+                'title': 'Search',
+                'aria-label': 'Search',
+              },
             ),
           ),
         ),
diff --git a/app/test/frontend/golden/authorized_page.html b/app/test/frontend/golden/authorized_page.html
index 0c61e84a4d..15962b2f71 100644
--- a/app/test/frontend/golden/authorized_page.html
+++ b/app/test/frontend/golden/authorized_page.html
@@ -41,7 +41,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/consent_page.html b/app/test/frontend/golden/consent_page.html
index 44cfe65d4c..8aee21eaf0 100644
--- a/app/test/frontend/golden/consent_page.html
+++ b/app/test/frontend/golden/consent_page.html
@@ -41,7 +41,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/create_publisher_page.html b/app/test/frontend/golden/create_publisher_page.html
index 07887ea7db..df6abf22a0 100644
--- a/app/test/frontend/golden/create_publisher_page.html
+++ b/app/test/frontend/golden/create_publisher_page.html
@@ -40,7 +40,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/error_page.html b/app/test/frontend/golden/error_page.html
index 074358d0f6..18f0786511 100644
--- a/app/test/frontend/golden/error_page.html
+++ b/app/test/frontend/golden/error_page.html
@@ -102,7 +102,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
         </form>
       </div>
diff --git a/app/test/frontend/golden/help_page.html b/app/test/frontend/golden/help_page.html
index 6c1163e705..08b2929dfd 100644
--- a/app/test/frontend/golden/help_page.html
+++ b/app/test/frontend/golden/help_page.html
@@ -41,7 +41,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/landing_page.html b/app/test/frontend/golden/landing_page.html
index 5d91c1c4a3..11b5993229 100644
--- a/app/test/frontend/golden/landing_page.html
+++ b/app/test/frontend/golden/landing_page.html
@@ -104,7 +104,7 @@ <h3 class="foldable-button">
         <h2 class="_visuallyhidden">pub.dev package manager</h2>
         <img class="logo" src="/static/hash-%%etag%%/img/pub-dev-logo.svg" alt="" width="328" height="70" role="presentation"/>
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
         </form>
         <p class="text">
diff --git a/app/test/frontend/golden/my_activity_log_page.html b/app/test/frontend/golden/my_activity_log_page.html
index 27ef4b9cd0..64d84460a5 100644
--- a/app/test/frontend/golden/my_activity_log_page.html
+++ b/app/test/frontend/golden/my_activity_log_page.html
@@ -41,7 +41,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/my_liked_packages.html b/app/test/frontend/golden/my_liked_packages.html
index 894cb22c63..1632f51ce8 100644
--- a/app/test/frontend/golden/my_liked_packages.html
+++ b/app/test/frontend/golden/my_liked_packages.html
@@ -42,7 +42,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/my_packages.html b/app/test/frontend/golden/my_packages.html
index b5fc1a4328..7c0a0f7b10 100644
--- a/app/test/frontend/golden/my_packages.html
+++ b/app/test/frontend/golden/my_packages.html
@@ -41,7 +41,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/my_publishers.html b/app/test/frontend/golden/my_publishers.html
index 9a4d8bad8d..51da3494cd 100644
--- a/app/test/frontend/golden/my_publishers.html
+++ b/app/test/frontend/golden/my_publishers.html
@@ -41,7 +41,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_activity_log_page.html b/app/test/frontend/golden/pkg_activity_log_page.html
index bf8e497008..d6b795f82b 100644
--- a/app/test/frontend/golden/pkg_activity_log_page.html
+++ b/app/test/frontend/golden/pkg_activity_log_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_admin_page.html b/app/test/frontend/golden/pkg_admin_page.html
index aa511c3b94..887c61848e 100644
--- a/app/test/frontend/golden/pkg_admin_page.html
+++ b/app/test/frontend/golden/pkg_admin_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_changelog_page.html b/app/test/frontend/golden/pkg_changelog_page.html
index bf6da56c1d..64e6c99ec8 100644
--- a/app/test/frontend/golden/pkg_changelog_page.html
+++ b/app/test/frontend/golden/pkg_changelog_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_example_page.html b/app/test/frontend/golden/pkg_example_page.html
index ddc820f12e..600b59c24b 100644
--- a/app/test/frontend/golden/pkg_example_page.html
+++ b/app/test/frontend/golden/pkg_example_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_index_page.html b/app/test/frontend/golden/pkg_index_page.html
index 9cca9c26de..77ada6ddaa 100644
--- a/app/test/frontend/golden/pkg_index_page.html
+++ b/app/test/frontend/golden/pkg_index_page.html
@@ -103,7 +103,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" value="sdk:dart"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" value="sdk:dart" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
           <div class="search-filters-btn-wrapper -active">
             <img class="search-filters-btn search-filters-btn-inactive" src="/static/hash-%%etag%%/img/search-filters-inactive.svg" alt="icon to toggle the display of search filters (inactive)" width="42" height="42"/>
diff --git a/app/test/frontend/golden/pkg_install_page.html b/app/test/frontend/golden/pkg_install_page.html
index 020c6e6dda..f99037ccea 100644
--- a/app/test/frontend/golden/pkg_install_page.html
+++ b/app/test/frontend/golden/pkg_install_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_score_page.html b/app/test/frontend/golden/pkg_score_page.html
index d9204226c7..539e4f7232 100644
--- a/app/test/frontend/golden/pkg_score_page.html
+++ b/app/test/frontend/golden/pkg_score_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_show_page.html b/app/test/frontend/golden/pkg_show_page.html
index 064dfcdd61..d9051e592f 100644
--- a/app/test/frontend/golden/pkg_show_page.html
+++ b/app/test/frontend/golden/pkg_show_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_show_page_discontinued.html b/app/test/frontend/golden/pkg_show_page_discontinued.html
index 17569d8a6b..bcbb113703 100644
--- a/app/test/frontend/golden/pkg_show_page_discontinued.html
+++ b/app/test/frontend/golden/pkg_show_page_discontinued.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_show_page_flutter_plugin.html b/app/test/frontend/golden/pkg_show_page_flutter_plugin.html
index 8ce39f2988..e3523350e7 100644
--- a/app/test/frontend/golden/pkg_show_page_flutter_plugin.html
+++ b/app/test/frontend/golden/pkg_show_page_flutter_plugin.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_show_page_publisher.html b/app/test/frontend/golden/pkg_show_page_publisher.html
index 785428362c..98f69d1c26 100644
--- a/app/test/frontend/golden/pkg_show_page_publisher.html
+++ b/app/test/frontend/golden/pkg_show_page_publisher.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_show_page_retracted.html b/app/test/frontend/golden/pkg_show_page_retracted.html
index 60615c6b9f..0600c2f96f 100644
--- a/app/test/frontend/golden/pkg_show_page_retracted.html
+++ b/app/test/frontend/golden/pkg_show_page_retracted.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_show_page_retracted_non_retracted_version.html b/app/test/frontend/golden/pkg_show_page_retracted_non_retracted_version.html
index 6bec0023c2..0f762e7e27 100644
--- a/app/test/frontend/golden/pkg_show_page_retracted_non_retracted_version.html
+++ b/app/test/frontend/golden/pkg_show_page_retracted_non_retracted_version.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_show_version_page.html b/app/test/frontend/golden/pkg_show_version_page.html
index ed2119001c..0a55d2e8ab 100644
--- a/app/test/frontend/golden/pkg_show_version_page.html
+++ b/app/test/frontend/golden/pkg_show_version_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/pkg_versions_page.html b/app/test/frontend/golden/pkg_versions_page.html
index 63d0179246..74c8b21f54 100644
--- a/app/test/frontend/golden/pkg_versions_page.html
+++ b/app/test/frontend/golden/pkg_versions_page.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/frontend/golden/publisher_activity_log_page.html b/app/test/frontend/golden/publisher_activity_log_page.html
index 33422deda8..dcd5e4e873 100644
--- a/app/test/frontend/golden/publisher_activity_log_page.html
+++ b/app/test/frontend/golden/publisher_activity_log_page.html
@@ -104,7 +104,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
         </form>
       </div>
diff --git a/app/test/frontend/golden/publisher_admin_page.html b/app/test/frontend/golden/publisher_admin_page.html
index 11ec877d9e..19af38c4b7 100644
--- a/app/test/frontend/golden/publisher_admin_page.html
+++ b/app/test/frontend/golden/publisher_admin_page.html
@@ -104,7 +104,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
         </form>
       </div>
diff --git a/app/test/frontend/golden/publisher_list_page.html b/app/test/frontend/golden/publisher_list_page.html
index fe25681cd1..3e7ccaa202 100644
--- a/app/test/frontend/golden/publisher_list_page.html
+++ b/app/test/frontend/golden/publisher_list_page.html
@@ -103,7 +103,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
           <div class="search-filters-btn-wrapper">
             <img class="search-filters-btn search-filters-btn-inactive" src="/static/hash-%%etag%%/img/search-filters-inactive.svg" alt="icon to toggle the display of search filters (inactive)" width="42" height="42"/>
diff --git a/app/test/frontend/golden/publisher_packages_page.html b/app/test/frontend/golden/publisher_packages_page.html
index f991a0e295..600b7b6b10 100644
--- a/app/test/frontend/golden/publisher_packages_page.html
+++ b/app/test/frontend/golden/publisher_packages_page.html
@@ -104,7 +104,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
         </form>
       </div>
diff --git a/app/test/frontend/golden/publisher_unlisted_packages_page.html b/app/test/frontend/golden/publisher_unlisted_packages_page.html
index 440e52d032..920ed6de8e 100644
--- a/app/test/frontend/golden/publisher_unlisted_packages_page.html
+++ b/app/test/frontend/golden/publisher_unlisted_packages_page.html
@@ -104,7 +104,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" autofocus="autofocus" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
         </form>
       </div>
diff --git a/app/test/frontend/golden/search_page.html b/app/test/frontend/golden/search_page.html
index 6b41a66066..c6a976c565 100644
--- a/app/test/frontend/golden/search_page.html
+++ b/app/test/frontend/golden/search_page.html
@@ -103,7 +103,7 @@ <h3 class="foldable-button">
     <div class="_banner-bg">
       <div class="container">
         <form class="search-bar banner-item" action="/packages">
-          <input class="input" name="q" placeholder="Search packages" autocomplete="on" value="foobar"/>
+          <input class="input" name="q" placeholder="Search packages" autocomplete="on" value="foobar" title="Search" aria-label="Search"/>
           <button class="icon" aria-label="search"></button>
           <div class="search-filters-btn-wrapper">
             <img class="search-filters-btn search-filters-btn-inactive" src="/static/hash-%%etag%%/img/search-filters-inactive.svg" alt="icon to toggle the display of search filters (inactive)" width="42" height="42"/>
diff --git a/app/test/frontend/golden/topics_page.html b/app/test/frontend/golden/topics_page.html
index a046e22bde..88404cc24e 100644
--- a/app/test/frontend/golden/topics_page.html
+++ b/app/test/frontend/golden/topics_page.html
@@ -41,7 +41,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen.html b/app/test/task/testdata/goldens/packages/oxygen.html
index 56563985e0..150bbcc81f 100644
--- a/app/test/task/testdata/goldens/packages/oxygen.html
+++ b/app/test/task/testdata/goldens/packages/oxygen.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/changelog.html b/app/test/task/testdata/goldens/packages/oxygen/changelog.html
index 357b75b8fa..e0f7fb2592 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/changelog.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/changelog.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/example.html b/app/test/task/testdata/goldens/packages/oxygen/example.html
index c088e4e90c..ac9c80bb02 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/example.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/example.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/install.html b/app/test/task/testdata/goldens/packages/oxygen/install.html
index 3003f6d529..bafcfe70fc 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/install.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/install.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/license.html b/app/test/task/testdata/goldens/packages/oxygen/license.html
index 29b08e746c..4857cdf96a 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/license.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/license.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/score.html b/app/test/task/testdata/goldens/packages/oxygen/score.html
index 057560fd08..f52d3b6f6c 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/score.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/score.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions.html b/app/test/task/testdata/goldens/packages/oxygen/versions.html
index 6c13e323a2..2f7a84f3ca 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0.html b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0.html
index 593401c5fb..58e2eea812 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/changelog.html b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/changelog.html
index 7486494f31..f7a9867282 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/changelog.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/changelog.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/example.html b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/example.html
index 6ceb56bc0f..4ec4676e31 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/example.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/example.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/install.html b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/install.html
index dbb3131489..4f681afbb6 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/install.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/install.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/license.html b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/license.html
index 032b5acc82..a93195ad18 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/license.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/license.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/score.html b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/score.html
index f4c7d3004b..15d07a4098 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/score.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions/1.0.0/score.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">
diff --git a/app/test/task/testdata/goldens/packages/oxygen/versions/2.0.0.html b/app/test/task/testdata/goldens/packages/oxygen/versions/2.0.0.html
index 56563985e0..150bbcc81f 100644
--- a/app/test/task/testdata/goldens/packages/oxygen/versions/2.0.0.html
+++ b/app/test/task/testdata/goldens/packages/oxygen/versions/2.0.0.html
@@ -43,7 +43,7 @@
       <div class="site-header-mask"></div>
       <div class="site-header-search">
         <form action="/packages" method="GET">
-          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on"/>
+          <input class="site-header-search-input" name="q" placeholder="New search..." autocomplete="on" title="Search" aria-label="Search"/>
         </form>
       </div>
       <div class="site-header-nav scroll-container">