Skip to content

[graphiql] Accessibility: Window Splitter Not Keyboard Accessible #3767

Open
@juanrgon

Description

@juanrgon

Is there an existing issue for this?

  • 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

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions