Logs: Fixed incorrect highlighting on empty line filter (#52214) (#52327)

* fixed hightlighting searchwords

* do not add empty searchWords

(cherry picked from commit a2512dd1c7)

Co-authored-by: Sven Grossmann <Svennergr@gmail.com>

public/app/plugins/datasource/loki/query_utils.test.ts

@@ -6,6 +6,36 @@ describe('getHighlighterExpressionsFromQuery', () => {
     expect(getHighlighterExpressionsFromQuery('')).toEqual([]);
   });
 
+  it('returns no expression for query with empty filter ', () => {
+    expect(getHighlighterExpressionsFromQuery('{foo="bar"} |= ``')).toEqual([]);
+  });
+
+  it('returns no expression for query with empty filter and parser', () => {
+    expect(getHighlighterExpressionsFromQuery('{foo="bar"} |= `` | json count="counter" | __error__=``')).toEqual([]);
+  });
+
+  it('returns no expression for query with empty filter and chained filter', () => {
+    expect(
+      getHighlighterExpressionsFromQuery('{foo="bar"} |= `` |= `highlight` | json count="counter" | __error__=``')
+    ).toEqual(['highlight']);
+  });
+
+  it('returns no expression for query with empty filter, chained and regex filter', () => {
+    expect(
+      getHighlighterExpressionsFromQuery(
+        '{foo="bar"} |= `` |= `highlight` |~ `high.ight` | json count="counter" | __error__=``'
+      )
+    ).toEqual(['highlight', 'high.ight']);
+  });
+
+  it('returns no expression for query with empty filter, chained and regex quotes filter', () => {
+    expect(
+      getHighlighterExpressionsFromQuery(
+        '{foo="bar"} |= `` |= `highlight` |~ "highlight\\\\d" | json count="counter" | __error__=``'
+      )
+    ).toEqual(['highlight', 'highlight\\d']);
+  });
+
   it('returns an expression for query with filter using quotes', () => {
     expect(getHighlighterExpressionsFromQuery('{foo="bar"} |= "x"')).toEqual(['x']);
   });

public/app/plugins/datasource/loki/query_utils.ts

@@ -29,8 +29,8 @@ export function getHighlighterExpressionsFromQuery(input: string): string[] {
     if (skip) {
       continue;
     }
-    // Check if there is more chained
-    const filterEnd = expression.search(/\|=|\|~|!=|!~/);
+    // Check if there is more chained, by just looking for the next pipe-operator
+    const filterEnd = expression.search(/\|/);
     let filterTerm;
     if (filterEnd === -1) {
       filterTerm = expression.trim();
@@ -47,14 +47,20 @@ export function getHighlighterExpressionsFromQuery(input: string): string[] {
       const unwrappedFilterTerm = term[1];
       const regexOperator = filterOperator === '|~';
 
+      let resultTerm = '';
+
       // Only filter expressions with |~ operator are treated as regular expressions
       if (regexOperator) {
         // When using backticks, Loki doesn't require to escape special characters and we can just push regular expression to highlights array
         // When using quotes, we have extra backslash escaping and we need to replace \\ with \
-        results.push(backtickedTerm ? unwrappedFilterTerm : unwrappedFilterTerm.replace(/\\\\/g, '\\'));
+        resultTerm = backtickedTerm ? unwrappedFilterTerm : unwrappedFilterTerm.replace(/\\\\/g, '\\');
       } else {
         // We need to escape this string so it is not matched as regular expression
-        results.push(escapeRegExp(unwrappedFilterTerm));
+        resultTerm = escapeRegExp(unwrappedFilterTerm);
+      }
+
+      if (resultTerm) {
+        results.push(resultTerm);
       }
     } else {
       return results;