Koha-community/Koha
13
7
Fork 0
Code Issues Releases Wiki Activity

Bug 27496: Accessibility: Navigation buttons are poorly described by screen readers

Browse source 
This patch adds aria-haspopup and aria-expanded attributes to the language
    and welcome user buttons so that screen readers will know that they cause a
    popup menu to be displayed.

    To test:
    1. Use an installation with at least 2 active languages
    2. Log in the OPAC
    3. Use a screen reader (e.g. ChromeVox in Chrome) and use the tab key to
       navigate to the language and welcome user buttons while noticing that
       they are described as "Button collapsed" and "Button", respectively
    4. Alternatively, inspect the buttons and notice that they are missing
       aria-haspopup and aria-expanded attributes
    5. Apply the patch
    6. Observe that these buttons now are described as "Popup button collapsed"
       or that they contain the aria-haspopup and aria-expanded attributes like
       the lists button
    7. Sign off

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
(cherry picked from commit e0007bf362)
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
This commit is contained in:
Kevin Carnes 2023-08-18 13:37:51 +02:00 committed by Fridolin Somers
parent f9cd9cca6a
commit c3c0f9eb12
2 changed files with 2 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead-langmenu.inc
View file

@ -3,7 +3,7 @@
<div id="header_langmenu">
<ul class="navbar-nav">
<li class="dropdown">
<a href="#" title="Switch languages" class="nav-link dropdown-toggle" id="langmenu" data-toggle="dropdown" role="button"><i class="fa fa-flag fa-icon-black" aria-hidden="true"></i> <span class="langlabel">Languages</span> <b class="caret"></b></a>
<a href="#" title="Switch languages" class="nav-link dropdown-toggle" id="langmenu" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-flag fa-icon-black" aria-hidden="true"></i> <span class="langlabel">Languages</span> <b class="caret"></b></a>
<div aria-labelledby="langmenu" role="menu" class="dropdown-menu dropdown-menu-right">
[% FOREACH languages_loo IN languages_loop %]
[% IF ( languages_loo.group_enabled ) %]

2
koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
View file

@ -91,7 +91,7 @@
<li class="nav-item dropdown">
[% IF ( Koha.Preference( 'opacuserlogin' ) == 1 ) %]
[% IF ( loggedinusername ) %]
<a href="/cgi-bin/koha/opac-user.pl" class="dropdown-toggle" id="user-menu" data-toggle="dropdown" role="button">
<a href="/cgi-bin/koha/opac-user.pl" class="dropdown-toggle" id="user-menu" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-user fa-icon-black fa-fw" aria-hidden="true"></i>
<span class="userlabel">Welcome, [% INCLUDE 'patron-title.inc' patron = logged_in_user no_html = 1 %]</span>
</a>