diff --git a/app/assets/javascripts/fileUpload.js b/app/assets/javascripts/fileUpload.js index e03dc906d..19c53b971 100644 --- a/app/assets/javascripts/fileUpload.js +++ b/app/assets/javascripts/fileUpload.js @@ -10,11 +10,13 @@ function announceUploadStatusFromElement() { if (message) { srRegion.textContent = ''; setTimeout(() => { - srRegion.textContent = message; - }, 50); + srRegion.textContent = message + '\u00A0'; // add a non-breaking space + srRegion.focus(); // Optional + }, 300); } } + // Exported for use in tests function initUploadStatusAnnouncer() { document.addEventListener('DOMContentLoaded', () => { diff --git a/app/templates/base.html b/app/templates/base.html index aeec8b6e9..c5ee1ab42 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -14,6 +14,7 @@
diff --git a/tests/javascripts/fileUpload.domLoad.test.js b/tests/javascripts/fileUpload.domLoad.test.js index 1fb641a8c..07886bd61 100644 --- a/tests/javascripts/fileUpload.domLoad.test.js +++ b/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'); }); diff --git a/tests/javascripts/fileUpload.test.js b/tests/javascripts/fileUpload.test.js index e45c45e7a..9e99bde63 100644 --- a/tests/javascripts/fileUpload.test.js +++ b/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');