search-enabled=false breaks keyboard interaction on Safari

[kevcenteno]

trafficstars

Bug description:

Steps to reproduce

1. Set search-enabled=false
2. Use desktop Safari (tested on 10.1.1)
3. Click/tab/focus on the ui-select element
4. Use up/down arrow keys to change what is selected.

Expected

1. Can change what is selected when dropdown is open
2. Can open dropdown when dropdown is closed

Actual

1. Cannot change what is selected
2. Dropdown panel quickly opens and closes.

Link to minimally-working plunker that reproduces the issue:

http://angular-ui.github.io/ui-select/demo-disable-search.html

Version of Angular, UI-Select, and Bootstrap/Select2/Selectize CSS

UI-Select

Angular: ^1.4

UI-Select: 0.19.8

Bootstrap/Select2/Selectize CSS (if applicable): All

[daerogami]

I'm not sure this is limited to Safari. Also, it looks like this has been a long standing issue. I've found more than one issue that revolves around search-enabled=false and keyboard interaction being unreliable. #375 was the issue I found that was supposedly fixed in PR #1717 I am using Angular v1.4.4 with ui-select v0.19.7 (updated from v0.11.1 hoping that would fix my issue) Cannot use keyboard to shortcut to items in the list in Chrome or FF (other browsers untested).

[Jefiozie]

I try this one but I cannot reproduce it. (with angular 1.4.4 tested and latest ui-select) Attempt 1:

1. Disabled search
2. tab to next ui-select
3. enter to open select
4. pressed a couple of times on up/down keys
5. enter to select a item
6. tabbed to the next ui-select

Attempt 2:

1. Disabled search
2. tab to next ui-select
3. pressed down to open select
4. pressed a couple of times on up/down keys
5. enter to select a item
6. tabbed to the next ui-select

Probably i'm doing something wrong though 😃

[daerogami]

@Jefiozie What about using character navigation? Intuition leads me to believe pressing "T" should take you to the first item in the list that starts with "T".

[Jefiozie]

Ah that is what I was missing now I see what you mean. If search-enabled=false and you press a key for example: A it should select the first item in the list with the A correct?

[daerogami]

If search-enabled=false and you press a key for example: A it should select the first item in the list with the A correct?

@Jefiozie That is correct. I'm unfamiliar with the code for this plugin, but let me know if there's anything I can do to get some momentum on getting this solved.

[cserkaran]

While testing in chrome, the keyboard navigation works with this fix, but a weird search box has started to appear even when search-enabled is set to false. Also the size of search box (when search-enabled is true) is larger than what is used to be..

[dharitdesai]

same issue. not totally sure about the whole code. but after putting some breakpoints around, I finally figured that this lime is closing the dropdown again in uiSelectController.js's ctrl.activate function at line 167 else if (ctrl.open && !ctrl.searchEnabled) { // Close the selection if we don't have search enabled, and we click on the select again ctrl.close(); } this is being called from ctrl.toggle($event) from template at <i class="caret pull-right" ng-click="$select.toggle($event)" role="button" tabindex="0"></i>