[graphiql] Accessibility: Window Splitter Not Keyboard Accessible

[juanrgon]

Is there an existing issue for this?

• [x] I have searched the existing issues

Current Behavior

The window splitter in GraphiQL is not accessible via keyboard. It is only accessible and operable with a mouse. This creates a significant barrier for keyboard users, resulting in a degraded user experience as they cannot adjust the layout of the interface.

Expected Behavior

The window splitter should be fully accessible and operable via keyboard:

• Users should be able to focus on the splitter using the Tab key
• Once focused, users should be able to adjust the splitter using arrow keys
• The functionality should be equivalent to what is currently possible with mouse interaction

Steps To Reproduce

1. Open GraphiQL in a web browser
2. Attempt to navigate to the window splitter using the Tab key
3. Try to operate the window splitter using keyboard controls (arrow keys)
4. Observe that it's not possible to interact with the splitter using only the keyboard

Environment

• GraphiQL Version: 3.7.1
• OS: MacOS
• Browser: Chrome
• Bundler: Not specified
• react Version: 18.3.1
• graphql Version: 16.9.0

Anything else?

No response

[acao]

@juanrgon thank you for reporting these bugs! going on the roadmap for 4.0.0 which is in progress!