nvaccess
Separator role not going to focus mode automatically
We are currently building a feature where the user can focus on a handle and resize part of the application. This can be considered a window splitter pattern.
Based on this pattern, which uses the separator role, the user would expect to be able to press left and right arrow keys to move the splitter (or separator), when the separator if focusable and should act as widget.
The problem is that with the separator role, even when the separator is focusable, NVDA doesn't automatically switch to the "focus" mode, which results in arrow keys not working unless the user switches manually.
The behavior should be similar to a slider role, which we ended up using in the end. Please bump the dependency of @fluentui-contrib/react-resize-handle to 0.5.0 to see how it behaves with "slider" role.
Steps to reproduce:
- Go to https://stackblitz.com/edit/ketu1a?file=src%2Fexample.tsx with NVDA enabled
- Focus on one of the drag handles
- Try moving the handle left/right (or up/down) with the arrow keys
Actual behavior:
Observe that the handle is not being moved, as the NVDA is still in browse mode. Enable the "focus" mode automatically to retry and see that it now works as expected.
Expected behavior:
The focus mode should be automatically enabled when the focus lands on a focusable element with "separator" role, allowing the arrow keys to be used for resizing.
NVDA logs, crash dumps and other attachments:
System configuration
NVDA installed/portable/running from source:
NVDA version:
2024.3
Windows version:
Windows 11
Name and version of other software in use when reproducing the issue:
Other information about your system:
Other questions
Does the issue still occur after restarting your computer?
Have you tried any other versions of NVDA? If so, please report their behaviors.
If NVDA add-ons are disabled, is your problem still occurring?
Does the issue still occur after you run the COM Registration Fixing Tool in NVDA's tools menu?
Why the CC here? This is pretty clear from the ARIA spec:
There are two types of separators: a static structure that provides only a visible boundary and a focusable, interactive widget that is also moveable.
NVDA just needs to triage and implement support for focusable separators.
This should be a fairly straightforward change to browseMode.BrowseModeTreeInterceptor.shouldPassThrough, checking for role separator and .isFocusable and returning True if so.
Btw I learned this could be worked around by wrapping the element with role="application" ancestor.
Probably not applicable everywhere and not a fix, but worth noting.
@jcsteh I CCed you, because I thought you might know of some concrete reason why we weren't supporting this. It appears there isn't one. Sorry for the clutter.