ux
ux copied to clipboard
Improve DevTools keyboard navigation
Related to #7: Currently many DevTools interactions can’t be navigated via keyboard or need improved keyboard behavior. It would be great if someone with keyboard navigation experience or interest in accessibility could take a look at the keyboard functionality in the most used panels (Inspector, Console, Network, Debugger) and write up some improvements.
For example: I think Inspector is very close to being keyboard-navigable - just need arrow-key behavior for the the right-pane tabs.
Mentor: @yzen
I was wondering if the DevTools team has identified intended audiences for tab navigation. Some examples:
- All users: focus styles on some classes of elements, e.g. text input boxes.
- Power users: some may be used to using the keyboard to limit back-and-forth between keyboard input and the mouse or trackpad. E.g. when I fill a form, I often use keyboard navigation to switch between fields.
- Users who primarily use the keyboard (often due to a disability): they will need a stronger level of access, such as focusable elements whenever it’s relevant, clearly visible focus styles for everything, no focus traps, and perhaps ways to skip long lists or a kind of "quick navigation" tool.
I’m all for addressing the needs of all 3 groups equally, but I’ll just note that it can take increasing effort.
Ah, I'm not sure if we've really thought about this enough (cc: @yzen @martinbalfanz @digitarald). 2 seems important for a developer tool. 3 seems like a good eventual goal, but I realized I'm not sure how well Firefox itself supports this, so maybe we're getting ahead of ourselves a bit?
Re: Quick nav tool: some ideas for a command palette https://github.com/devtools-html/debugger.html/issues/6260
I hope this can be addressed in the inclusive way (e.g. considering all 3 categories). By addressing 3 we are going to solve 1 and 2 (in other words a curb cut effect)