Loki datasource: interpolate query before adding adhoc filters (#89849)

* Loki datasource: interpolate query before adding adhoc filters

* Chore: remove unused export

* Prettier

* Chore: made test case more obvious

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

@@ -271,6 +271,39 @@ describe('LokiDatasource', () => {
         'rate({bar="baz", job="foo", k1=~"v.*", k2=~"v\\\\\'.*"} |= "bar" [5m])'
       );
     });
+
+    it('should interpolate before adding adhoc filters', async () => {
+      const originalQuery = 'rate({bar="baz", job="foo"} |= "bar" [$__auto])';
+      const interpolatedQuery = 'rate({bar="baz", job="foo"} |= "bar" [5m])';
+      const templateSrv = {
+        replace: jest.fn().mockImplementation((input: string) => interpolatedQuery),
+        getVariables: () => [],
+      };
+      const query: LokiQuery = { expr: originalQuery, refId: 'A' };
+      const ds = createLokiDatasource(templateSrv);
+      const adhocFilters = [
+        {
+          key: 'k1',
+          operator: '=',
+          value: 'v1',
+        },
+        {
+          key: 'k2',
+          operator: '!=',
+          value: 'v2',
+        },
+      ];
+      jest.spyOn(ds, 'addAdHocFilters');
+
+      ds.applyTemplateVariables(query, {}, adhocFilters);
+
+      expect(templateSrv.replace).toHaveBeenCalledWith(originalQuery, expect.any(Object), expect.any(Function));
+      expect(ds.addAdHocFilters).toHaveBeenCalledWith(interpolatedQuery, adhocFilters);
+
+      expect(ds.applyTemplateVariables(query, {}, adhocFilters).expr).toBe(
+        'rate({bar="baz", job="foo", k1="v1", k2!="v2"} |= "bar" [5m])'
+      );
+    });
   });
 
   describe('when interpolating variables', () => {

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

@@ -1089,8 +1089,6 @@ export class LokiDatasource
     // alerting/ML queries and we want to have consistent interpolation for all queries
     const { __auto, __interval, __interval_ms, __range, __range_s, __range_ms, ...rest } = scopedVars || {};
 
-    const exprWithAdHoc = this.addAdHocFilters(target.expr, adhocFilters);
-
     const variables = {
       ...rest,
 
@@ -1102,10 +1100,16 @@ export class LokiDatasource
         value: '$__interval_ms',
       },
     };
+
+    const exprWithAdHoc = this.addAdHocFilters(
+      this.templateSrv.replace(target.expr, variables, this.interpolateQueryExpr),
+      adhocFilters
+    );
+
     return {
       ...target,
       legendFormat: this.templateSrv.replace(target.legendFormat, rest),
-      expr: this.templateSrv.replace(exprWithAdHoc, variables, this.interpolateQueryExpr),
+      expr: exprWithAdHoc,
     };
   }