tailwindcss-stimulus-components
tailwindcss-stimulus-components copied to clipboard
Dropdown menu does not support proper keyboard navigation
- Using up/down arrows scrolls the page
- Pressing ESC should close the menu
- Pressing ENTER on a selection should be equivalent to clicking the link (unsure if implemented?)
See video: https://cln.sh/coIGPO
PRs welcome!
@excid3 @cmer check out my PR that addresses this.!
@A7madXatab at the risk of exposing myself as even more of a rank amateur with JS, could the tests be failing in your PR because you're importing 'stimulus' instead of '@hotwire/stimulus'?
@hms thanks for the heads up. I've fetched upstream and updated deps in my fork. Now the tests seem to be failing because it says
> [email protected] test /home/runner/work/tailwindcss-stimulus-components/tailwindcss-stimulus-components
> NODE_ENV=test jest
● Cannot log after tests are done. Did you forget to wait for something async in your test?
Attempted to log "Error disconnecting controller
TypeError: Cannot read property 'removeEventListener' of null
at extended.disconnect (/home/runner/work/tailwindcss-stimulus-components/tailwindcss-stimulus-components/src/dropdown.js:93:16)
and it's scary because look at the line
https://github.com/A7madXatab/tailwindcss-stimulus-components/blob/a5501f54d9403817c6dc21951c9cd3e5accfee62/src/dropdown.js#L96
To my surprise it is in fact this line that is causing the errors
document.removeEventListener('keydown', this.keyboardListener);
I've changed it to
document?.removeEventListener('keydown', this.keyboardListener);
And now they are passing. @excid3 anything on this?. Thanks @hms