mymth
commented
11 months ago With v1.3 update, I changed the timing to hide/refresh the picker on tab key press from the keydown event to blur. It appears that the problem is caused by that change. I found the following happening after the tab key is pressed:
- Since the picker element, which is the next sibling of the input field, is still shown at the time, the browser moves the focus to the prev button, which is the first focusable element in the picker, first.
- Then, since the focused element disappears when the blur event listener hides the picker, the browser moves the focus to
<body>.
Adding tabindex="-1" to all the buttons in the picker seems to be working as a solution. So, I'll release the bug fix soon.
Having the focus in a datepicker input field and pressing the
<TAB>key, the focus should move to the next field (no tabindex set) on the page. Instead the focus gets reset to the very first element on the page.The live demo is sufficient to demonstrate that bug: http://raw.githack.com/mymth/vanillajs-datepicker/v1.3.3/demo/index.html
<TAB>.The "readonly" checkbox should gain focus but it doesn't. Navigating in reverse with
<SHIFT>+<TAB>works though.