fix(copilot): address code review comments for screen reader announcers, visual emoji ordering, and visually-hidden clip-path

Author: ThisIs-Developer

desktop-app/resources/js/script.js

@@ -3064,7 +3064,10 @@ This is a fully client-side application. Your content never leaves your browser
 
     function insertEmojis() {
       if (!emojiSelection.size) return;
-      const ordered = Array.from(emojiSelection);
+      // Retain the modal's visual/definition order of emojis, consistent with the Symbols modal
+      const ordered = emojiItems
+        .filter(item => emojiSelection.has(item.shortcode))
+        .map(item => item.shortcode);
       const insertion = ordered.join(' ');
       modal.style.display = 'none';
       cleanup();
@@ -7195,12 +7198,12 @@ This is a fully client-side application. Your content never leaves your browser
   // Accessibility dynamic screen reader announcer helper
   function announceToScreenReader(message) {
     const announcer = document.getElementById('app-accessibility-announcer');
-    if (announcer) {
-      announcer.textContent = '';
-      setTimeout(() => {
-        announcer.textContent = message;
-      }, 50);
-    }
+    if (!announcer) return;
+    announcer.textContent = '';
+    clearTimeout(announceToScreenReader._timeoutId);
+    announceToScreenReader._timeoutId = setTimeout(() => {
+      announcer.textContent = message;
+    }, 50);
   }
 
   // Visual skeleton loader generator for emoji list

desktop-app/resources/styles.css

@@ -3487,6 +3487,7 @@ html[lang="ko"] .markdown-body h1, html[lang="ko"] .markdown-body h2, html[lang=
   margin: -1px !important;
   overflow: hidden !important;
   clip: rect(0, 0, 0, 0) !important;
+  clip-path: inset(50%) !important;
   white-space: nowrap !important;
   border: 0 !important;
 }

script.js

@@ -3064,7 +3064,10 @@ This is a fully client-side application. Your content never leaves your browser
 
     function insertEmojis() {
       if (!emojiSelection.size) return;
-      const ordered = Array.from(emojiSelection);
+      // Retain the modal's visual/definition order of emojis, consistent with the Symbols modal
+      const ordered = emojiItems
+        .filter(item => emojiSelection.has(item.shortcode))
+        .map(item => item.shortcode);
       const insertion = ordered.join(' ');
       modal.style.display = 'none';
       cleanup();
@@ -7195,12 +7198,12 @@ This is a fully client-side application. Your content never leaves your browser
   // Accessibility dynamic screen reader announcer helper
   function announceToScreenReader(message) {
     const announcer = document.getElementById('app-accessibility-announcer');
-    if (announcer) {
-      announcer.textContent = '';
-      setTimeout(() => {
-        announcer.textContent = message;
-      }, 50);
-    }
+    if (!announcer) return;
+    announcer.textContent = '';
+    clearTimeout(announceToScreenReader._timeoutId);
+    announceToScreenReader._timeoutId = setTimeout(() => {
+      announcer.textContent = message;
+    }, 50);
   }
 
   // Visual skeleton loader generator for emoji list

styles.css

@@ -3487,6 +3487,7 @@ html[lang="ko"] .markdown-body h1, html[lang="ko"] .markdown-body h2, html[lang=
   margin: -1px !important;
   overflow: hidden !important;
   clip: rect(0, 0, 0, 0) !important;
+  clip-path: inset(50%) !important;
   white-space: nowrap !important;
   border: 0 !important;
 }

sw.js

@@ -1,4 +1,4 @@
-const CACHE_NAME = 'markdown-viewer-cache-v3.6.9';
+const CACHE_NAME = 'markdown-viewer-cache-v3.7.0';
 const ASSETS = [
   './',
   './index.html',