Accessibility bug: scrollable code blocks on website are not operable with a keyboard

[ashleemboyer]

On pages like Menu (Dropdown) where there are code blocks that can scroll vertically and horizontally, there is no way for keyboard-only users to scroll those areas and view all of the content in them.

This issue falls under WCAG 2.1 Success Criterion 2.1.1 Keyboard (Level A). It can be fixed by adding the tabindex="0" property to the scrollable regions. This will enable the region to be reachable via keyboard, and then the arrow keys can be used to scroll the content.

Here is a screenshot from the top of the linked page showing a code block that scrolls in both directions:

[reinink]

Hey thanks for this suggestion as well, I've added tabindex="0" to the code block, and now I am able to access it using voiceover on MacOS 👍