Bug 33012

Summary: Accessibility: Some navigation items in OPAC cannot be accessed by keyboard (search history, log out)
Product: Koha Reporter: Marcel de Rooy <m.de.rooy>
Component: OPACAssignee: Alexander Blanchard <alexander.blanchard>
Status: Pushed to main --- QA Contact: Martin Renvoize (ashimema) <martin.renvoize>
Severity: normal    
Priority: P5 - low CC: alexander.blanchard, david, lucas, martin.renvoize, nina.martinez, oleonard
Version: Main   
Hardware: All   
OS: All   
GIT URL: Change sponsored?: ---
Patch complexity: Trivial patch Documentation contact:
Documentation submission: Text to go in the release notes:
This fixes the OPAC navigation menus when logged in so that keyboard users can use the tab key to navigation menus. Some menu items (such as some list options, search history, and log out) were not selectable when just using the tab key.
Version(s) released in:
25.05.00
Circulation function:
Attachments: Bug 33012: Remove tabindex from logout button
Bug 33012: Cannot Tab To Some Menu Items
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.
Bug 33012: Cannot Tab To Some Menu Items 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 abl
Bug 33012: Cannot Tab To Some Menu Items
Bug 33012: Cannot Tab To Some Menu Items
Bug 33012: Accessibility - Fix OPAC navigation when using the tab key
Bug 33012: Accessibility - Fix OPAC navigation when using the tab key
Bug 33012: Accessibility - Fix OPAC navigation when using the tab key

Description Marcel de Rooy 2023-02-20 11:41:27 UTC
Trivial edit. Remove tabindex -1.
Comment 1 Marcel de Rooy 2023-02-20 11:46:56 UTC
Created attachment 146946 [details] [review]
Bug 33012: Remove tabindex from logout button

Note: This is a trivial edit. But there is another logout link
too in masthead with js-hide class and tabindex -1 which is
rather mysterious to me ;)

Test plan:
Login on OPAC.
Try to logout by tabbing to Logout button.

Signed-off-by: Marcel de Rooy <m.de.rooy@rijksmuseum.nl>
Comment 2 Marcel de Rooy 2023-02-20 11:47:19 UTC
Trivial one liner. Self SO
Comment 3 Katrin Fischer 2023-02-20 20:45:57 UTC
It looks like you can also not tab to 'search history' in the same menu as the log out link. Looking at masthead.inc we have a 'ton' of tabindex=-1. 

Another example would be the list menu, that cannot be navigated by tabbing, but you can use 'arrow down'. The same does not work for the 'Welcome...' menu.

This would unlock one option, but it seems to be a bigger issue even in the same menu.
Comment 4 Katrin Fischer 2023-02-21 08:18:09 UTC
I think in terms of accessibility we should investigate this further. I just felt not sure if your solution was the right one as it only fixed one of the items in this menu.

I'll reopen with a different description.
Comment 5 Alexander Blanchard 2025-04-07 14:40:31 UTC
One of our sites had an accessibility audit and one of the things flagged was not being able to engage in certain functionality with the keyboard, including 'Log Out Link' and side navigation on 'Publication' page. The report also highlights not using tabindex="1" to prevent navigation order that is different from the visual  / screen reader order. 

Is anyone currently working in this or should I take it?
Comment 6 Owen Leonard 2025-04-08 12:01:25 UTC
(In reply to Alexander Blanchard from comment #5)

> Is anyone currently working in this or should I take it?

If a bug has a "NEW" status you should be able to assume no one else is actively working on it. Please feel free to assign it to yourself!
Comment 7 Alexander Blanchard 2025-04-25 10:50:54 UTC
(In reply to Owen Leonard from comment #6)
> (In reply to Alexander Blanchard from comment #5)
> 
> > Is anyone currently working in this or should I take it?
> 
> If a bug has a "NEW" status you should be able to assume no one else is
> actively working on it. Please feel free to assign it to yourself!

Thank you Owen!
Comment 8 Alexander Blanchard 2025-04-25 12:35:38 UTC Comment hidden (obsolete)
Comment 9 Alexander Blanchard 2025-05-01 19:38:49 UTC Comment hidden (obsolete)
Comment 10 Alexander Blanchard 2025-05-01 19:52:02 UTC Comment hidden (obsolete)
Comment 11 Alexander Blanchard 2025-05-01 20:22:17 UTC Comment hidden (obsolete)
Comment 12 Alexander Blanchard 2025-05-01 20:24:19 UTC
Created attachment 181839 [details] [review]
Bug 33012: Cannot Tab To Some Menu Items

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.

To Test:
1) Navigate to 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
Comment 13 David Nind 2025-05-02 00:35:22 UTC Comment hidden (obsolete)
Comment 14 David Nind 2025-05-02 00:35:51 UTC
Created attachment 181845 [details] [review]
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>
Comment 15 David Nind 2025-05-02 00:49:12 UTC
I've amended the commit message so that it is a bit more consist with the commit message guidelines (https://wiki.koha-community.org/wiki/Commit_messages):
- Title in sentence case
- Title = what the patch fixes, not what the problem is
- "To test:" to "Test plan:"
- Minor spelling correction
Comment 16 David Nind 2025-05-02 00:49:45 UTC
Thanks for working on theis accessibility bug!
Comment 17 Martin Renvoize (ashimema) 2025-05-02 15:24:05 UTC
Created attachment 181873 [details] [review]
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>
Comment 18 Martin Renvoize (ashimema) 2025-05-02 15:25:07 UTC
Same company QA, I've not seen the patches prior to this point.

All is looking good, and this is an important accessibility improvement without any regressions I can find.

Passing QA
Comment 19 Katrin Fischer 2025-05-06 16:53:50 UTC
Pushed for 25.05!

Well done everyone, thank you!