A11Y: add live area for search menu, labels (#19061)

app/assets/javascripts/discourse/app/widgets/search-menu-results.js

@@ -90,6 +90,12 @@ function createSearchResult({ type, linkField, builder }) {
   return createWidget(`search-result-${type}`, {
     tagName: "ul.list",
 
+    buildAttributes() {
+      return {
+        "aria-label": `${type} ${I18n.t("search.results")}`,
+      };
+    },
+
     html(attrs) {
       return attrs.results.map((r) => {
         let searchResultId;
@@ -640,7 +646,13 @@ createWidget("search-menu-assistant-item", {
     const attributes = {};
     attributes.href = "#";
 
-    let content = [iconNode(attrs.icon || "search")];
+    let content = [
+      h(
+        "span",
+        { attributes: { "aria-label": I18n.t("search.title") } },
+        iconNode(attrs.icon || "search")
+      ),
+    ];
 
     if (prefix) {
       content.push(h("span.search-item-prefix", `${prefix} `));

app/assets/javascripts/discourse/app/widgets/search-menu.js

@@ -193,6 +193,12 @@ export default createWidget("search-menu", {
   services: ["search"],
   searchData,
 
+  buildAttributes() {
+    return {
+      "aria-live": "polite",
+    };
+  },
+
   buildKey: () => "search-menu",
 
   defaultState(attrs) {

config/locales/client.en.yml

@@ -2500,6 +2500,7 @@ en:
         other: "<span>%{count}%{plus} results for</span><span class='term'>%{term}</span>"
       title: "Search"
       full_page_title: "Search"
+      results: "results"
       no_results: "No results found."
       no_more_results: "No more results found."
       post_format: "#%{post_number} by %{username}"