FIX: Letters between words incorrectly highlighted within post.

discourse · Apr 3, 2019 · d1fa2b7 · d1fa2b7
1 parent e8a4d72
commit d1fa2b7
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 8 deletions.
diff --git a/app/assets/javascripts/discourse/lib/highlight-text.js.es6 b/app/assets/javascripts/discourse/lib/highlight-text.js.es6
@@ -2,7 +2,7 @@ import { PHRASE_MATCH_REGEXP_PATTERN } from "discourse/lib/concerns/search-const
 
 export const CLASS_NAME = "search-highlight";
 
-export default function($elem, term) {
+export default function($elem, term, opts = {}) {
   if (!_.isEmpty(term)) {
     // special case ignore "l" which is used for magic sorting
     let words = _.reject(
@@ -11,6 +11,8 @@ export default function($elem, term) {
     );
 
     words = words.map(w => w.replace(/^"(.*)"$/, "$1"));
-    $elem.highlight(words, { className: CLASS_NAME, wordsOnly: true });
+    const highlightOpts = { wordsOnly: true };
+    if (!opts.defaultClassName) highlightOpts.className = CLASS_NAME;
+    $elem.highlight(words, highlightOpts);
   }
 }
diff --git a/app/assets/javascripts/discourse/widgets/post-cooked.js.es6 b/app/assets/javascripts/discourse/widgets/post-cooked.js.es6
@@ -2,6 +2,7 @@ import { iconHTML } from "discourse-common/lib/icon-library";
 import { ajax } from "discourse/lib/ajax";
 import { isValidLink } from "discourse/lib/click-track";
 import { number } from "discourse/lib/formatter";
+import highlightText from "discourse/lib/highlight-text";
 
 const _decorators = [];
 
@@ -45,7 +46,8 @@ export default class PostCooked {
       if (this._highlighted) {
         $html.unhighlight();
       }
-      $html.highlight(highlight.split(/\s+/));
+
+      highlightText($html, highlight, { defaultClassName: true });
       this._highlighted = true;
     } else if (this._highlighted) {
       $html.unhighlight();

diff --git a/test/javascripts/acceptance/search-test.js.es6 b/test/javascripts/acceptance/search-test.js.es6
@@ -75,15 +75,22 @@ QUnit.test("Search with context", async assert => {
   await visit("/t/internationalization-localization/280/1");
 
   await click("#search-button");
-  await fillIn("#search-term", "dev");
+  await fillIn("#search-term", "a proper");
   await click(".search-context input[type='checkbox']");
   await keyEvent("#search-term", "keyup", 16);
 
   assert.ok(exists(".search-menu .results ul li"), "it shows results");
 
-  assert.ok(
-    exists(".cooked span.highlight-strong"),
-    "it should highlight the search term"
+  const highlighted = [];
+
+  find("#post_7 span.highlight-strong").map((_, span) => {
+    highlighted.push(span.innerText);
+  });
+
+  assert.deepEqual(
+    highlighted,
+    ["a", "a", "proper", "a"],
+    "it should highlight the post with the search terms correctly"
   );
 
   let callbackCalled = false;

diff --git a/vendor/assets/javascripts/highlight.js b/vendor/assets/javascripts/highlight.js
@@ -106,4 +106,3 @@ jQuery.fn.highlight = function (words, options) {
         jQuery.highlight(this, re, settings.element, settings.className);
     });
 };
-