From 7aa846343815105e3576e6aa20eac64fcb0edf8d Mon Sep 17 00:00:00 2001
From: Benjamin Staneck <staneck@gmail.com>
Date: Sun, 30 Apr 2023 06:05:21 +0200
Subject: [PATCH] Fixed some aria violations

---
 .../src/Components/DescriptionList/DescriptionListItem.js     | 4 ++--
 frontend/src/Components/Link/IconButton.js                    | 1 +
 frontend/src/Components/Page/Header/PageHeader.js             | 2 ++
 frontend/src/Components/Page/Header/PageHeaderActionsMenu.js  | 2 +-
 frontend/src/Components/ProgressBar.js                        | 4 +++-
 5 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/frontend/src/Components/DescriptionList/DescriptionListItem.js b/frontend/src/Components/DescriptionList/DescriptionListItem.js
index ee26b5323..931557045 100644
--- a/frontend/src/Components/DescriptionList/DescriptionListItem.js
+++ b/frontend/src/Components/DescriptionList/DescriptionListItem.js
@@ -18,7 +18,7 @@ class DescriptionListItem extends Component {
     } = this.props;
 
     return (
-      <span className={className}>
+      <div className={className}>
         <DescriptionListItemTitle
           className={titleClassName}
         >
@@ -30,7 +30,7 @@ class DescriptionListItem extends Component {
         >
           {data}
         </DescriptionListItemDescription>
-      </span>
+      </div>
     );
   }
 }
diff --git a/frontend/src/Components/Link/IconButton.js b/frontend/src/Components/Link/IconButton.js
index 3311c14d6..6f5e56d0e 100644
--- a/frontend/src/Components/Link/IconButton.js
+++ b/frontend/src/Components/Link/IconButton.js
@@ -23,6 +23,7 @@ function IconButton(props) {
         className,
         isDisabled && styles.isDisabled
       )}
+      aria-label="Table Options Button"
       isDisabled={isDisabled}
       {...otherProps}
     >
diff --git a/frontend/src/Components/Page/Header/PageHeader.js b/frontend/src/Components/Page/Header/PageHeader.js
index edc81eca2..46abcd013 100644
--- a/frontend/src/Components/Page/Header/PageHeader.js
+++ b/frontend/src/Components/Page/Header/PageHeader.js
@@ -58,6 +58,7 @@ class PageHeader extends Component {
             <img
               className={styles.logo}
               src={`${window.Sonarr.urlBase}/Content/Images/logo.svg`}
+              alt="Sonarr Logo"
             />
           </Link>
         </div>
@@ -76,6 +77,7 @@ class PageHeader extends Component {
           <IconButton
             className={styles.donate}
             name={icons.HEART}
+            aria-label="Donate"
             to="https://sonarr.tv/donate.html"
             size={14}
           />
diff --git a/frontend/src/Components/Page/Header/PageHeaderActionsMenu.js b/frontend/src/Components/Page/Header/PageHeaderActionsMenu.js
index 6125b9e5b..1df8e4b7a 100644
--- a/frontend/src/Components/Page/Header/PageHeaderActionsMenu.js
+++ b/frontend/src/Components/Page/Header/PageHeaderActionsMenu.js
@@ -20,7 +20,7 @@ function PageHeaderActionsMenu(props) {
   return (
     <div>
       <Menu alignMenu={align.RIGHT}>
-        <MenuButton className={styles.menuButton}>
+        <MenuButton className={styles.menuButton} aria-label="Menu Button">
           <Icon
             name={icons.INTERACTIVE}
           />
diff --git a/frontend/src/Components/ProgressBar.js b/frontend/src/Components/ProgressBar.js
index b97d8d577..8d8eef38c 100644
--- a/frontend/src/Components/ProgressBar.js
+++ b/frontend/src/Components/ProgressBar.js
@@ -56,7 +56,9 @@ function ProgressBar(props) {
                 styles[kind],
                 enableColorImpairedMode && 'colorImpaired'
               )}
-              aria-valuenow={progress}
+              role="meter"
+              aria-label={`Progress Bar at ${progress.toFixed(0)}%`}
+              aria-valuenow={progress.toFixed(0)}
               aria-valuemin="0"
               aria-valuemax="100"
               style={{ width: progressPercent }}