You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This used to work in 5.0.1 but is broken in 5.3.3.
If .dropdown-toggle is an input of type "text", the ability to move through individual .dropdown-item elements using the cursor keys (up/down) is gone.
OK I checked the source code and found the culprit inside js/src/dropdown.js:
static dataApiKeydownHandler(event) {
// If not an UP | DOWN | ESCAPE key => not a dropdown command
// If input/textarea && if key is other than ESCAPE => not a dropdown command
const isInput = /input|textarea/i.test(event.target.tagName)
const isEscapeEvent = event.key === ESCAPE_KEY
const isUpOrDownEvent = [ARROW_UP_KEY, ARROW_DOWN_KEY].includes(event.key)
if (!isUpOrDownEvent && !isEscapeEvent) {
return
}
if (isInput && !isEscapeEvent) {
return
}
}
So if (isInput && !isEscapeEvent) === true, then the keydown-event is not applied. As soon as I comment this if-statement out, the key-down works. I am wondering if this is done deliberately and if so, what is the reasoning behind it?
Maybe the ppl who did the last commits changing the dataApiKeydownHandler method can put some light on this: @GeoSot@Johann-S@alpadev@fat
Prerequisites
Describe the issue
This used to work in 5.0.1 but is broken in 5.3.3.
If
.dropdown-toggle
is an input of type "text", the ability to move through individual.dropdown-item
elements using the cursor keys (up/down) is gone.This issue is not specific to any browser or OS.
Reduced test cases
https://codepen.io/nerdess/pen/zxOJNdP
What operating system(s) are you seeing the problem on?
macOS, Windows, Android, iOS, Linux
What browser(s) are you seeing the problem on?
Chrome, Safari, Firefox, Microsoft Edge, Opera
What version of Bootstrap are you using?
5.3.3
The text was updated successfully, but these errors were encountered: