Commit c051630a authored by Jacob Schatz's avatar Jacob Schatz

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
parents c8e4fe56 e1d38bc9
...@@ -220,6 +220,13 @@ class GitLabDropdown ...@@ -220,6 +220,13 @@ class GitLabDropdown
@dropdown.on 'keyup', (e) => @dropdown.on 'keyup', (e) =>
if e.which is 27 # Escape key if e.which is 27 # Escape key
$('.dropdown-menu-close', @dropdown).trigger 'click' $('.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 if @dropdown.find(".dropdown-toggle-page").length
@dropdown.find(".dropdown-toggle-page, .dropdown-menu-back").on "click", (e) => @dropdown.find(".dropdown-toggle-page, .dropdown-menu-back").on "click", (e) =>
......
...@@ -171,22 +171,15 @@ class @SearchAutocomplete ...@@ -171,22 +171,15 @@ class @SearchAutocomplete
} }
bindEvents: -> bindEvents: ->
$(document).on 'click', @onDocumentClick
@searchInput.on 'keydown', @onSearchInputKeyDown @searchInput.on 'keydown', @onSearchInputKeyDown
@searchInput.on 'keyup', @onSearchInputKeyUp @searchInput.on 'keyup', @onSearchInputKeyUp
@searchInput.on 'click', @onSearchInputClick @searchInput.on 'click', @onSearchInputClick
@searchInput.on 'focus', @onSearchInputFocus @searchInput.on 'focus', @onSearchInputFocus
@searchInput.on 'blur', @onSearchInputBlur
@clearInput.on 'click', @onClearInputClick @clearInput.on 'click', @onClearInputClick
@locationBadgeEl.on 'click', => @locationBadgeEl.on 'click', =>
@searchInput.focus() @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: -> enableAutocomplete: ->
# No need to enable anything if user is not logged in # No need to enable anything if user is not logged in
return if !gon.current_user_id return if !gon.current_user_id
...@@ -287,8 +280,6 @@ class @SearchAutocomplete ...@@ -287,8 +280,6 @@ class @SearchAutocomplete
value: @originalState._location value: @originalState._location
) )
@dropdown.removeClass 'open'
badgePresent: -> badgePresent: ->
@locationBadgeEl.length @locationBadgeEl.length
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment