Fixing accessibility bug (#3235)

microsoft · Sep 27, 2024 · d1fdf1b · d1fdf1b
1 parent aec0693
commit d1fdf1b
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/packages/typescriptlang-org/src/components/layout/Sidebar.tsx b/packages/typescriptlang-org/src/components/layout/Sidebar.tsx
@@ -122,7 +122,7 @@ export const Sidebar = (props: Props) => {
   }
 
   return (
-    <nav id="sidebar">
+    <nav aria-label="sidebar" id="sidebar">
       <ul>
         {props.navItems.map(item => <RenderItem key={item.id} item={item} openAllSectionsExceptWhatsNew={props.openAllSectionsExceptWhatsNew} selectedID={props.selectedID} />)}
       </ul>

diff --git a/packages/typescriptlang-org/src/components/layout/TopNav.tsx b/packages/typescriptlang-org/src/components/layout/TopNav.tsx
@@ -98,7 +98,7 @@ export const SiteNav = (props: Props) => {
             <span className="hide-small">TypeScript</span>
           </IntlLink>
 
-          <nav role="navigation">
+          <nav aria-label="top menu">
             <ul role="tablist" aria-owns="tab1 tab2 tab3 tab4 tab5 tab6" aria-busy="true">
             <li className="nav-item hide-small" role="none presentation" ><IntlLink id="tab1" role="tab" to="/download">{i("nav_download")}</IntlLink></li>
               <li className="nav-item" role="none presentation"><IntlLink id="tab2" role="tab" to="/docs/"><span>{i("nav_documentation_short")}</span></IntlLink></li>

diff --git a/packages/typescriptlang-org/src/templates/documentation.tsx b/packages/typescriptlang-org/src/templates/documentation.tsx
@@ -159,7 +159,7 @@ const HandbookTemplate: React.FC<Props> = (props) => {
             </div>
             {showSidebar &&
               <aside className="handbook-toc">
-                <nav className={deprecationURL ? "deprecated" : ""}>
+                <nav className={deprecationURL ? "deprecated" : ""} aria-label="table of contents">
                   {<>
                     <h5>{i("handb_on_this_page")}</h5>
                     <MarkdownHeadingTree tree={headerListToTree(sidebarHeaders)} className="handbook-on-this-page-section-list" slug={slug} />