support [[var]] in cloudwatch datasource (#7649)

* support [[var]] form in cloudwatch datasource

* support multi variable in single dimension

* fix test

public/app/plugins/datasource/cloudwatch/datasource.js

@@ -4,9 +4,10 @@ define([
   'moment',
   'moment',
   'app/core/utils/datemath',
   'app/core/utils/datemath',
   'app/core/utils/kbn',
   'app/core/utils/kbn',
+  'app/features/templating/variable',
   './annotation_query',
   './annotation_query',
 ],
 ],
-function (angular, _, moment, dateMath, kbn, CloudWatchAnnotationQuery) {
+function (angular, _, moment, dateMath, kbn, templatingVariable, CloudWatchAnnotationQuery) {
   'use strict';
   'use strict';
 
 
   /** @ngInject */
   /** @ngInject */
@@ -390,7 +391,7 @@ function (angular, _, moment, dateMath, kbn, CloudWatchAnnotationQuery) {
       });
       });
     }
     }
 
 
-    this.getExpandedVariables = function(target, dimensionKey, variable) {
+    this.getExpandedVariables = function(target, dimensionKey, variable, templateSrv) {
       /* if the all checkbox is marked we should add all values to the targets */
       /* if the all checkbox is marked we should add all values to the targets */
       var allSelected = _.find(variable.options, {'selected': true, 'text': 'All'});
       var allSelected = _.find(variable.options, {'selected': true, 'text': 'All'});
       return _.chain(variable.options)
       return _.chain(variable.options)
@@ -403,15 +404,13 @@ function (angular, _, moment, dateMath, kbn, CloudWatchAnnotationQuery) {
       })
       })
       .map(function(v) {
       .map(function(v) {
         var t = angular.copy(target);
         var t = angular.copy(target);
-        t.dimensions[dimensionKey] = v.value;
+        var scopedVar = {};
+        scopedVar[variable.name] = v;
+        t.dimensions[dimensionKey] = templateSrv.replace(t.dimensions[dimensionKey], scopedVar);
         return t;
         return t;
       }).value();
       }).value();
     };
     };
 
 
-    this.containsVariable = function (str, variableName) {
-      return str.indexOf('$' + variableName) !== -1;
-    };
-
     this.expandTemplateVariable = function(targets, scopedVars, templateSrv) {
     this.expandTemplateVariable = function(targets, scopedVars, templateSrv) {
       var self = this;
       var self = this;
       return _.chain(targets)
       return _.chain(targets)
@@ -421,10 +420,13 @@ function (angular, _, moment, dateMath, kbn, CloudWatchAnnotationQuery) {
         });
         });
 
 
         if (dimensionKey) {
         if (dimensionKey) {
+          var multiVariable = _.find(templateSrv.variables, function(variable) {
+            return templatingVariable.containsVariable(target.dimensions[dimensionKey], variable.name) && variable.multi;
+          });
           var variable = _.find(templateSrv.variables, function(variable) {
           var variable = _.find(templateSrv.variables, function(variable) {
-            return self.containsVariable(target.dimensions[dimensionKey], variable.name);
+            return templatingVariable.containsVariable(target.dimensions[dimensionKey], variable.name);
           });
           });
-          return self.getExpandedVariables(target, dimensionKey, variable);
+          return self.getExpandedVariables(target, dimensionKey, multiVariable || variable, templateSrv);
         } else {
         } else {
           return [target];
           return [target];
         }
         }

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

@@ -134,11 +134,18 @@ describe('CloudWatchDatasource', function() {
           {
           {
             name: 'instance_id',
             name: 'instance_id',
             options: [
             options: [
-              { value: 'i-23456789', selected: false },
-              { value: 'i-34567890', selected: true }
+              { text: 'i-23456789', value: 'i-23456789', selected: false },
+              { text: 'i-34567890', value: 'i-34567890', selected: true }
             ]
             ]
           }
           }
         ],
         ],
+        replace: function (target, scopedVars) {
+          if (target === '$instance_id' && scopedVars['instance_id']['text'] === 'i-34567890') {
+            return 'i-34567890';
+          } else {
+            return '';
+          }
+        },
         getVariableName: function (e) { return 'instance_id'; },
         getVariableName: function (e) { return 'instance_id'; },
         variableExists: function (e) { return true; },
         variableExists: function (e) { return true; },
         containsVariable: function (str, variableName) { return str.indexOf('$' + variableName) !== -1; }
         containsVariable: function (str, variableName) { return str.indexOf('$' + variableName) !== -1; }