Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Observability:Alerts page]Drag and drop not working with keyboard or keyboard and NVDA #210764

Open
L1nBra opened this issue Feb 12, 2025 · 4 comments
Assignees
Labels
defect-level-1 Critical UX disruption impact:critical This issue should be addressed immediately due to a critical level of impact on the product. obs-accessibilty A11Y issues in the Obs. solution. Project:Accessibility Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) WCAG A

Comments

@L1nBra
Copy link

L1nBra commented Feb 12, 2025

Description
Drag and drop functionality should be working for only keyboard users. Also for keyboard and screen reader (NVDA) users.

Preconditions
Observability -> Alerts page.
At least two filter already added in Add filter.

Steps to reproduce

1.Navigate to Add filter button.
2.Press Enter.
3.Navigate to drag handle.
4.Press Spacebar.
5.Press up/down arrow keys few times.
6.Observe the page.
7.While on drag handle press insert + Spacebar with NVDA turned on (to get in focus mode).
8.Press Spacebar.
9.Press up/down arrow keys few times.
10.Observe the page.

Screen recording
https://github.com/user-attachments/assets/bc3ae825-61dc-4a14-98ac-6e88a4a0c8d4

UI elements + NVDA Speech Viewer
Image

Actual Result

  • Filter row is not moved to another position.

Expected Result

  • Filter row is moved to another position.

Notes:
Similar with drag and drop keyboard + NVDA
-Navigate to Columns button -> press Enter -> navigate to dragable element -> press insert + Spacebar (to get in focus mode) -> press arrow keys. Result: NVDA announces that "...lifted an item...", but user cannot drag and drop, it's not working. (Even though with only keyboard in this place it is working correctly).
Image

Meta Issue

Kibana Version: 8.17.0-SNAPSHOT

OS: Windows 11 Pro

Browser: Chrome Version 131.0.6778.140 (Official Build) (64-bit)

Screen reader: NVDA

WCAG or Vendor Guidance (optional)

Related to: https://github.com/elastic/kibana-team/issues/1254

@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-accessibility (Project:Accessibility)

@botelastic botelastic bot added the needs-team Issues missing a team label label Feb 12, 2025
@L1nBra L1nBra added WCAG A impact:critical This issue should be addressed immediately due to a critical level of impact on the product. defect-level-1 Critical UX disruption obs-accessibilty A11Y issues in the Obs. solution. labels Feb 12, 2025
@jasonrhodes
Copy link
Member

jasonrhodes commented Feb 13, 2025

@heespi @cnasikas I believe this is an accessibility issue (critical level-1) that's embedded in the alert table, can you confirm?

@jasonrhodes jasonrhodes added the Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) label Feb 13, 2025
@elasticmachine
Copy link
Contributor

Pinging @elastic/response-ops (Team:ResponseOps)

@botelastic botelastic bot removed the needs-team Issues missing a team label label Feb 13, 2025
@cnasikas
Copy link
Member

@jasonrhodes The columns are part of the alerts table, but the search bar above the table is not. We do not own the search bar. I am not sure which team is responsible for it. I put it to our board to address the column's accessibility issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
defect-level-1 Critical UX disruption impact:critical This issue should be addressed immediately due to a critical level of impact on the product. obs-accessibilty A11Y issues in the Obs. solution. Project:Accessibility Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) WCAG A
Projects
None yet
Development

No branches or pull requests

5 participants