Fix search dropdown not closing on blur if empty

app/assets/javascripts/search_autocomplete.js

@@ -405,7 +405,7 @@ export class SearchAutocomplete {
     this.wrap.removeClass('search-active');
     // If input is blank then restore state
     if (this.searchInput.val() === '') {
-      return this.restoreOriginalState();
+      this.restoreOriginalState();
     }
     this.dropdownMenu.removeClass('show');
   }

app/views/layouts/_search.html.haml

@@ -16,7 +16,7 @@
                                               mr_path: merge_requests_dashboard_path },
                                             aria: { label: _('Search or jump to…') }
           %button.hidden.js-dropdown-search-toggle{ type: 'button', data: { toggle: 'dropdown' } }
-          .dropdown-menu.dropdown-select
+          .dropdown-menu.dropdown-select.js-dashboard-search-options
             = dropdown_content do
               %ul
                 %li.dropdown-menu-empty-item

changelogs/unreleased/fix-search-dropdown-blur-close.yml

+---
+title: Fix search dropdown not closing on blur if empty
+merge_request: 28730
+author:
+type: fixed

spec/features/global_search_spec.rb

@@ -25,4 +25,18 @@ describe 'Global search' do
       expect(page).to have_selector('.gl-pagination .next')
     end
   end
+
+  it 'closes the dropdown on blur', :js do
+    visit dashboard_projects_path
+
+    fill_in 'search', with: "a"
+    dropdown = find('.js-dashboard-search-options')
+
+    expect(dropdown[:class]).to include 'show'
+
+    find('#search').send_keys(:backspace)
+    find('body').click
+
+    expect(dropdown[:class]).not_to include 'show'
+  end
 end