search

ciampo / macro-carousel

Carousel as a Vanilla Web Component.
https://ciampo.github.io/macro-carousel/demo/
MIT License
77 stars 6 forks source link

Focus gets lost after transition with autofocus=false #48

Open pimdewit opened 4 years ago

pimdewit commented 4 years ago

If autofocus=false, navigating the carousel with the arrow keys will reset the focus back to document.body onTransitionEnd.

pimdewit commented 4 years ago

Focus-management breaks in all attribute variations except when autofocus=true because of inert/tabindex changes.

Removing the conditional in the snippet below "fixes" the issue, but ofcourse thats not a viable option.

https://github.com/ciampo/macro-carousel/blob/d35e1e76ffac925cbee3a44539ad531af2608718/src/macro-carousel/macro-carousel.js#L1121-L1131

@ciampo Maybe we could do something with :focus-within to determine whether the focus should be kept or not?

ciampo commented 4 years ago

I remember making a mental note about this. As you said, it's not a trivial issue because as slides become visible/invisible, their focusability changes too.

I'll have to spend some time and have a careful look at the code, to see what's the best solution here