Code snippets are not scrollable by keyboard users
Opened this issue · 1 comments
sbeaumontweb commented
mathalete commented
Good spot.
Maybe better to have a listener to determine if there is overflow on the code container, and add the tabindex
dynamically when it's needed.
Something like if scrollWidth > clientWidth
on the container, then add tabindex="0"
if not, don't.
If we're adding a tabindex
(statically or dynamically), it'd be recommended to also add an aria role and accessible name so if you can't see the screen, and you are tabbing through it, it's clear why this guy is receiving focus.
<div role="group" tabindex="0" aria-labelledby="[code block name in page]">....</div>