From c91d053decdbe0739835a22f1fb7f3554e40398c Mon Sep 17 00:00:00 2001 From: Mark VanLandingham Date: Thu, 21 Dec 2023 11:05:36 -0600 Subject: [PATCH] FIX: Properly close search menu on click/touch outside (#25000) --- .../discourse/app/components/search-menu.js | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/app/assets/javascripts/discourse/app/components/search-menu.js b/app/assets/javascripts/discourse/app/components/search-menu.js index 4987b2980a3..07ba862eb19 100644 --- a/app/assets/javascripts/discourse/app/components/search-menu.js +++ b/app/assets/javascripts/discourse/app/components/search-menu.js @@ -67,8 +67,17 @@ export default class SearchMenu extends Component { @bind onDocumentPress(event) { - if (!event.target.closest(".search-menu-container.menu-panel-results")) { - this.menuPanelOpen = false; + // If the search menu header button is clicked, we don't need to do anything and can + // let the header handle cleanup. Otherwise we mess with the toggling of the popup. + if (event.target.closest(".header-dropdown-toggle.search-dropdown")) { + return; + } + + if ( + this.menuPanelOpen && + !event.target.closest(".search-menu .search-menu-container") + ) { + this.close(); } } @@ -106,7 +115,7 @@ export default class SearchMenu extends Component { // We want to blur the active element (search input) when in stand-alone mode // so that when we focus on the search input again, the menu panel pops up - document.activeElement.blur(); + document.getElementById(SEARCH_INPUT_ID)?.blur(); this.menuPanelOpen = false; }