From 025c0649fae47a9e36a67932b25fbf131a2cd9a4 Mon Sep 17 00:00:00 2001
From: josdejong <wjosdejong@gmail.com>
Date: Thu, 2 Jul 2020 20:07:27 +0200
Subject: [PATCH] Fix regression introduced in `v9.0.2` in the select boxes in
 the Transform model not lighlighting the matches correctly

---
 HISTORY.md                       |  6 ++++++
 src/js/assets/selectr/selectr.js | 37 ++++++++++++++++++++++++++------
 2 files changed, 36 insertions(+), 7 deletions(-)

diff --git a/HISTORY.md b/HISTORY.md
index 68a729b..0002dce 100644
--- a/HISTORY.md
+++ b/HISTORY.md
@@ -3,6 +3,12 @@
 https://github.com/josdejong/jsoneditor
 
 
+## 2020-07-02, version 9.0.3
+
+- Fix regression introduced in `v9.0.2` in the select boxes in the 
+  Transform model not lighlighting the matches correctly.
+
+
 ## 2020-07-01, version 9.0.2
 
 - Fix #1029: XSS vulnerabilities. Thanks @onemoreflag for reporting.
diff --git a/src/js/assets/selectr/selectr.js b/src/js/assets/selectr/selectr.js
index 5271e7b..6779a6c 100644
--- a/src/js/assets/selectr/selectr.js
+++ b/src/js/assets/selectr/selectr.js
@@ -286,6 +286,9 @@ function appendItem(item, parent, custom) {
   }
 
   util.removeClass(item, "excluded");
+  if (!custom) {
+    item.textContent = item.textContent + ''; // clear highlighting
+  }
 }
 
 /**
@@ -912,6 +915,10 @@ var clearSearch = function() {
       // Items that didn't match need the class
       // removing to make them visible again
       util.removeClass(item, "excluded");
+      // Remove the span element for underlining matched items
+      if (!this.customOption) {
+        item.textContent = item.textContent + ''; // clear highlighting
+      }
     }, this);
   }
 };
@@ -919,15 +926,21 @@ var clearSearch = function() {
 /**
  * Query matching for searches
  * @param  {string} query
- * @param  {HTMLOptionElement} option
- * @return {bool}
+ * @param  {string} text
  */
-var match = function(query, option) {
-  var result = new RegExp(query, "i").exec(option.textContent);
+var match = function(query, text) {
+  var result = new RegExp(query, "i").exec(text);
   if (result) {
-    return option.textContent.replace(result[0], "<span class='selectr-match'>" + result[0] + "</span>");
+    var start = result.index;
+    var end = result.index + result[0].length;
+
+    return {
+      before: text.substring(0, start),
+      match: text.substring(start, end),
+      after: text.substring(end)
+    };
   }
-  return false;
+  return null;
 };
 
 // Main Lib
@@ -1798,7 +1811,17 @@ Selectr.prototype.search = function(string) {
 
         // Underline the matching results
         if (!this.customOption) {
-          item.textContent = match(string, option);
+          item.textContent = ''
+
+          var result = match(string, option.textContent);
+          if (result) {
+            item.appendChild(document.createTextNode(result.before));
+            var highlight = document.createElement('span');
+            highlight.className = 'selectr-match';
+            highlight.appendChild(document.createTextNode(result.match));
+            item.appendChild(highlight);
+            item.appendChild(document.createTextNode(result.after));
+          }
         }
       } else {
         util.addClass(item, "excluded");