search

LeaVerou / awesomplete

Ultra lightweight, usable, beautiful autocomplete with zero dependencies.
http://leaverou.github.io/awesomplete/
MIT License
6.95k stars 609 forks source link

Prevent Tab key resulting in list element being skipped when `tabSelect: true` #17238

Closed AlexisDeschamps closed 3 years ago

AlexisDeschamps commented 3 years ago

It seems the branch for handling a tab key event if tabSelect: true is missing an evt.preventDefault(), which results in an item being skipped when autocompletes are created in a list.

To fix this, I believe we could call evt.preventDefault() in all branches of the procedure, instead of only some.

I have manually tested that this fixes the problem on our UI. The existing tests also appear to pass. If this change seems to make sense, I can look into adding a test.

Example

Initial state image

(Current behavior): final state after pressing tab: image

(Expected behavior): final state after pressing tab: image

AlexisDeschamps commented 3 years ago

@LeaVerou Thank you for the guidance. That makes sense. I modified the preventDefault call to be under a specific clause and added a unit test. Please let me know if there is something else I should add or change.

LeaVerou commented 3 years ago

Merged, thanks!