daisyui icon indicating copy to clipboard operation
daisyui copied to clipboard

Accessibility issue with dropdowns. Keyboard navigation.

Open ttytm opened this issue 3 years ago โ€ข 0 comments

There is a keyboard accessibility issue with dropdowns which gets especially visible using an extension like vimium. First I thought it's because of daisUI being css only, but It's working with components like the drawer component. That's why I hoped it could be a fix without too many efforts.

Following a short video. It shows:

  1. trying to trigger a dropdown component at the top left of the components preview. Not working
  2. triggering a drawer component. Is working
  3. re trying No. 1. Not working
  4. Moving to headlessUI and triggering and closing a dropdown via keyboard vimium shortcuts. Is working

The same holds true for testing the daisyUI components separately

https://user-images.githubusercontent.com/34311583/175052949-d6552925-a69f-41f6-8823-92b11784d103.mp4


Some additional circle jerk my fingers produced: Looking at the download stats in the Chrome and Firefox store, just the vimium extension has nearly 500.000 users. Taking into consideration that this is mainly a hacker's extension, there is definitely a good number of direct installations from sources like GitHub etc., so the actual number is probably higher. What I'm trying to say is that I hope that I'm not the only one who gets a bit happier having dropdowns working on the sites that work with beautiful daisyUI.

ttytm avatar Jun 22 '22 14:06 ttytm