From 61f10b27bcbb9f01209946f33be53b5b3f42fdb9 Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Fri, 29 Sep 2017 20:27:49 +0200
Subject: [PATCH] Improve accessibility of Contacts menu

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 core/js/contactsmenu.js | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/core/js/contactsmenu.js b/core/js/contactsmenu.js
index 6d57ae72e6..41de10abb4 100644
--- a/core/js/contactsmenu.js
+++ b/core/js/contactsmenu.js
@@ -26,6 +26,7 @@
 	'use strict';
 
 	var MENU_TEMPLATE = ''
+			+ '<label class="hidden-visually" for="contactsmenu-search">' + t('core', 'Search contacts …') + '</label>'
 			+ '<input id="contactsmenu-search" type="search" placeholder="' + t('core', 'Search contacts …') + '" value="{{searchTerm}}">'
 			+ '<div class="content">'
 			+ '</div>';
@@ -51,7 +52,7 @@
 	var CONTACT_TEMPLATE = ''
 			+ '{{#if contact.avatar}}'
 			+ '<img src="{{contact.avatar}}&size=32" class="avatar"'
-			+ 'srcset="{{contact.avatar}}&size=32 1x, {{contact.avatar}}&size=64 2x, {{contact.avatar}}&size=128 4x">'
+			+ 'srcset="{{contact.avatar}}&size=32 1x, {{contact.avatar}}&size=64 2x, {{contact.avatar}}&size=128 4x" alt="">'
 			+ '{{else}}'
 			+ '<div class="avatar"></div>'
 			+ '{{/if}}'
@@ -61,12 +62,12 @@
 			+ '</div>'
 			+ '{{#if contact.topAction}}'
 			+ '<a class="top-action" href="{{contact.topAction.hyperlink}}" title="{{contact.topAction.title}}">'
-			+ '    <img src="{{contact.topAction.icon}}">'
+			+ '    <img src="{{contact.topAction.icon}}" alt="{{contact.topAction.title}}">'
 			+ '</a>'
 			+ '{{/if}}'
 			+ '{{#if contact.hasTwoActions}}'
 			+ '<a class="second-action" href="{{contact.secondAction.hyperlink}}" title="{{contact.secondAction.title}}">'
-			+ '    <img src="{{contact.secondAction.icon}}">'
+			+ '    <img src="{{contact.secondAction.icon}}" alt="{{contact.secondAction.title}}">'
 			+ '</a>'
 			+ '{{/if}}'
 			+ '{{#if contact.hasManyActions}}'
@@ -76,7 +77,7 @@
 			+ '            {{#each contact.actions}}'
 			+ '            <li>'
 			+ '                <a href="{{hyperlink}}">'
-			+ '                    <img src="{{icon}}">'
+			+ '                    <img src="{{icon}}" alt="">'
 			+ '                    <span>{{title}}</span>'
 			+ '                </a>'
 			+ '            </li>'
@@ -224,7 +225,7 @@
 			}));
 			this.delegateEvents();
 
-			// Show placeholder iff no avatar is available (avatar is rendered as img, not div)
+			// Show placeholder if no avatar is available (avatar is rendered as img, not div)
 			this.$('div.avatar').imageplaceholder(this._model.get('fullName'));
 
 			// Show tooltip for top action