`Dropdown` Settings for Component Examples Searchable but Not Selectable via Keyboard
Closed this issue · 3 comments
Sn3llius commented
Describe the bug
The Dropdown
settings for component examples are searchable, but the search results cannot be selected using the keyboard.
Experienced Behavior
- The search result is found and displayed.
- The search result is not selectable using the keyboard.
Expected Behavior
- The search result should be findable.
- The search result should be selectable using the keyboard. (e.g. pressing Enter or Tab)
Steps to Reproduce
- Navigate to a component example page with Dropdown settings.
- Click into a search setting.
- Search for any entry using the keyboard.
Screenshots/Videos
![image](https://private-user-images.githubusercontent.com/41641225/346336802-0af22aa4-e5f4-4b04-8c64-f5d61164d504.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIzNDUwNzEsIm5iZiI6MTcyMjM0NDc3MSwicGF0aCI6Ii80MTY0MTIyNS8zNDYzMzY4MDItMGFmMjJhYTQtZTVmNC00YjA0LThjNjQtZjVkNjExNjRkNTA0LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MzAlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzMwVDEzMDYxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWRiNzBkOWZlZDJkZjIxNmJmMGE1ZDU5ZjJmZjY3NTFkZGU4NjU1YWQ0MjA5ZWMxN2EzZDE0ZTAyOWViYmQ1YzUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.vS31JGfbRAKL1Bz0TX6GVCqTgDQPuyRqaKbtIrRys9k)
Operating System
Windows, MacOS
What browsers are you seeing the problem on?
Chrome, Safari, Edge
Browser version
No response
What device are you using?
Desktop, Mobile
Additional context
No response
mad-moo commented
Funny, I have the exact opposite issue. I can select, but not filter 😄
Sn3llius commented
Ah perfect!
You might hate me for this^^
Imagine you have three options: ["Option 1", "Option 2", "Option 3"]
. When you type "option", the whitespace will be visually removed, resulting in ["Option1", "Option2", "Option3"]
. Additionally, all three options should be highlighted.
Dropdown.whitespace.mp4
Sn3llius commented
The issue is fixed. If the problem occurs on different browsers, please reopen the issue.