Make arrow buttons work within search box
What does this MR do?
This fixes a bug where arrow keys don't work on the upper-right search bar autocomplete results. This also fixes a related bug where a "Loading" message is shown when there are no results.
The bug happens because we trigger hidden.bs.dropdown in disableAutocomplete which in turn disables keyboard events in https://gitlab.com/gitlab-org/gitlab/blob/master/app/assets/javascripts/gl_dropdown.js#L620.
In normal cases this isn't a problem because the events will be attached again when the dropdown is shown again in https://gitlab.com/gitlab-org/gitlab/blob/master/app/assets/javascripts/gl_dropdown.js#L397. The problem here is that disableAutocomplete didn't actually hide the dropdown so the shown event is not triggered unless the user manually closes the dropdown.
So the keyboard shortcut bug happens when a user is typing a search term and at some point the search returned no results.
Screenshots
| Before | After |
|---|---|
| Screen_Recording_2019-10-17_at_1.31.23_AM | Screen_Recording_2019-10-17_at_1.32.00_AM |
Does this MR meet the acceptance criteria?
Conformity
-
Changelog entry -
Documentation created/updated or follow-up review issue created -
Code review guidelines -
Merge request performance guidelines -
Style guides -
Database guides -
Separation of EE specific content
Availability and Testing
-
Review and add/update tests for this feature/bug. Consider all test levels. See the Test Planning Process. -
Tested in all supported browsers
Security
If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:
-
Label as security and @ mention @gitlab-com/gl-security/appsec -
The MR includes necessary changes to maintain consistency between UI, API, email, or other methods -
Security reports checked/validated by a reviewer from the AppSec team