Roundup Tracker - Issues

Issue 2551321

classification
make pre examples in docs pages tabable
Type: behavior Severity: normal
Components: Documentation Versions:
process
Status: new
:
: : rouilj
Priority: :

Created on 2024-03-01 16:33 by rouilj, last changed 2026-08-02 22:09 by rouilj.

Messages
msg7953 Author: [hidden] (rouilj) Date: 2024-03-01 16:33
Currently keyboard users can't select and scroll the example pre sections in the docs.
For example on https://roundup-tracker.org/docs/security.html#index-1 there is a yellow 
scrollable pre box. It can't be selected/tabbed to and can't be scrolled by the keyboard.

Firefox allows the region to get focus via tab and be scrolled using the arrow keys.
Also cursor mode (F7) allows the user to move the cursor along the line an scrolls when he 
cursor goes out of the box. Chrome implemented it and then rolled it back. Safari has yet to
implement.

https://adrianroselli.com/2022/06/keyboard-only-scrolling-areas.html

suggests adding: tabindex=0 aria-label/aria-labeledby and role=region or possibly role=group.
Role region is a landmark role, so the scrollable box can show up in a region browser like the 
main or navigation roles. I don't like that. However it is interactive so it apparently
needs a role.

I am not sure if Sphinx can be convinced to generate the proper output though.
msg8478 Author: [hidden] (rouilj) Date: 2026-08-02 22:09
Chrome shipped this in v132 per: https://chromestatus.com/feature/5231964663578624

Safari is still broken: https://bugs.webkit.org/show_bug.cgi?id=277290
But there is a pull request for fixing this submitted on: 2026-06-06

So maybe this will be fixed at the browser level??

Polyfill is available: https://github.com/Th3S4mur41/scroll-focus-polyfill

Download/checkin https://unpkg.com/scroll-focus-polyfill and add _static/scroll-focus-polyfill.js to script_files list in layout.html. Docs should be self contained, so no 3rd party sources.
History
Date User Action Args
2026-08-02 22:09:28rouiljsetmessages: + msg8478
2024-03-01 16:33:08rouiljcreate