Jinnie
commented
1 year ago Similar problem as form inputs inside datagrid. But this time it's about dropdown. Which is not exactly the "change record" scenario we have with the forms, but running a context action. We'll need some input from A11Y team here. An "editable dropdown" sounds quite confusing.
CC: @AmyLiNow
kevinbuhmann
Describe the bug
A dropdown in a datagrid cell is inaccessible by keyboard navigation. Also, if a datagrid is placed in a modal, and if the dropdown content is bigger that the datagrid height (modal height), the content of the dropdown gets cut off.
How to reproduce
The bug is reproduced by creating a datagrid with a single or more than one column. One of the
clr-dg-cells should contain a dropdown: https://clarity.design/documentation/dropdowns We cannot access the dropdown content via keyboard alone.Steps to reproduce the behavior:
Stackblitz: https://stackblitz.com/edit/clr-angular-13-vpat-2937-4e5pcr?file=src%2Fapp%2Fapp.component.html Open the modal, check the datagrid. Try to navigate to one of the resources in the dropdown with keyboard alone.
Expected behavior
The user should be able to navigate to any items of the dropdown with no issues.
Versions
Clarity version:
Framework version: Angular 13
Device:
Additional notes
Add any other notes about the problem here.