Add aria-labels to date-picker buttons (Fix elastic#12634)

timroes · Jul 6, 2017 · c89688b · c89688b
1 parent 4d481a2
commit c89688b
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 1 deletion.
diff --git a/src/ui/public/angular-bootstrap/datepicker/datepicker.js b/src/ui/public/angular-bootstrap/datepicker/datepicker.js
@@ -388,6 +388,7 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
 
         scope.title = [years[0].label, years[range - 1].label].join(' - ');
         scope.rows = ctrl.split(years, 5);
+        scope.yearRange = ctrl.yearRange;
       };
 
       ctrl.compare = function(date1, date2) {

diff --git a/src/ui/public/angular-bootstrap/datepicker/day.html b/src/ui/public/angular-bootstrap/datepicker/day.html
@@ -15,6 +15,7 @@
             type="button"
             class="kuiDatePickerNavigationButton"
             ng-click="move(-1)"
+            aria-label="Previous month"
           >
             <span class="kuiIcon fa-chevron-left"></span>
           </button>
@@ -35,6 +36,7 @@
             type="button"
             class="kuiDatePickerNavigationButton"
             ng-click="move(1)"
+            aria-label="Next month"
           >
             <span class="kuiIcon fa-chevron-right"></span>
           </button>

diff --git a/src/ui/public/angular-bootstrap/datepicker/month.html b/src/ui/public/angular-bootstrap/datepicker/month.html
@@ -15,6 +15,7 @@
             type="button"
             class="kuiDatePickerNavigationButton"
             ng-click="move(-1)"
+            aria-label="Previous year"
           >
             <span class="kuiIcon fa-chevron-left"></span>
           </button>
@@ -35,6 +36,7 @@
             type="button"
             class="kuiDatePickerNavigationButton"
             ng-click="move(1)"
+            aria-label="Next year"
           >
             <span class="kuiIcon fa-chevron-right"></span>
           </button>

diff --git a/src/ui/public/angular-bootstrap/datepicker/year.html b/src/ui/public/angular-bootstrap/datepicker/year.html
@@ -15,6 +15,7 @@
             type="button"
             class="kuiDatePickerNavigationButton"
             ng-click="move(-1)"
+            aria-label="Previous {{yearRange}} years"
           >
             <span class="kuiIcon fa-chevron-left"></span>
           </button>
@@ -35,6 +36,7 @@
             type="button"
             class="kuiDatePickerNavigationButton"
             ng-click="move(1)"
+            aria-label="Next {{yearRange}} years"
           >
             <span class="kuiIcon fa-chevron-right"></span>
           </button>

diff --git a/src/ui/public/kbn_top_nav/kbn_top_nav.html b/src/ui/public/kbn_top_nav/kbn_top_nav.html
@@ -41,7 +41,7 @@
     class="kuiLocalDropdown"
     ng-show="kbnTopNav.rendered"
   >
-    <button class="kuiLocalDropdownCloseButton" ng-click="kbnTopNav.close()">
+    <button class="kuiLocalDropdownCloseButton" ng-click="kbnTopNav.close()" aria-label="Close">
       <span class="kuiIcon fa-chevron-circle-up"></span>
     </button>
     <div id="template_wrapper">