@@ -176,6 +176,9 @@ class EngineScriptDashboard {
176176 pageTitle . textContent = this . getPageTitle ( pageName ) ;
177177 }
178178
179+ // Announce page change to screen readers
180+ this . announceToScreenReader ( `Navigated to ${ this . getPageTitle ( pageName ) } page` ) ;
181+
179182 // Load page-specific data
180183 this . loadPageData ( pageName ) ;
181184 this . state . setCurrentPage ( pageName ) ;
@@ -436,6 +439,7 @@ class EngineScriptDashboard {
436439 this . showRefreshAnimation ( ) ;
437440 this . loadPageData ( currentPage ) ;
438441 this . updateLastRefresh ( ) ;
442+ this . announceToScreenReader ( "Dashboard refreshed" ) ;
439443 }
440444
441445 showRefreshAnimation ( ) {
@@ -502,6 +506,18 @@ class EngineScriptDashboard {
502506 }
503507 }
504508 } ) ;
509+
510+ // Announce service status to screen readers
511+ const statusSummary = [ "nginx" , "php" , "mysql" , "redis" ]
512+ . map ( s => {
513+ const st = services [ s ] ;
514+ return st ? `${ s } : ${ st . online ? "online" : "offline" } ` : null ;
515+ } )
516+ . filter ( Boolean )
517+ . join ( ", " ) ;
518+ if ( statusSummary ) {
519+ this . announceToScreenReader ( `Service status loaded. ${ statusSummary } ` ) ;
520+ }
505521 } catch ( error ) {
506522 console . error ( 'Failed to load service status:' , error ) ;
507523 // Set all services to error state
@@ -538,10 +554,12 @@ class EngineScriptDashboard {
538554 sitesGrid . appendChild ( siteElement ) ;
539555 }
540556 } ) ;
557+ this . announceToScreenReader ( `${ sites . length } WordPress site${ sites . length !== 1 ? 's' : '' } loaded` ) ;
541558 } else {
542559 // Create no sites found element
543560 const noSitesElement = this . createNoSitesElement ( ) ;
544561 sitesGrid . appendChild ( noSitesElement ) ;
562+ this . announceToScreenReader ( 'No WordPress sites found' ) ;
545563 }
546564 }
547565 } catch ( error ) {
@@ -605,6 +623,8 @@ class EngineScriptDashboard {
605623 const infoElement = this . createInfoElement ( item . label , item . value ) ;
606624 systemInfo . appendChild ( infoElement ) ;
607625 } ) ;
626+
627+ this . announceToScreenReader ( 'System information loaded' ) ;
608628 }
609629
610630 } catch ( error ) {
@@ -924,6 +944,8 @@ class EngineScriptDashboard {
924944 this . setTextContent ( "total-monitors" , totalCount ) ;
925945 this . setTextContent ( "up-monitors" , upCount ) ;
926946 this . setTextContent ( "down-monitors" , downCount ) ;
947+
948+ this . announceToScreenReader ( `Uptime monitoring: ${ upCount } online, ${ downCount } offline out of ${ totalCount } sites` ) ;
927949 } else {
928950 this . showUptimeNotConfigured ( ) ;
929951 }
@@ -1155,6 +1177,26 @@ class EngineScriptDashboard {
11551177 this . setTextContent ( "down-monitors" , 0 ) ;
11561178 }
11571179
1180+ /**
1181+ * Announce a message to screen readers via a live region
1182+ */
1183+ announceToScreenReader ( message ) {
1184+ let liveRegion = document . getElementById ( 'es-dashboard-live-region' ) ;
1185+ if ( ! liveRegion ) {
1186+ liveRegion = document . createElement ( 'div' ) ;
1187+ liveRegion . id = 'es-dashboard-live-region' ;
1188+ liveRegion . setAttribute ( 'aria-live' , 'polite' ) ;
1189+ liveRegion . setAttribute ( 'aria-atomic' , 'true' ) ;
1190+ liveRegion . className = 'sr-only' ;
1191+ document . body . appendChild ( liveRegion ) ;
1192+ }
1193+ // Clear and re-set to trigger re-announcement
1194+ liveRegion . textContent = '' ;
1195+ setTimeout ( ( ) => {
1196+ liveRegion . textContent = message ;
1197+ } , 100 ) ;
1198+ }
1199+
11581200}
11591201
11601202// Initialize dashboard when DOM is loaded
0 commit comments