Changing alert back to a focus and fixing tests

app/assets/javascripts/fileUpload.js

@@ -10,11 +10,13 @@ function announceUploadStatusFromElement() {
   if (message) {
     srRegion.textContent = '';
     setTimeout(() => {
-      srRegion.textContent = message;
+      srRegion.textContent = message + '\u00A0'; // add a non-breaking space
-    }, 50);
+      srRegion.focus(); // Optional
+    }, 300);
   }
 }
 
+
 // Exported for use in tests
 function initUploadStatusAnnouncer() {
   document.addEventListener('DOMContentLoaded', () => {

app/templates/base.html

@@ -14,6 +14,7 @@
     <div id="upload-status-live"
       class="usa-sr-only"
       aria-live="assertive"
+      tabindex="-1"
       role="status">
     </div>
     <script nonce="{{ csp_nonce() }}">document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');</script>

tests/javascripts/fileUpload.domLoad.test.js

@@ -19,8 +19,8 @@ test('writes upload message to the live region on DOMContentLoaded', () => {
   document.dispatchEvent(new Event('DOMContentLoaded'));
 
   // Live region will be cleared first, then updated
-  jest.advanceTimersByTime(50);
+  jest.advanceTimersByTime(300);
 
   const srRegion = document.getElementById('upload-status-live');
-  expect(srRegion.textContent).toBe('File upload successful');
+  expect(srRegion.textContent).toBe('File upload successful\u00A0');
 });

tests/javascripts/fileUpload.test.js

@@ -146,10 +146,10 @@ describe('announceUploadStatusFromElement', () => {
     expect(srRegion.textContent).toBe('');
 
     // Fast-forward the timer
-    jest.advanceTimersByTime(50);
+    jest.advanceTimersByTime(300);
 
     // Confirm it updates after delay
-    expect(srRegion.textContent).toBe('File upload failed');
+    expect(srRegion.textContent).toBe('File upload failed\u00A0');
   });
 
   test('announces success message from #upload-success if no error is present', () => {
@@ -163,9 +163,9 @@ describe('announceUploadStatusFromElement', () => {
 
     expect(srRegion.textContent).toBe('');
 
-    jest.advanceTimersByTime(50);
+    jest.advanceTimersByTime(301);
 
-    expect(srRegion.textContent).toBe('File upload successful');
+    expect(srRegion.textContent).toBe('File upload successful\u00A0');
   });
 
   test('does nothing if neither success nor error is present', () => {
@@ -178,7 +178,7 @@ describe('announceUploadStatusFromElement', () => {
     // Should not clear or update if no message element is found
     expect(srRegion.textContent).toBe('Old message');
 
-    jest.advanceTimersByTime(50);
+    jest.advanceTimersByTime(300);
 
     // Still unchanged
     expect(srRegion.textContent).toBe('Old message');