Fix filtering usernames with multiple wordsfix-filtering-username-with-multiple-words

3 files changed, 52 insertions, 1 deletions

diff --git a/app/assets/javascripts/filtered_search/dropdown_user.js.es6 b/app/assets/javascripts/filtered_search/dropdown_user.js.es6
index 7bf199d9274..162fd6044e5 100644
--- a/app/assets/javascripts/filtered_search/dropdown_user.js.es6
+++ b/app/assets/javascripts/filtered_search/dropdown_user.js.es6
@@ -39,8 +39,15 @@
     getSearchInput() {
       const query = gl.DropdownUtils.getSearchInput(this.input);
       const { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
+      let value = lastToken.value || '';
 
-      return lastToken.value || '';
+      // Removes the first character if it is a quotation so that we can search
+      // with multiple words
+      if (value[0] === '"' || value[0] === '\'') {
+        value = value.slice(1);
+      }
+
+      return value;
     }
 
     init() {
diff --git a/changelogs/unreleased/fix-filtering-username-with-multiple-words.yml b/changelogs/unreleased/fix-filtering-username-with-multiple-words.yml
new file mode 100644
index 00000000000..3513f5afdfb
--- /dev/null
+++ b/changelogs/unreleased/fix-filtering-username-with-multiple-words.yml
@@ -0,0 +1,4 @@
+---
+title: Fix filtering usernames with multiple words
+merge_request: 8851
+author:
diff --git a/spec/javascripts/filtered_search/dropdown_user_spec.js.es6 b/spec/javascripts/filtered_search/dropdown_user_spec.js.es6
new file mode 100644
index 00000000000..5eba4343a1d
--- /dev/null
+++ b/spec/javascripts/filtered_search/dropdown_user_spec.js.es6
@@ -0,0 +1,40 @@
+//= require filtered_search/dropdown_utils
+//= require filtered_search/filtered_search_tokenizer
+//= require filtered_search/filtered_search_dropdown
+//= require filtered_search/dropdown_user
+
+(() => {
+  describe('Dropdown User', () => {
+    describe('getSearchInput', () => {
+      let dropdownUser;
+
+      beforeEach(() => {
+        spyOn(gl.FilteredSearchDropdown.prototype, 'constructor').and.callFake(() => {});
+        spyOn(gl.DropdownUser.prototype, 'getProjectId').and.callFake(() => {});
+        spyOn(gl.DropdownUtils, 'getSearchInput').and.callFake(() => {});
+
+        dropdownUser = new gl.DropdownUser();
+      });
+
+      it('should not return the double quote found in value', () => {
+        spyOn(gl.FilteredSearchTokenizer, 'processTokens').and.returnValue({
+          lastToken: {
+            value: '"johnny appleseed',
+          },
+        });
+
+        expect(dropdownUser.getSearchInput()).toBe('johnny appleseed');
+      });
+
+      it('should not return the single quote found in value', () => {
+        spyOn(gl.FilteredSearchTokenizer, 'processTokens').and.returnValue({
+          lastToken: {
+            value: '\'larry boy',
+          },
+        });
+
+        expect(dropdownUser.getSearchInput()).toBe('larry boy');
+      });
+    });
+  });
+})();