From a7b9e4568edd7e5da67996f35b7c8a665d79310f Mon Sep 17 00:00:00 2001
From: Tugamer89 <61603718+Tugamer89@users.noreply.github.com>
Date: Thu, 11 Jun 2026 05:34:01 +0000
Subject: [PATCH] fix(ui): improve screen reader feedback for code snippet copy
 action

Replaced inline aria-live attributes with a dedicated, visually hidden sr-announcer div, allowing reliable screen reader announcements when the user copies a code snippet to their clipboard.

Co-authored-by: google-labs-jules[bot] <161369871+google-labs-jules[bot]@users.noreply.github.com>
---
 pom.xml | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/pom.xml b/pom.xml
index 598456d0..31cc6d0b 100644
--- a/pom.xml
+++ b/pom.xml
@@ -206,6 +206,22 @@
                         <script>
                             window.addEventListener('load', function() {
                                 hljs.highlightAll();
+
+                                var srAnnouncer = document.createElement('div');
+                                srAnnouncer.id = 'sr-announcer';
+                                srAnnouncer.setAttribute('aria-live', 'polite');
+                                srAnnouncer.setAttribute('aria-atomic', 'true');
+                                srAnnouncer.style.position = 'absolute';
+                                srAnnouncer.style.width = '1px';
+                                srAnnouncer.style.height = '1px';
+                                srAnnouncer.style.padding = '0';
+                                srAnnouncer.style.margin = '-1px';
+                                srAnnouncer.style.overflow = 'hidden';
+                                srAnnouncer.style.clip = 'rect(0, 0, 0, 0)';
+                                srAnnouncer.style.whiteSpace = 'nowrap';
+                                srAnnouncer.style.border = '0';
+                                document.body.appendChild(srAnnouncer);
+
                                 document.querySelectorAll('pre').forEach(function(el) {
                                     el.setAttribute('tabindex', '0');
                                     el.setAttribute('role', 'region');
@@ -221,18 +237,17 @@
                                     copyBtn.className = 'copy-btn';
                                     copyBtn.setAttribute('aria-label', 'Copy code');
                                     copyBtn.setAttribute('title', 'Copy code');
-                                    copyBtn.setAttribute('aria-live', 'polite');
                                     copyBtn.innerHTML = '<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>';
 
                                     copyBtn.addEventListener('click', function() {
                                         navigator.clipboard.writeText(el.innerText).then(function() {
                                             copyBtn.classList.add('copied');
-                                            copyBtn.setAttribute('aria-label', 'Copied!');
+                                            document.getElementById('sr-announcer').textContent = 'Code copied to clipboard';
                                             copyBtn.setAttribute('title', 'Copied!');
                                             copyBtn.innerHTML = '<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="#1a7f37" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>';
                                             setTimeout(function() {
                                                 copyBtn.classList.remove('copied');
-                                                copyBtn.setAttribute('aria-label', 'Copy code');
+                                                document.getElementById('sr-announcer').textContent = '';
                                                 copyBtn.setAttribute('title', 'Copy code');
                                                 copyBtn.innerHTML = '<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>';
                                             }, 2000);