Cloudwatch: fix template variables in variable queries (#48140)

public/app/plugins/datasource/cloudwatch/__mocks__/CloudWatchDataSource.ts

@@ -47,7 +47,7 @@ export function setupMockedDataSource({ data = [], variables }: { data?: any; va
   const fetchMock = jest.fn().mockReturnValue(of({ data }));
   setBackendSrv({ fetch: fetchMock } as any);
 
-  return { datasource, fetchMock };
+  return { datasource, fetchMock, templateService };
 }
 
 export const metricVariable: CustomVariableModel = {
@@ -125,3 +125,19 @@ export const aggregationvariable: CustomVariableModel = {
   ],
   multi: false,
 };
+
+export const dimensionVariable: CustomVariableModel = {
+  ...initialCustomVariableModelState,
+  id: 'dimension',
+  name: 'dimension',
+  current: {
+    value: 'env',
+    text: 'env',
+    selected: true,
+  },
+  options: [
+    { value: 'env', text: 'env', selected: false },
+    { value: 'tag', text: 'tag', selected: false },
+  ],
+  multi: false,
+};

public/app/plugins/datasource/cloudwatch/datasource.ts

@@ -125,7 +125,7 @@ export class CloudWatchDatasource
     this.logsTimeout = instanceSettings.jsonData.logsTimeout || '15m';
     this.sqlCompletionItemProvider = new SQLCompletionItemProvider(this, this.templateSrv);
     this.metricMathCompletionItemProvider = new MetricMathCompletionItemProvider(this, this.templateSrv);
-    this.variables = new CloudWatchVariableSupport(this);
+    this.variables = new CloudWatchVariableSupport(this, this.templateSrv);
   }
 
   query(options: DataQueryRequest<CloudWatchQuery>): Observable<DataQueryResponse> {

public/app/plugins/datasource/cloudwatch/variables.test.ts

@@ -1,4 +1,4 @@
-import { setupMockedDataSource } from './__mocks__/CloudWatchDataSource';
+import { dimensionVariable, labelsVariable, setupMockedDataSource } from './__mocks__/CloudWatchDataSource';
 import { VariableQuery, VariableQueryType } from './types';
 import { CloudWatchVariableSupport } from './variables';
 
@@ -16,7 +16,7 @@ const defaultQuery: VariableQuery = {
   refId: '',
 };
 
-const ds = setupMockedDataSource();
+const ds = setupMockedDataSource({ variables: [labelsVariable, dimensionVariable] });
 ds.datasource.getRegions = jest.fn().mockResolvedValue([{ label: 'a', value: 'a' }]);
 ds.datasource.getNamespaces = jest.fn().mockResolvedValue([{ label: 'b', value: 'b' }]);
 ds.datasource.getMetrics = jest.fn().mockResolvedValue([{ label: 'c', value: 'c' }]);
@@ -26,7 +26,7 @@ const getEbsVolumeIds = jest.fn().mockResolvedValue([{ label: 'f', value: 'f' }]
 const getEc2InstanceAttribute = jest.fn().mockResolvedValue([{ label: 'g', value: 'g' }]);
 const getResourceARNs = jest.fn().mockResolvedValue([{ label: 'h', value: 'h' }]);
 
-const variables = new CloudWatchVariableSupport(ds.datasource);
+const variables = new CloudWatchVariableSupport(ds.datasource, ds.templateService);
 
 describe('variables', () => {
   it('should run regions', async () => {
@@ -114,7 +114,7 @@ describe('variables', () => {
       ...defaultQuery,
       queryType: VariableQueryType.EC2InstanceAttributes,
       attributeName: 'abc',
-      ec2Filters: '{"a":["b"]}',
+      ec2Filters: '{"$dimension":["b"]}',
     };
     beforeEach(() => {
       ds.datasource.getEc2InstanceAttribute = getEc2InstanceAttribute;
@@ -129,7 +129,7 @@ describe('variables', () => {
 
     it('should run if instance id set', async () => {
       const result = await variables.execute(query);
-      expect(getEc2InstanceAttribute).toBeCalledWith(query.region, query.attributeName, { a: ['b'] });
+      expect(getEc2InstanceAttribute).toBeCalledWith(query.region, query.attributeName, { env: ['b'] });
       expect(result).toEqual([{ text: 'g', value: 'g', expandable: true }]);
     });
   });
@@ -139,7 +139,7 @@ describe('variables', () => {
       ...defaultQuery,
       queryType: VariableQueryType.ResourceArns,
       resourceType: 'abc',
-      tags: '{"a":["b"]}',
+      tags: '{"a":${labels:json}}',
     };
     beforeEach(() => {
       ds.datasource.getResourceARNs = getResourceARNs;
@@ -154,7 +154,7 @@ describe('variables', () => {
 
     it('should run if instance id set', async () => {
       const result = await variables.execute(query);
-      expect(getResourceARNs).toBeCalledWith(query.region, query.resourceType, { a: ['b'] });
+      expect(getResourceARNs).toBeCalledWith(query.region, query.resourceType, { a: ['InstanceId', 'InstanceType'] });
       expect(result).toEqual([{ text: 'h', value: 'h', expandable: true }]);
     });
   });

public/app/plugins/datasource/cloudwatch/variables.ts

@@ -2,6 +2,7 @@ import { from, Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 
 import { CustomVariableSupport, DataQueryRequest, DataQueryResponse } from '@grafana/data';
+import { getTemplateSrv, TemplateSrv } from '@grafana/runtime';
 
 import { VariableQueryEditor } from './components/VariableQueryEditor/VariableQueryEditor';
 import { CloudWatchDatasource } from './datasource';
@@ -10,10 +11,12 @@ import { VariableQuery, VariableQueryType } from './types';
 
 export class CloudWatchVariableSupport extends CustomVariableSupport<CloudWatchDatasource, VariableQuery> {
   private readonly datasource: CloudWatchDatasource;
+  private readonly templateSrv: TemplateSrv;
 
-  constructor(datasource: CloudWatchDatasource) {
+  constructor(datasource: CloudWatchDatasource, templateSrv: TemplateSrv = getTemplateSrv()) {
     super();
     this.datasource = datasource;
+    this.templateSrv = templateSrv;
     this.query = this.query.bind(this);
   }
 
@@ -124,7 +127,7 @@ export class CloudWatchVariableSupport extends CustomVariableSupport<CloudWatchD
     }
     let filterJson = {};
     if (ec2Filters) {
-      filterJson = JSON.parse(ec2Filters);
+      filterJson = JSON.parse(this.templateSrv.replace(ec2Filters));
     }
     const values = await this.datasource.getEc2InstanceAttribute(region, attributeName, filterJson);
     return values.map((s: { label: string; value: string }) => ({
@@ -140,7 +143,7 @@ export class CloudWatchVariableSupport extends CustomVariableSupport<CloudWatchD
     }
     let tagJson = {};
     if (tags) {
-      tagJson = JSON.parse(tags);
+      tagJson = JSON.parse(this.templateSrv.replace(tags));
     }
     const keys = await this.datasource.getResourceARNs(region, resourceType, tagJson);
     return keys.map((s: { label: string; value: string }) => ({