From 6780abb37c97d0b420d033cfbd63b53eeeddfe68 Mon Sep 17 00:00:00 2001
From: Andrew Harvey <andrew.harvey4@gmail.com>
Date: Mon, 31 Oct 2016 21:38:47 +1100
Subject: [PATCH] use aria-label on control buttons

---
 js/ui/control/geolocate_control.js  | 1 +
 js/ui/control/navigation_control.js | 9 +++++----
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/js/ui/control/geolocate_control.js b/js/ui/control/geolocate_control.js
index e6ff8a29a1a..ffbb618bbd9 100644
--- a/js/ui/control/geolocate_control.js
+++ b/js/ui/control/geolocate_control.js
@@ -33,6 +33,7 @@ class GeolocateControl extends Control {
 
         this._geolocateButton = DOM.create('button', (`${className}-icon ${className}-geolocate`), this._container);
         this._geolocateButton.type = 'button';
+        this._geolocateButton.setAttribute('aria-label', 'Geolocate');
         this._geolocateButton.addEventListener('click', this._onClickGeolocate.bind(this));
         return container;
     }
diff --git a/js/ui/control/navigation_control.js b/js/ui/control/navigation_control.js
index 6587894c3fc..6f1ed536ff6 100644
--- a/js/ui/control/navigation_control.js
+++ b/js/ui/control/navigation_control.js
@@ -28,9 +28,9 @@ class NavigationControl extends Control {
         const container = this._container = DOM.create('div', `${className}-group`, map.getContainer());
         this._container.addEventListener('contextmenu', this._onContextMenu.bind(this));
 
-        this._zoomInButton = this._createButton(`${className}-icon ${className}-zoom-in`, map.zoomIn.bind(map));
-        this._zoomOutButton = this._createButton(`${className}-icon ${className}-zoom-out`, map.zoomOut.bind(map));
-        this._compass = this._createButton(`${className}-icon ${className}-compass`, map.resetNorth.bind(map));
+        this._zoomInButton = this._createButton(`${className}-icon ${className}-zoom-in`, 'Zoom In', map.zoomIn.bind(map));
+        this._zoomOutButton = this._createButton(`${className}-icon ${className}-zoom-out`, 'Zoom Out', map.zoomOut.bind(map));
+        this._compass = this._createButton(`${className}-icon ${className}-compass`, 'Reset North', map.resetNorth.bind(map));
 
         this._compassArrow = DOM.create('span', 'arrow', this._compass);
 
@@ -79,9 +79,10 @@ class NavigationControl extends Control {
         e.stopPropagation();
     }
 
-    _createButton(className, fn) {
+    _createButton(className, ariaLabel, fn) {
         const a = DOM.create('button', className, this._container);
         a.type = 'button';
+        a.setAttribute('aria-label', ariaLabel);
         a.addEventListener('click', () => { fn(); });
         return a;
     }