#5189·xyflow

A11y: The focus order does not match the visual position

Author: neetCreated Apr 9, 2025Updated Jul 22, 2026
Labelsfeature requesttopic:a11y

Please describe the feature that you want to propose

Hi, thank you for maintaining an awesome library. I really love its intuitive APIs and interfaces.

Recently, our team conducted an accessibility test against our company's products, and we discovered some obstacles for screen readers. We noticed that some of the problems we discovered originated from React Flow.

One of the most critical issues we observed is that the order of elements we can focus on via both Tab or Arrows does not match the visual position of the elements:

https://github.com/user-attachments/assets/6b7f3843-e593-414b-9afc-07a27e958e62

As you can see on the clip, it focuses edges first and the nodes last. It would be great if we could focus on nodes and their belonging edges first, and then move the sibling nodes, which is the same as the experience it offers to visual users.

I believe this violates 2.4.3 Focus Order from WCAG 2.1. It is one of the Level A criteria, the ones that have the most significant impact on users who need assistive technology.

I recorded the video with VoiceOver in macOS 15.3.2 and the latest Chrome.