gitea
/
Koha-clms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bug 33012: Accessibility - Fix OPAC navigation when using the tab key 

An accessibility audit highlighted that when logged in you cannot tab
to the log out link in the welcome menu. The search history link in
the same menu was also unable to be tabbed to. These links were also
not able to be reached using arrows.

The links for Your Lists, Private Lists and New List could be reached
using the arrows on the keyboard but not via the tab option.

Test plan:
1) Navigate to the Koha OPAC.
2) Ensure you are logged in.
3) Use tabs to navigate the site.
4) When you reach the Welcome menu press enter.
5) Note that you can tab to 'Your Account' and the 'Clear' icon but not
   to 'Search History' or to 'Log Out'
6) Tab also to the hamburger menu and press enter
7) Note than you can navigate this menu via the arrows on the keyboard but
   not via the tab button
8) Apply patch
9) Repeat steps 1-7
10) Note that you can now tab to all of the above links

Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Martin Renvoize <martin.renvoize@openfifth.co.uk>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
(cherry picked from commit a83c07da19)
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
This commit is contained in:
Alexander Blanchard 2025-05-01 19:34:22 +00:00 committed by Fridolin Somers
parent 9b1310d3f0
commit 95bbddfda2
No known key found for this signature in database
GPG Key ID: 9A8E73E2A8B96537
1 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
View File

@ -52,39 +52,39 @@
</a>
<div aria-labelledby="listsmenu" role="menu" class="dropdown-menu">
[% IF some_public_shelves.count %]
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=1" tabindex="-1" role="menuitem"><strong>Public lists</strong></a>
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=1" tabindex="0" role="menuitem"><strong>Public lists</strong></a>
[% SET number_of_public_shelves = 0 %]
[% FOREACH s IN some_public_shelves %]
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=view&amp;shelfnumber=[% s.shelfnumber | uri %]&amp;sortfield=[% s.sortfield | uri %]" tabindex="-1" role="menuitem">[% s.shelfname | html %]</a>
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=view&amp;shelfnumber=[% s.shelfnumber | uri %]&amp;sortfield=[% s.sortfield | uri %]" tabindex="0" role="menuitem">[% s.shelfname | html %]</a>
[% SET number_of_public_shelves = number_of_public_shelves + 1 %]
[% IF number_of_public_shelves >= 10 %][% LAST %][% END %]
[% END %]
[% IF some_public_shelves.count > 10 %]
<a class="dropdown-item listmenulink" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=1" tabindex="-1" role="menuitem">View all</a>
<a class="dropdown-item listmenulink" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=1" tabindex="0" role="menuitem">View all</a>
[% END %]
[% END %]
[% IF Koha.Preference( 'opacuserlogin' ) == 1 && some_public_shelves.count > 0 %]
<div class="dropdown-divider"></div>
[% END %]
[% IF Koha.Preference( 'opacuserlogin' ) == 1 %]
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=0" tabindex="-1" role="menuitem"><strong>Your lists</strong></a>
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=0" tabindex="0" role="menuitem"><strong>Your lists</strong></a>
[% IF loggedinusername %]
[% IF some_private_shelves.count %]
[% SET number_of_private_shelves = 0 %]
[% FOREACH s IN some_private_shelves %]
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=view&amp;shelfnumber=[% s.shelfnumber | uri %]&amp;sortfield=[% s.sortfield | uri %]" tabindex="-1" role="menuitem">[% s.shelfname | html %]</a>
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=view&amp;shelfnumber=[% s.shelfnumber | uri %]&amp;sortfield=[% s.sortfield | uri %]" tabindex="0" role="menuitem">[% s.shelfname | html %]</a>
[% SET number_of_private_shelves = number_of_private_shelves + 1 %]
[% IF number_of_private_shelves >= 10 %][% LAST %][% END %]
[% END %]
[% IF some_private_shelves.count > 10 %]
<a class="dropdown-item listmenulink" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=0" tabindex="-1" role="menuitem">View all</a>
<a class="dropdown-item listmenulink" href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;public=0" tabindex="0" role="menuitem">View all</a>
[% END %]
[% ELSE %]
<a class="dropdown-item disabled" aria-disabled="true" href="#" tabindex="-1" role="menuitem">No private lists</a>
<a class="dropdown-item disabled" aria-disabled="true" href="#" tabindex="0" role="menuitem">No private lists</a>
[% END %]
<a class="dropdown-item listmenulink" href="/cgi-bin/koha/opac-shelves.pl?op=add_form" tabindex="-1" role="menuitem">New list</a>
<a class="dropdown-item listmenulink" href="/cgi-bin/koha/opac-shelves.pl?op=add_form" tabindex="0" role="menuitem">New list</a>
[% ELSE %]
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=add_form" tabindex="-1" role="menuitem">Log in to create your own lists</a>
<a class="dropdown-item" href="/cgi-bin/koha/opac-shelves.pl?op=add_form" tabindex="0" role="menuitem">Log in to create your own lists</a>
[% END # / IF loggedinusername %]
[% END # / IF opacuserlogin %]
</div> <!-- / .dropdown-menu -->
@ -115,7 +115,7 @@
<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>
<a tabindex="-1" role="menuitem" class="logout js-hide" href="/cgi-bin/koha/opac-main.pl?logout.x=1"><i class="fa fa-fw fa-sign-out" aria-hidden="true"></i> Log out</a>
<a tabindex="0" role="menuitem" class="logout js-hide" href="/cgi-bin/koha/opac-main.pl?logout.x=1"><i class="fa fa-fw fa-sign-out" aria-hidden="true"></i> Log out</a>
[% ELSE %]
[% IF Koha.Preference('casAuthentication') %]
[%# CAS authentication is too complicated for modal window %]
@ -136,7 +136,7 @@
</p>
[% IF Koha.Preference( 'EnableOpacSearchHistory' ) %]
<p>
<a tabindex="-1" role="menuitem" class="login-link" href="/cgi-bin/koha/opac-search-history.pl" title="View your search history">Search history</a>
<a tabindex="0" role="menuitem" class="login-link" href="/cgi-bin/koha/opac-search-history.pl" title="View your search history">Search history</a>
<span class="divider-vertical"></span>
<a
class="clearsh submit-form-link"
@ -150,7 +150,7 @@
>
</p>
[% END %]
<a tabindex="-1" role="menuitem" class="logout" id="logout" href="/cgi-bin/koha/opac-main.pl?logout.x=1">Log out</a>
<a tabindex="0" role="menuitem" class="logout" id="logout" href="/cgi-bin/koha/opac-main.pl?logout.x=1">Log out</a>
</div>
</div>
[% END %]