Adding aria labels to nav buttons (Hacker0x01#1993)

p-rogas · Jan 6, 2020 · d984798 · d984798
1 parent bb82068
commit d984798
Showing 1 changed file with 9 additions and 3 deletions.
diff --git a/src/calendar.jsx b/src/calendar.jsx
@@ -379,14 +379,17 @@ export default class Calendar extends React.Component {
       classes.push("react-datepicker__navigation--previous--disabled");
       clickHandler = null;
     }
+
+    const isForYear = this.props.showMonthYearPicker || this.props.showQuarterYearPicker;
 
     return (
       <button
         type="button"
         className={classes.join(" ")}
         onClick={clickHandler}
+        aria-label={isForYear ? "Previous Year" : "Previous Month"}
       >
-        {this.props.showMonthYearPicker || this.props.showQuarterYearPicker
+        {isForYear 
           ? this.props.previousYearButtonLabel
           : this.props.previousMonthButtonLabel}
       </button>
@@ -441,14 +444,17 @@ export default class Calendar extends React.Component {
       classes.push("react-datepicker__navigation--next--disabled");
       clickHandler = null;
     }
-
+
+    const isForYear = this.props.showMonthYearPicker || this.props.showQuarterYearPicker;
+
     return (
       <button
         type="button"
         className={classes.join(" ")}
         onClick={clickHandler}
+        aria-label={isForYear ? "Next Year" : "Next Month"} 
       >
-        {this.props.showMonthYearPicker || this.props.showQuarterYearPicker
+        { isForYear
           ? this.props.nextYearButtonLabel
           : this.props.nextMonthButtonLabel}
       </button>