replaced aria-label with title

Author: dlabaj

packages/module/src/Ansible/Ansible.tsx

@@ -71,7 +71,7 @@ const Ansible: React.FunctionComponent<AnsibleProps> = ({ unsupported, className
   );
 
   return (
-    <i className={ansibleLogoClass} aria-label={unsupported ? "Ansible is not supported" : "Ansible supported" }{...props}>
+    <i className={ansibleLogoClass} title={unsupported ? "Ansible is not supported" : "Ansible supported" }{...props}>
       <svg
         version="1.1"
         x="0px"

packages/module/src/Ansible/__snapshots__/Ansible.test.tsx.snap

@@ -3,8 +3,8 @@
 exports[`Ansible component should render supported - boolean 1`] = `
 <div>
   <i
-    aria-label="Ansible supported"
     class="ansible-0-2-1 ansibleSupported-0-2-2"
+    title="Ansible supported"
   >
     <svg
       style="enable-background: new 0 0 2032 2027.2;"
@@ -28,8 +28,8 @@ exports[`Ansible component should render supported - boolean 1`] = `
 exports[`Ansible component should render supported - number 1`] = `
 <div>
   <i
-    aria-label="Ansible supported"
     class="ansible-0-2-1 ansibleSupported-0-2-2"
+    title="Ansible supported"
   >
     <svg
       style="enable-background: new 0 0 2032 2027.2;"
@@ -53,8 +53,8 @@ exports[`Ansible component should render supported - number 1`] = `
 exports[`Ansible component should render unsupported - boolean 1`] = `
 <div>
   <i
-    aria-label="Ansible is not supported"
     class="ansible-0-2-1 ansibleUnsupported-0-2-3"
+    title="Ansible is not supported"
   >
     <svg
       style="enable-background: new 0 0 2032 2027.2;"
@@ -102,8 +102,8 @@ exports[`Ansible component should render unsupported - boolean 1`] = `
 exports[`Ansible component should render unsupported - number 1`] = `
 <div>
   <i
-    aria-label="Ansible is not supported"
     class="ansible-0-2-1 ansibleUnsupported-0-2-3"
+    title="Ansible is not supported"
   >
     <svg
       style="enable-background: new 0 0 2032 2027.2;"

packages/module/src/Battery/Battery.tsx

@@ -62,7 +62,7 @@ const batteryLevels = (severity: BatterySeverity, classMode?: boolean) => {
   case 'medium':
   case 'warn':
   case 2:
-    return classMode ? 'batteryMedium' : <path role="img" d="M 99.168857,327.14542 H 351.33914 c 5.33437,0 9.69886,-5.04 9.69886,-11.19999 v -28 c 0,-6.16001 -4.36449,-11.2 -9.69886,-11.2 H 99.168857 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.19999 9.698857,11.19999 z M 99.168993,419.0375 H 351.33927 c 5.33437,0 9.69886,-5.04 9.69886,-11.2 v -28 c 0,-6.16 -4.36449,-11.2 -9.69886,-11.2 H 99.168993 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.2 9.698857,11.2 z" />;
+    return classMode ? 'batteryMedium' : <path d="M 99.168857,327.14542 H 351.33914 c 5.33437,0 9.69886,-5.04 9.69886,-11.19999 v -28 c 0,-6.16001 -4.36449,-11.2 -9.69886,-11.2 H 99.168857 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.19999 9.698857,11.19999 z M 99.168993,419.0375 H 351.33927 c 5.33437,0 9.69886,-5.04 9.69886,-11.2 v -28 c 0,-6.16 -4.36449,-11.2 -9.69886,-11.2 H 99.168993 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.2 9.698857,11.2 z" />;
   case 'low':
   case 'info':
   case 1:
@@ -91,15 +91,15 @@ const Battery: React.FunctionComponent<BatteryProps> = ({ severity, label, label
   const classes = useStyles();
   const batteryClasses = clsx(classes.battery, classes[String(batteryLevels(severity, true))], className);
 
-  const ariaLabels = { ['aria-label']: `${severity} ${label}` };
+  const title = { ['title']: `${severity} ${label}` };
 
 
   const batteryVariant = useMemo(() => batteryLevels(severity) , [ severity ])
 
   return (
     <React.Fragment>
       {/* eslint-disable-next-line react/no-unknown-property */}
-      <i className={batteryClasses} {...ariaLabels} {...props} widget-type="Battery" widget-id={label}>
+      <i className={batteryClasses} {...title} {...props} widget-type="Battery" widget-id={label}>
         <svg
           version="1.1"
           x="0px"

packages/module/src/Battery/__snapshots__/Batery.test.tsx.snap

@@ -3,8 +3,8 @@
 exports[`Battery component API should hide label 1`] = `
 <div>
   <i
-    aria-label="high high"
     class="battery-0-2-1 batteryHigh-0-2-5"
+    title="high high"
     widget-id="high"
     widget-type="Battery"
   >
@@ -31,8 +31,8 @@ exports[`Battery component API should hide label 1`] = `
 exports[`Battery component should render correctly CriticalBattery - 4 1`] = `
 <div>
   <i
-    aria-label="4 4"
     class="battery-0-2-1 batteryCritical-0-2-6"
+    title="4 4"
     widget-id="4"
     widget-type="Battery"
   >
@@ -64,8 +64,8 @@ exports[`Battery component should render correctly CriticalBattery - 4 1`] = `
 exports[`Battery component should render correctly CriticalBattery - critical 1`] = `
 <div>
   <i
-    aria-label="critical critical"
     class="battery-0-2-1 batteryCritical-0-2-6"
+    title="critical critical"
     widget-id="critical"
     widget-type="Battery"
   >
@@ -97,8 +97,8 @@ exports[`Battery component should render correctly CriticalBattery - critical 1`
 exports[`Battery component should render correctly HighBattery - 3 1`] = `
 <div>
   <i
-    aria-label="3 3"
     class="battery-0-2-1 batteryHigh-0-2-5"
+    title="3 3"
     widget-id="3"
     widget-type="Battery"
   >
@@ -130,8 +130,8 @@ exports[`Battery component should render correctly HighBattery - 3 1`] = `
 exports[`Battery component should render correctly HighBattery - error 1`] = `
 <div>
   <i
-    aria-label="error error"
     class="battery-0-2-1 batteryHigh-0-2-5"
+    title="error error"
     widget-id="error"
     widget-type="Battery"
   >
@@ -163,8 +163,8 @@ exports[`Battery component should render correctly HighBattery - error 1`] = `
 exports[`Battery component should render correctly HighBattery - high 1`] = `
 <div>
   <i
-    aria-label="high high"
     class="battery-0-2-1 batteryHigh-0-2-5"
+    title="high high"
     widget-id="high"
     widget-type="Battery"
   >
@@ -196,8 +196,8 @@ exports[`Battery component should render correctly HighBattery - high 1`] = `
 exports[`Battery component should render correctly LowBattery - 1 1`] = `
 <div>
   <i
-    aria-label="1 1"
     class="battery-0-2-1 batteryLow-0-2-3"
+    title="1 1"
     widget-id="1"
     widget-type="Battery"
   >
@@ -229,8 +229,8 @@ exports[`Battery component should render correctly LowBattery - 1 1`] = `
 exports[`Battery component should render correctly LowBattery - info 1`] = `
 <div>
   <i
-    aria-label="info info"
     class="battery-0-2-1 batteryLow-0-2-3"
+    title="info info"
     widget-id="info"
     widget-type="Battery"
   >
@@ -262,8 +262,8 @@ exports[`Battery component should render correctly LowBattery - info 1`] = `
 exports[`Battery component should render correctly LowBattery - low 1`] = `
 <div>
   <i
-    aria-label="low low"
     class="battery-0-2-1 batteryLow-0-2-3"
+    title="low low"
     widget-id="low"
     widget-type="Battery"
   >
@@ -295,8 +295,8 @@ exports[`Battery component should render correctly LowBattery - low 1`] = `
 exports[`Battery component should render correctly MediumBattery - 2 1`] = `
 <div>
   <i
-    aria-label="2 2"
     class="battery-0-2-1 batteryMedium-0-2-4"
+    title="2 2"
     widget-id="2"
     widget-type="Battery"
   >
@@ -314,7 +314,6 @@ exports[`Battery component should render correctly MediumBattery - 2 1`] = `
       />
       <path
         d="M 99.168857,327.14542 H 351.33914 c 5.33437,0 9.69886,-5.04 9.69886,-11.19999 v -28 c 0,-6.16001 -4.36449,-11.2 -9.69886,-11.2 H 99.168857 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.19999 9.698857,11.19999 z M 99.168993,419.0375 H 351.33927 c 5.33437,0 9.69886,-5.04 9.69886,-11.2 v -28 c 0,-6.16 -4.36449,-11.2 -9.69886,-11.2 H 99.168993 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.2 9.698857,11.2 z"
-        role="img"
       />
     </svg>
   </i>
@@ -329,8 +328,8 @@ exports[`Battery component should render correctly MediumBattery - 2 1`] = `
 exports[`Battery component should render correctly MediumBattery - medium 1`] = `
 <div>
   <i
-    aria-label="medium medium"
     class="battery-0-2-1 batteryMedium-0-2-4"
+    title="medium medium"
     widget-id="medium"
     widget-type="Battery"
   >
@@ -348,7 +347,6 @@ exports[`Battery component should render correctly MediumBattery - medium 1`] =
       />
       <path
         d="M 99.168857,327.14542 H 351.33914 c 5.33437,0 9.69886,-5.04 9.69886,-11.19999 v -28 c 0,-6.16001 -4.36449,-11.2 -9.69886,-11.2 H 99.168857 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.19999 9.698857,11.19999 z M 99.168993,419.0375 H 351.33927 c 5.33437,0 9.69886,-5.04 9.69886,-11.2 v -28 c 0,-6.16 -4.36449,-11.2 -9.69886,-11.2 H 99.168993 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.2 9.698857,11.2 z"
-        role="img"
       />
     </svg>
   </i>
@@ -363,8 +361,8 @@ exports[`Battery component should render correctly MediumBattery - medium 1`] =
 exports[`Battery component should render correctly MediumBattery - warn 1`] = `
 <div>
   <i
-    aria-label="warn warn"
     class="battery-0-2-1 batteryMedium-0-2-4"
+    title="warn warn"
     widget-id="warn"
     widget-type="Battery"
   >
@@ -382,7 +380,6 @@ exports[`Battery component should render correctly MediumBattery - warn 1`] = `
       />
       <path
         d="M 99.168857,327.14542 H 351.33914 c 5.33437,0 9.69886,-5.04 9.69886,-11.19999 v -28 c 0,-6.16001 -4.36449,-11.2 -9.69886,-11.2 H 99.168857 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.19999 9.698857,11.19999 z M 99.168993,419.0375 H 351.33927 c 5.33437,0 9.69886,-5.04 9.69886,-11.2 v -28 c 0,-6.16 -4.36449,-11.2 -9.69886,-11.2 H 99.168993 c -5.334371,0 -9.698857,5.04 -9.698857,11.2 v 28 c 0,6.16 4.364486,11.2 9.698857,11.2 z"
-        role="img"
       />
     </svg>
   </i>
@@ -397,8 +394,8 @@ exports[`Battery component should render correctly MediumBattery - warn 1`] = `
 exports[`Battery component should render correctly NullBatery, default 1`] = `
 <div>
   <i
-    aria-label=" "
     class="battery-0-2-1 batteryDefault-0-2-2"
+    title=" "
     widget-id=""
     widget-type="Battery"
   >