Improve tabbing order for commit list items accessibility
Problem
As discussed in #556950 (closed), the current tabbing order for commit list items doesn't match the visual order, particularly in mobile layout. This creates a confusing experience for keyboard users.
From @psjakubowska's feedback:
I'm not so sure about the tabbing order in the mobile layout. For keyboard sighted users it does seem a bit off. Maybe because the commit message looks like a header and then I expect to go to the overflow menu and expand first, not the rest of the details.
Proposed Solution
Match the DOM order with visual order by adjusting the tabbing sequence to:
- Header (commit message)
- Author + timeago info
- Expand button
- Badges
- Overflow button
Open Questions
- What should happen to focus management once the description is expanded?
- How do users navigate back to badges and overflow menu after expanding?
- Should we consider different behavior for mobile vs desktop layouts?
Acceptance Criteria
-
Tabbing order matches visual order for commit list items -
Focus management works correctly when expanding/collapsing commit details -
Solution works consistently across mobile and desktop layouts -
Changes are tested with keyboard navigation and screen readers
Related Issues
- Parent issue: #556950 (closed) (Improve accessibility for commit list items)
- Discussion thread: #556950 (comment 2644368583)
Edited by 🤖 GitLab Bot 🤖