Merge branch '246530-remove-search_autocomplete-js-from-main-js' into 'master'

Codesplitting for search_autocomplete.js from main.js

Closes #246530

See merge request gitlab-org/gitlab!41777

app/assets/javascripts/main.js

@@ -31,7 +31,6 @@ import initLogoAnimation from './logo';
 import initFrequentItemDropdowns from './frequent_items';
 import initBreadcrumbs from './breadcrumb';
 import initUsagePingConsent from './usage_ping_consent';
-import initSearchAutocomplete from './search_autocomplete';
 import GlFieldErrors from './gl_field_errors';
 import initUserPopovers from './user_popovers';
 import initBroadcastNotifications from './broadcast_notification';
@@ -112,7 +111,18 @@ function deferredInitialisation() {
   initPersistentUserCallouts();
   initDefaultTrackers();
 
-  if (document.querySelector('.search')) initSearchAutocomplete();
+  document.querySelector('#search').addEventListener(
+    'focus',
+    () => {
+      import(/* webpackChunkName: 'globalSearch' */ './search_autocomplete')
+        .then(({ default: initSearchAutocomplete }) => {
+          const searchDropdown = initSearchAutocomplete();
+          searchDropdown.onSearchInputFocus();
+        })
+        .catch(() => {});
+    },
+    { once: true },
+  );
 
   addSelectOnFocusBehaviour('.js-select-on-focus');
 

spec/features/search/user_uses_header_search_field_spec.rb

@@ -28,7 +28,7 @@ RSpec.describe 'User uses header search field', :js do
 
     context 'when using the keyboard shortcut' do
       before do
-        find('#search.js-autocomplete-disabled')
+        find('#search')
         find('body').native.send_keys('s')
       end
 
@@ -39,7 +39,7 @@ RSpec.describe 'User uses header search field', :js do
 
     context 'when clicking the search field' do
       before do
-        page.find('#search.js-autocomplete-disabled').click
+        page.find('#search').click
       end
 
       it 'shows category search dropdown' do