Merge branch 'search-input-blur' into 'master'

Fixed search field blur not removing focus

## What does this MR do?

Adds a blur event to remove focus styling from the search input.

Any particular reason we were looking for clicks on the document? I can't see why we would be.

## What are the relevant issue numbers?

Closes #18670

## Screenshots (if relevant)

![tab](/uploads/4c74d4f76ec7b45bfcf581606d2defb5/tab.gif)

See merge request !4704
(cherry picked from commit c051630a)

CHANGELOG

@@ -3,6 +3,7 @@ Please view this file on the master branch, on stable branches it's out of date.
 v 8.9.4
   - Fix privilege escalation issue with OAuth external users.
   - Ensure references to private repos aren't shown to logged-out users.
+  - Fixed search field blur not removing focus. !4704
 
 v 8.9.3
   - Fix encrypted data backwards compatibility after upgrading attr_encrypted gem. !4963

app/assets/javascripts/gl_dropdown.js.coffee

@@ -218,6 +218,13 @@ class GitLabDropdown
     @dropdown.on 'keyup', (e) =>
       if e.which is 27 # Escape key
         $('.dropdown-menu-close', @dropdown).trigger 'click'
+    @dropdown.on 'blur', 'a', (e) =>
+      if e.relatedTarget?
+        $relatedTarget = $(e.relatedTarget)
+        $dropdownMenu = $relatedTarget.closest('.dropdown-menu')
+
+        if $dropdownMenu.length is 0
+          @dropdown.removeClass('open')
 
     if @dropdown.find(".dropdown-toggle-page").length
       @dropdown.find(".dropdown-toggle-page, .dropdown-menu-back").on "click", (e) =>

app/assets/javascripts/search_autocomplete.js.coffee

@@ -171,22 +171,15 @@ class @SearchAutocomplete
     }
 
   bindEvents: ->
-    $(document).on 'click', @onDocumentClick
     @searchInput.on 'keydown', @onSearchInputKeyDown
     @searchInput.on 'keyup', @onSearchInputKeyUp
     @searchInput.on 'click', @onSearchInputClick
     @searchInput.on 'focus', @onSearchInputFocus
+    @searchInput.on 'blur', @onSearchInputBlur
     @clearInput.on 'click', @onClearInputClick
     @locationBadgeEl.on 'click', =>
       @searchInput.focus()
 
-  onDocumentClick: (e) =>
-    # If clicking outside the search box
-    # And search input is not focused
-    # And we are not clicking inside a suggestion
-    if not $.contains(@dropdown[0], e.target) and @isFocused and not $(e.target).closest('.search-form').length
-      @onSearchInputBlur()
-
   enableAutocomplete: ->
     # No need to enable anything if user is not logged in
     return if !gon.current_user_id
@@ -287,8 +280,6 @@ class @SearchAutocomplete
         value: @originalState._location
       )
 
-    @dropdown.removeClass 'open'
-
   badgePresent: ->
     @locationBadgeEl.length