fix(): not highlighting html tags

baloise · Jan 25, 2024 · 9889f3f · 9889f3f
1 parent 0b8a633
commit 9889f3f
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/packages/pipes/src/balHighlight.spec.ts b/packages/pipes/src/balHighlight.spec.ts
@@ -18,4 +18,14 @@ describe('balHighlight', () => {
       `<a href="localhost:4200/mybaloise-api/api/documents/v1/12345678-1234-4321-1234-123456789012-12345678?filename=Vertrag" target="_blank"><span class="bal-highlight">Vertrag</span></a>`,
     )
   })
+  test('should return the same text without highlighting when searching <', () => {
+    expect(balHighlight(`<b style="font-weight: 700;">Vertrag</b>`, '<')).toBe(
+      `<b style="font-weight: 700;">Vertrag</b>`,
+    )
+  })
+  test('should return the same text without highlighting when searching html props', () => {
+    expect(balHighlight(`<b style="font-weight: 700;">Vertrag</b>`, 'font-weight')).toBe(
+      `<b style="font-weight: 700;">Vertrag</b>`,
+    )
+  })
 })
diff --git a/packages/pipes/src/balHighlight.ts b/packages/pipes/src/balHighlight.ts
@@ -7,7 +7,7 @@
  */
 export function balHighlight(value: string, search: string, cssClass = 'bal-highlight'): string {
   if (search && value) {
-    const hrefTag = '(href="[^>]+")|('
+    const hrefTag = '(<(.*?)>)|('
     let pattern = hrefTag.concat(search.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&')).concat(')')
     pattern = pattern
       .split(' ')
@@ -17,7 +17,7 @@ export function balHighlight(value: string, search: string, cssClass = 'bal-high
       .join('|')
     const regex = new RegExp(pattern, 'gi')
     return value.replace(regex, match => {
-      return match.includes('href') ? match : `<span class="${cssClass}">${match}</span>`
+      return match.includes('<') && match.includes('>') ? match : `<span class="${cssClass}">${match}</span>`
     })
   } else {
     return value