From 1a3ca94efbd7283bc3e72dca890128255585be96 Mon Sep 17 00:00:00 2001
From: MokireddySampath <120497218+MokireddySampath@users.noreply.github.com>
Date: Mon, 14 Aug 2023 21:48:25 +0530
Subject: [PATCH] Bug 2262682:Screen reader is not announcing the updated
 deleting status information after deleting the container. (#1563)

---
 .../NotificationConsole/NotificationConsoleComponent.tsx      | 4 +++-
 .../__snapshots__/NotificationConsoleComponent.test.tsx.snap  | 4 ++++
 src/Main.tsx                                                  | 2 +-
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx b/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
index f7cacc16c..ecef25315 100644
--- a/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
+++ b/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
@@ -122,7 +122,9 @@ export class NotificationConsoleComponent extends React.Component<
             {userContext.features.pr && <PrPreview pr={userContext.features.pr} />}
             <span className="consoleSplitter" />
             <span className="headerStatus">
-              <span className="headerStatusEllipsis">{this.state.headerStatus}</span>
+              <span className="headerStatusEllipsis" aria-live="assertive" aria-atomic="true">
+                {this.state.headerStatus}
+              </span>
             </span>
           </div>
           <div
diff --git a/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap b/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap
index 2bd748bc3..395af2a2c 100644
--- a/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap
+++ b/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap
@@ -64,6 +64,8 @@ exports[`NotificationConsoleComponent renders the console 1`] = `
         className="headerStatus"
       >
         <span
+          aria-atomic="true"
+          aria-live="assertive"
           className="headerStatusEllipsis"
         />
       </span>
@@ -225,6 +227,8 @@ exports[`NotificationConsoleComponent renders the console 2`] = `
         className="headerStatus"
       >
         <span
+          aria-atomic="true"
+          aria-live="assertive"
           className="headerStatusEllipsis"
         >
           message
diff --git a/src/Main.tsx b/src/Main.tsx
index 9b8087de0..a7f35eb6a 100644
--- a/src/Main.tsx
+++ b/src/Main.tsx
@@ -83,7 +83,7 @@ const App: React.FunctionComponent = () => {
   }
 
   return (
-    <div className="flexContainer">
+    <div className="flexContainer" aria-hidden="false">
       <div id="divExplorer" className="flexContainer hideOverflows">
         <div id="freeTierTeachingBubble"> </div>
         {/* Main Command Bar - Start */}