diff --git a/app/assets/javascripts/lib/utils/url_utility.js b/app/assets/javascripts/lib/utils/url_utility.js
index 1336b6a5461..7ead9d46fbb 100644
--- a/app/assets/javascripts/lib/utils/url_utility.js
+++ b/app/assets/javascripts/lib/utils/url_utility.js
@@ -1,5 +1,11 @@
 import { join as joinPaths } from 'path';
 
+// Returns a decoded url parameter value
+// - Treats '+' as '%20'
+function decodeUrlParameter(val) {
+  return decodeURIComponent(val.replace(/\+/g, '%20'));
+}
+
 // Returns an array containing the value(s) of the
 // of the key passed as an argument
 export function getParameterValues(sParam, url = window.location) {
@@ -30,7 +36,7 @@ export function mergeUrlParams(params, url) {
       .forEach(part => {
         if (part.length) {
           const kv = part.split('=');
-          merged[decodeURIComponent(kv[0])] = decodeURIComponent(kv.slice(1).join('='));
+          merged[decodeUrlParameter(kv[0])] = decodeUrlParameter(kv.slice(1).join('='));
         }
       });
   }
diff --git a/changelogs/unreleased/fe-fix-merge-url-params-with-plus.yml b/changelogs/unreleased/fe-fix-merge-url-params-with-plus.yml
new file mode 100644
index 00000000000..7ca8ae0a8f6
--- /dev/null
+++ b/changelogs/unreleased/fe-fix-merge-url-params-with-plus.yml
@@ -0,0 +1,5 @@
+---
+title: Fix search preserving space when change branch
+merge_request: 31973
+author: minghuan lei
+type: fixed
diff --git a/spec/features/search/user_searches_for_code_spec.rb b/spec/features/search/user_searches_for_code_spec.rb
index 5a60991c1bf..4ca79ccaea8 100644
--- a/spec/features/search/user_searches_for_code_spec.rb
+++ b/spec/features/search/user_searches_for_code_spec.rb
@@ -39,17 +39,16 @@ describe 'User searches for code' do
     context 'when on a project page', :js do
       before do
         visit(search_path)
-      end
-
-      include_examples 'top right search form'
-
-      it 'finds code' do
         find('.js-search-project-dropdown').click
 
         page.within('.project-filter') do
           click_link(project.full_name)
         end
+      end
 
+      include_examples 'top right search form'
+
+      it 'finds code' do
         fill_in('dashboard_search', with: 'rspec')
         find('.btn-search').click
 
@@ -57,6 +56,27 @@ describe 'User searches for code' do
           expect(find(:css, '.search-results')).to have_content('Update capybara, rspec-rails, poltergeist to recent versions')
         end
       end
+
+      it 'search mutiple words with refs switching' do
+        expected_result = 'Use `snake_case` for naming files'
+        search = 'for naming files'
+
+        fill_in('dashboard_search', with: search)
+        find('.btn-search').click
+
+        page.within('.results') do
+          expect(find('.search-results')).to have_content(expected_result)
+        end
+
+        find('.js-project-refs-dropdown').click
+        find('.dropdown-page-one .dropdown-content').click_link('v1.0.0')
+
+        page.within('.results') do
+          expect(find(:css, '.search-results')).to have_content(expected_result)
+        end
+
+        expect(find_field('dashboard_search').value).to eq(search)
+      end
     end
 
     context 'search code within refs', :js do
diff --git a/spec/frontend/lib/utils/url_utility_spec.js b/spec/frontend/lib/utils/url_utility_spec.js
index a986bc49f28..b0bdd924921 100644
--- a/spec/frontend/lib/utils/url_utility_spec.js
+++ b/spec/frontend/lib/utils/url_utility_spec.js
@@ -94,6 +94,12 @@ describe('URL utility', () => {
     it('adds and updates encoded params', () => {
       expect(urlUtils.mergeUrlParams({ a: '&', q: '?' }, '?a=%23#frag')).toBe('?a=%26&q=%3F#frag');
     });
+
+    it('treats "+" as "%20"', () => {
+      expect(urlUtils.mergeUrlParams({ ref: 'bogus' }, '?a=lorem+ipsum&ref=charlie')).toBe(
+        '?a=lorem%20ipsum&ref=bogus',
+      );
+    });
   });
 
   describe('removeParams', () => {