Fixed bug with hint not showing when in middle of text

4 files changed, 16 insertions, 22 deletions

diff --git a/app/assets/javascripts/filtered_search/dropdown_hint.js.es6 b/app/assets/javascripts/filtered_search/dropdown_hint.js.es6
index 63c20f57520..f4ec3b206cc 100644
--- a/app/assets/javascripts/filtered_search/dropdown_hint.js.es6
+++ b/app/assets/javascripts/filtered_search/dropdown_hint.js.es6
@@ -9,7 +9,7 @@
       this.config = {
         droplabFilter: {
           template: 'hint',
-          filterFunction: gl.DropdownUtils.filterHint,
+          filterFunction: gl.DropdownUtils.filterHint.bind(null, input),
         },
       };
     }
diff --git a/app/assets/javascripts/filtered_search/dropdown_user.js.es6 b/app/assets/javascripts/filtered_search/dropdown_user.js.es6
index 2e9e53458fb..7bf199d9274 100644
--- a/app/assets/javascripts/filtered_search/dropdown_user.js.es6
+++ b/app/assets/javascripts/filtered_search/dropdown_user.js.es6
@@ -37,7 +37,7 @@
     }
 
     getSearchInput() {
-      const query = gl.DropdownUtils.getSearchInput(this.input).trim();
+      const query = gl.DropdownUtils.getSearchInput(this.input);
       const { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
 
       return lastToken.value || '';
diff --git a/app/assets/javascripts/filtered_search/dropdown_utils.js.es6 b/app/assets/javascripts/filtered_search/dropdown_utils.js.es6
index 86fcc8f2612..df4103b0e7f 100644
--- a/app/assets/javascripts/filtered_search/dropdown_utils.js.es6
+++ b/app/assets/javascripts/filtered_search/dropdown_utils.js.es6
@@ -22,7 +22,7 @@
 
     static filterWithSymbol(filterSymbol, input, item) {
       const updatedItem = item;
-      const query = gl.DropdownUtils.getSearchInput(input).trim();
+      const query = gl.DropdownUtils.getSearchInput(input);
       const { lastToken, searchToken } = gl.FilteredSearchTokenizer.processTokens(query);
 
       if (lastToken !== searchToken) {
@@ -45,8 +45,9 @@
       return updatedItem;
     }
 
-    static filterHint(item, query) {
+    static filterHint(input, item) {
       const updatedItem = item;
+      const query = gl.DropdownUtils.getSearchInput(input);
       let { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
       lastToken = lastToken.key || lastToken || '';
 
@@ -79,32 +80,34 @@
       const inputValue = filteredSearchInput.value;
       const { right } = gl.DropdownUtils.getInputSelectionPosition(filteredSearchInput);
 
-      if (right < 0) {
-        return inputValue;
-      }
-
-      return inputValue.slice(0, right + 1).trim();
+      return inputValue.slice(0, right);
     }
 
     static getInputSelectionPosition(input) {
+      const selectionStart = input.selectionStart;
       let inputValue = input.value;
       // Replace all spaces inside quote marks with underscores
       // This helps with matching the beginning & end of a token:key
       inputValue = inputValue.replace(/"(.*?)"/g, str => str.replace(/\s/g, '_') );
 
-      const selectionStart = input.selectionStart;
+      // Get the right position for the word selected
       let right = inputValue.slice(selectionStart).search(/\s/);
 
       if (right >= 0) {
         right += selectionStart;
+      } else if (right < 0) {
+        right = inputValue.length;
       }
 
-      let left = inputValue.slice(0, selectionStart + 1).search(/\S+$/);
+      // Get the left position for the word selected
+      let left = inputValue.slice(0, right).search(/\S+$/);
 
       if (selectionStart === 0) {
         left = 0;
       } else if (selectionStart === inputValue.length && left < 0) {
         left = inputValue.length;
+      } else if (left < 0) {
+        left = selectionStart;
       }
 
       return {
diff --git a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6 b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6
index fc00e77ae7f..f3750c2b23e 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6
+++ b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6
@@ -62,12 +62,7 @@
 
       // Get the string to replace
       const selectionStart = input.selectionStart;
-      const { left } = gl.DropdownUtils.getInputSelectionPosition(input);
-      let { right } = gl.DropdownUtils.getInputSelectionPosition(input);
-
-      if (right < 0) {
-        right = inputValue.length;
-      }
+      const { left, right } = gl.DropdownUtils.getInputSelectionPosition(input);
 
       input.value = `${inputValue.substr(0, left)}${word}${inputValue.substr(right)}`;
       gl.FilteredSearchDropdownManager.updateInputCaretPosition(selectionStart, input);
@@ -79,11 +74,7 @@
       input.setSelectionRange(selectionStart, selectionStart);
 
       const inputValue = input.value;
-      let { right } = gl.DropdownUtils.getInputSelectionPosition(input);
-
-      if (right < 0) {
-        right = inputValue.length;
-      }
+      const { right } = gl.DropdownUtils.getInputSelectionPosition(input);
 
       input.setSelectionRange(right, right);
     }