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>
This commit is contained in:
Kevin Carnes 2023-08-18 13:37:51 +02:00 committed by Tomas Cohen Arazi
parent 77ee1ca743
commit e0007bf362
Signed by: tomascohen
GPG key ID: 0A272EA1B2F3C15F
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

@ -98,7 +98,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>