From dbd33a18b8eab4ff3c34aa2cd2069f7c043c7f96 Mon Sep 17 00:00:00 2001
From: ylakhdar <ylakhdar@coveo.com>
Date: Tue, 25 Jun 2024 17:08:35 -0400
Subject: [PATCH] fix(atomic): escape searchQuery in regex (#4116)

https://coveord.atlassian.net/browse/KIT-3337
---
 .../common/facets/facet-search/facet-search-utils.spec.ts   | 6 ++++++
 .../common/facets/facet-search/facet-search-utils.ts        | 2 +-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.spec.ts b/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.spec.ts
index 21631a17343..027bea7ae8e 100644
--- a/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.spec.ts
+++ b/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.spec.ts
@@ -26,4 +26,10 @@ describe('#highlightSearchResult', () => {
       '&lt;script&gt;<span part="search-highlight" class="font-bold">con</span>sole.log(&quot;hmm&quot;)&lt;script&gt;'
     );
   });
+
+  it('should not highlight in the middle of an escaped character', () => {
+    expect(highlightSearchResult('foo&bar', 'foo&')).toBe(
+      '<span part="search-highlight" class="font-bold">foo&amp;</span>bar'
+    );
+  });
 });
diff --git a/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.ts b/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.ts
index 0bf788e1d88..2fd047c88bf 100644
--- a/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.ts
+++ b/packages/atomic/src/components/common/facets/facet-search/facet-search-utils.ts
@@ -52,7 +52,7 @@ export function highlightSearchResult(resultValue: string, searchQuery = '') {
     return sanitizedResult;
   }
 
-  const regex = new RegExp(`(${regexEncode(searchQuery)})`, 'i');
+  const regex = new RegExp(`(${regexEncode(escape(searchQuery))})`, 'i');
   return escape(resultValue).replace(
     regex,
     '<span part="search-highlight" class="font-bold">$1</span>'