Enhance accessibility by adding ARIA attributes and making thinking m…

…essage focusable
microsoft · Jan 2, 2025 · 8a0acab · 8a0acab
1 parent 3c2bdf2
commit 8a0acab
Showing 1 changed file with 3 additions and 0 deletions.
diff --git a/src/common/copilot/assets/scripts/copilot.js b/src/common/copilot/assets/scripts/copilot.js
@@ -317,6 +317,9 @@
                 const thinking = document.createElement("div");
                 thinking.classList.add("thinking");
                 thinking.innerText = thinkingMessage;
+                thinking.setAttribute("tabindex", "0"); // Make the element focusable
+                thinking.setAttribute("role", "status"); // Add ARIA role
+                thinking.setAttribute("aria-live", "polite"); // Ensure screen readers announce updates
 
                 messageElement.appendChild(thinking);
                 chatMessages.scrollTop = chatMessages.scrollHeight - chatMessages.clientHeight;