From 7f4723a9a7402621c6ac02ea66622db7eb2829b6 Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <tobias.skarhed@gmail.com>
Date: Wed, 1 Aug 2018 14:21:05 +0200
Subject: [PATCH 1/4] Begin conversion

---
 .../templating/specs/variable_srv.jest.ts     | 595 ++++++++++++++++++
 1 file changed, 595 insertions(+)
 create mode 100644 public/app/features/templating/specs/variable_srv.jest.ts

diff --git a/public/app/features/templating/specs/variable_srv.jest.ts b/public/app/features/templating/specs/variable_srv.jest.ts
new file mode 100644
index 00000000000..d38a89675e6
--- /dev/null
+++ b/public/app/features/templating/specs/variable_srv.jest.ts
@@ -0,0 +1,595 @@
+import '../all';
+import { VariableSrv } from '../variable_srv';
+import moment from 'moment';
+import $q from 'q';
+// import { model } from 'mobx-state-tree/dist/internal';
+// import { Emitter } from 'app/core/core';
+
+describe('VariableSrv', function() {
+  var ctx = <any>{
+    datasourceSrv: {},
+    timeSrv: {
+      timeRange: () => {},
+    },
+    $rootScope: {
+      $on: () => {},
+    },
+    $injector: {
+      instantiate: (ctr, obj) => new ctr(obj.model),
+    },
+    templateSrv: {
+      setGrafanaVariable: jest.fn(),
+      init: () => {},
+      updateTemplateData: () => {},
+    },
+    $location: {
+      search: () => {},
+    },
+  };
+
+  //   beforeEach(ctx.providePhase(['datasourceSrv', 'timeSrv', 'templateSrv', '$location']));
+  //   beforeEach(
+  //     angularMocks.inject(($rootScope, $q, $location, $injector) => {
+  //       ctx.$q = $q;
+  //       ctx.$rootScope = $rootScope;
+  //       ctx.$location = $location;
+  //       ctx.variableSrv = $injector.get('variableSrv');
+  //       ctx.variableSrv.init({
+  //         templating: { list: [] },
+  //         events: new Emitter(),
+  //         updateSubmenuVisibility: sinon.stub(),
+  //       });
+  //       ctx.$rootScope.$digest();
+  //     })
+  //   );
+
+  function describeUpdateVariable(desc, fn) {
+    describe(desc, function() {
+      var scenario: any = {};
+      scenario.setup = function(setupFn) {
+        scenario.setupFn = setupFn;
+      };
+
+      beforeEach(function() {
+        scenario.setupFn();
+
+        var ds: any = {};
+        ds.metricFindQuery = Promise.resolve(scenario.queryResult);
+
+        ctx.variableSrv = new VariableSrv(ctx.$rootScope, $q, ctx.$location, ctx.$injector, ctx.templateSrv);
+
+        ctx.variableSrv.timeSrv = ctx.timeSrv;
+        console.log(ctx.variableSrv.timeSrv);
+        ctx.variableSrv.datasourceSrv = {
+          get: Promise.resolve(ds),
+          getMetricSources: () => scenario.metricSources,
+        };
+
+        ctx.variableSrv.init({
+          templating: { list: [] },
+          updateSubmenuVisibility: () => {},
+        });
+
+        scenario.variable = ctx.variableSrv.createVariableFromModel(scenario.variableModel);
+        ctx.variableSrv.addVariable(scenario.variable);
+
+        ctx.variableSrv.updateOptions(scenario.variable);
+        // ctx.$rootScope.$digest();
+      });
+
+      fn(scenario);
+    });
+  }
+
+  describeUpdateVariable('interval variable without auto', scenario => {
+    scenario.setup(() => {
+      scenario.variableModel = {
+        type: 'interval',
+        query: '1s,2h,5h,1d',
+        name: 'test',
+      };
+    });
+
+    it('should update options array', () => {
+      expect(scenario.variable.options.length).toBe(4);
+      expect(scenario.variable.options[0].text).toBe('1s');
+      expect(scenario.variable.options[0].value).toBe('1s');
+    });
+  });
+
+  //
+  // Interval variable update
+  //
+  describeUpdateVariable('interval variable with auto', scenario => {
+    scenario.setup(() => {
+      scenario.variableModel = {
+        type: 'interval',
+        query: '1s,2h,5h,1d',
+        name: 'test',
+        auto: true,
+        auto_count: 10,
+      };
+
+      var range = {
+        from: moment(new Date())
+          .subtract(7, 'days')
+          .toDate(),
+        to: new Date(),
+      };
+
+      ctx.timeSrv.timeRange = () => range;
+      //   ctx.templateSrv.setGrafanaVariable = jest.fn();
+    });
+
+    it('should update options array', function() {
+      expect(scenario.variable.options.length).toBe(5);
+      expect(scenario.variable.options[0].text).toBe('auto');
+      expect(scenario.variable.options[0].value).toBe('$__auto_interval_test');
+    });
+
+    it('should set $__auto_interval_test', function() {
+      var call = ctx.templateSrv.setGrafanaVariable.firstCall;
+      expect(call.args[0]).toBe('$__auto_interval_test');
+      expect(call.args[1]).toBe('12h');
+    });
+
+    // updateAutoValue() gets called twice: once directly once via VariableSrv.validateVariableSelectionState()
+    // So use lastCall instead of a specific call number
+    it('should set $__auto_interval', function() {
+      var call = ctx.templateSrv.setGrafanaVariable.lastCall;
+      expect(call.args[0]).toBe('$__auto_interval');
+      expect(call.args[1]).toBe('12h');
+    });
+  });
+
+  //
+  // Query variable update
+  //
+  describeUpdateVariable('query variable with empty current object and refresh', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: '',
+        name: 'test',
+        current: {},
+      };
+      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
+    });
+
+    it('should set current value to first option', function() {
+      expect(scenario.variable.options.length).toBe(2);
+      expect(scenario.variable.current.value).toBe('backend1');
+    });
+  });
+
+  describeUpdateVariable(
+    'query variable with multi select and new options does not contain some selected values',
+    function(scenario) {
+      scenario.setup(function() {
+        scenario.variableModel = {
+          type: 'query',
+          query: '',
+          name: 'test',
+          current: {
+            value: ['val1', 'val2', 'val3'],
+            text: 'val1 + val2 + val3',
+          },
+        };
+        scenario.queryResult = [{ text: 'val2' }, { text: 'val3' }];
+      });
+
+      it('should update current value', function() {
+        expect(scenario.variable.current.value).toEqual(['val2', 'val3']);
+        expect(scenario.variable.current.text).toEqual('val2 + val3');
+      });
+    }
+  );
+
+  describeUpdateVariable(
+    'query variable with multi select and new options does not contain any selected values',
+    function(scenario) {
+      scenario.setup(function() {
+        scenario.variableModel = {
+          type: 'query',
+          query: '',
+          name: 'test',
+          current: {
+            value: ['val1', 'val2', 'val3'],
+            text: 'val1 + val2 + val3',
+          },
+        };
+        scenario.queryResult = [{ text: 'val5' }, { text: 'val6' }];
+      });
+
+      it('should update current value with first one', function() {
+        expect(scenario.variable.current.value).toEqual('val5');
+        expect(scenario.variable.current.text).toEqual('val5');
+      });
+    }
+  );
+
+  describeUpdateVariable('query variable with multi select and $__all selected', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: '',
+        name: 'test',
+        includeAll: true,
+        current: {
+          value: ['$__all'],
+          text: 'All',
+        },
+      };
+      scenario.queryResult = [{ text: 'val5' }, { text: 'val6' }];
+    });
+
+    it('should keep current All value', function() {
+      expect(scenario.variable.current.value).toEqual(['$__all']);
+      expect(scenario.variable.current.text).toEqual('All');
+    });
+  });
+
+  describeUpdateVariable('query variable with numeric results', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: '',
+        name: 'test',
+        current: {},
+      };
+      scenario.queryResult = [{ text: 12, value: 12 }];
+    });
+
+    it('should set current value to first option', function() {
+      expect(scenario.variable.current.value).toBe('12');
+      expect(scenario.variable.options[0].value).toBe('12');
+      expect(scenario.variable.options[0].text).toBe('12');
+    });
+  });
+
+  describeUpdateVariable('basic query variable', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
+      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
+    });
+
+    it('should update options array', function() {
+      expect(scenario.variable.options.length).toBe(2);
+      expect(scenario.variable.options[0].text).toBe('backend1');
+      expect(scenario.variable.options[0].value).toBe('backend1');
+      expect(scenario.variable.options[1].value).toBe('backend2');
+    });
+
+    it('should select first option as value', function() {
+      expect(scenario.variable.current.value).toBe('backend1');
+    });
+  });
+
+  describeUpdateVariable('and existing value still exists in options', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
+      scenario.variableModel.current = { value: 'backend2', text: 'backend2' };
+      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
+    });
+
+    it('should keep variable value', function() {
+      expect(scenario.variable.current.text).toBe('backend2');
+    });
+  });
+
+  describeUpdateVariable('and regex pattern exists', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
+      scenario.variableModel.regex = '/apps.*(backend_[0-9]+)/';
+      scenario.queryResult = [
+        { text: 'apps.backend.backend_01.counters.req' },
+        { text: 'apps.backend.backend_02.counters.req' },
+      ];
+    });
+
+    it('should extract and use match group', function() {
+      expect(scenario.variable.options[0].value).toBe('backend_01');
+    });
+  });
+
+  describeUpdateVariable('and regex pattern exists and no match', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
+      scenario.variableModel.regex = '/apps.*(backendasd[0-9]+)/';
+      scenario.queryResult = [
+        { text: 'apps.backend.backend_01.counters.req' },
+        { text: 'apps.backend.backend_02.counters.req' },
+      ];
+    });
+
+    it('should not add non matching items, None option should be added instead', function() {
+      expect(scenario.variable.options.length).toBe(1);
+      expect(scenario.variable.options[0].isNone).toBe(true);
+    });
+  });
+
+  describeUpdateVariable('regex pattern without slashes', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
+      scenario.variableModel.regex = 'backend_01';
+      scenario.queryResult = [
+        { text: 'apps.backend.backend_01.counters.req' },
+        { text: 'apps.backend.backend_02.counters.req' },
+      ];
+    });
+
+    it('should return matches options', function() {
+      expect(scenario.variable.options.length).toBe(1);
+    });
+  });
+
+  describeUpdateVariable('regex pattern remove duplicates', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
+      scenario.variableModel.regex = '/backend_01/';
+      scenario.queryResult = [
+        { text: 'apps.backend.backend_01.counters.req' },
+        { text: 'apps.backend.backend_01.counters.req' },
+      ];
+    });
+
+    it('should return matches options', function() {
+      expect(scenario.variable.options.length).toBe(1);
+    });
+  });
+
+  describeUpdateVariable('with include All', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: 'apps.*',
+        name: 'test',
+        includeAll: true,
+      };
+      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }, { text: 'backend3' }];
+    });
+
+    it('should add All option', function() {
+      expect(scenario.variable.options[0].text).toBe('All');
+      expect(scenario.variable.options[0].value).toBe('$__all');
+    });
+  });
+
+  describeUpdateVariable('with include all and custom value', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: 'apps.*',
+        name: 'test',
+        includeAll: true,
+        allValue: '*',
+      };
+      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }, { text: 'backend3' }];
+    });
+
+    it('should add All option with custom value', function() {
+      expect(scenario.variable.options[0].value).toBe('$__all');
+    });
+  });
+
+  describeUpdateVariable('without sort', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: 'apps.*',
+        name: 'test',
+        sort: 0,
+      };
+      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
+    });
+
+    it('should return options without sort', function() {
+      expect(scenario.variable.options[0].text).toBe('bbb2');
+      expect(scenario.variable.options[1].text).toBe('aaa10');
+      expect(scenario.variable.options[2].text).toBe('ccc3');
+    });
+  });
+
+  describeUpdateVariable('with alphabetical sort (asc)', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: 'apps.*',
+        name: 'test',
+        sort: 1,
+      };
+      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
+    });
+
+    it('should return options with alphabetical sort', function() {
+      expect(scenario.variable.options[0].text).toBe('aaa10');
+      expect(scenario.variable.options[1].text).toBe('bbb2');
+      expect(scenario.variable.options[2].text).toBe('ccc3');
+    });
+  });
+
+  describeUpdateVariable('with alphabetical sort (desc)', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: 'apps.*',
+        name: 'test',
+        sort: 2,
+      };
+      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
+    });
+
+    it('should return options with alphabetical sort', function() {
+      expect(scenario.variable.options[0].text).toBe('ccc3');
+      expect(scenario.variable.options[1].text).toBe('bbb2');
+      expect(scenario.variable.options[2].text).toBe('aaa10');
+    });
+  });
+
+  describeUpdateVariable('with numerical sort (asc)', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: 'apps.*',
+        name: 'test',
+        sort: 3,
+      };
+      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
+    });
+
+    it('should return options with numerical sort', function() {
+      expect(scenario.variable.options[0].text).toBe('bbb2');
+      expect(scenario.variable.options[1].text).toBe('ccc3');
+      expect(scenario.variable.options[2].text).toBe('aaa10');
+    });
+  });
+
+  describeUpdateVariable('with numerical sort (desc)', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'query',
+        query: 'apps.*',
+        name: 'test',
+        sort: 4,
+      };
+      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
+    });
+
+    it('should return options with numerical sort', function() {
+      expect(scenario.variable.options[0].text).toBe('aaa10');
+      expect(scenario.variable.options[1].text).toBe('ccc3');
+      expect(scenario.variable.options[2].text).toBe('bbb2');
+    });
+  });
+
+  //
+  // datasource variable update
+  //
+  describeUpdateVariable('datasource variable with regex filter', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'datasource',
+        query: 'graphite',
+        name: 'test',
+        current: { value: 'backend4_pee', text: 'backend4_pee' },
+        regex: '/pee$/',
+      };
+      scenario.metricSources = [
+        { name: 'backend1', meta: { id: 'influx' } },
+        { name: 'backend2_pee', meta: { id: 'graphite' } },
+        { name: 'backend3', meta: { id: 'graphite' } },
+        { name: 'backend4_pee', meta: { id: 'graphite' } },
+      ];
+    });
+
+    it('should set only contain graphite ds and filtered using regex', function() {
+      expect(scenario.variable.options.length).toBe(2);
+      expect(scenario.variable.options[0].value).toBe('backend2_pee');
+      expect(scenario.variable.options[1].value).toBe('backend4_pee');
+    });
+
+    it('should keep current value if available', function() {
+      expect(scenario.variable.current.value).toBe('backend4_pee');
+    });
+  });
+
+  //
+  // Custom variable update
+  //
+  describeUpdateVariable('update custom variable', function(scenario) {
+    scenario.setup(function() {
+      scenario.variableModel = {
+        type: 'custom',
+        query: 'hej, hop, asd',
+        name: 'test',
+      };
+    });
+
+    it('should update options array', function() {
+      expect(scenario.variable.options.length).toBe(3);
+      expect(scenario.variable.options[0].text).toBe('hej');
+      expect(scenario.variable.options[1].value).toBe('hop');
+    });
+  });
+
+  describe('multiple interval variables with auto', function() {
+    var variable1, variable2;
+
+    beforeEach(function() {
+      var range = {
+        from: moment(new Date())
+          .subtract(7, 'days')
+          .toDate(),
+        to: new Date(),
+      };
+      ctx.timeSrv.timeRange = () => range;
+      ctx.templateSrv.setGrafanaVariable = jest.fn();
+
+      var variableModel1 = {
+        type: 'interval',
+        query: '1s,2h,5h,1d',
+        name: 'variable1',
+        auto: true,
+        auto_count: 10,
+      };
+      variable1 = ctx.variableSrv.createVariableFromModel(variableModel1);
+      ctx.variableSrv.addVariable(variable1);
+
+      var variableModel2 = {
+        type: 'interval',
+        query: '1s,2h,5h',
+        name: 'variable2',
+        auto: true,
+        auto_count: 1000,
+      };
+      variable2 = ctx.variableSrv.createVariableFromModel(variableModel2);
+      ctx.variableSrv.addVariable(variable2);
+
+      ctx.variableSrv.updateOptions(variable1);
+      ctx.variableSrv.updateOptions(variable2);
+      ctx.$rootScope.$digest();
+    });
+
+    it('should update options array', function() {
+      expect(variable1.options.length).toBe(5);
+      expect(variable1.options[0].text).toBe('auto');
+      expect(variable1.options[0].value).toBe('$__auto_interval_variable1');
+      expect(variable2.options.length).toBe(4);
+      expect(variable2.options[0].text).toBe('auto');
+      expect(variable2.options[0].value).toBe('$__auto_interval_variable2');
+    });
+
+    it('should correctly set $__auto_interval_variableX', function() {
+      var variable1Set,
+        variable2Set,
+        legacySet,
+        unknownSet = false;
+      // updateAutoValue() gets called repeatedly: once directly once via VariableSrv.validateVariableSelectionState()
+      // So check that all calls are valid rather than expect a specific number and/or ordering of calls
+      for (var i = 0; i < ctx.templateSrv.setGrafanaVariable.mock.calls.length; i++) {
+        var call = ctx.templateSrv.setGrafanaVariable.mock.calls[i];
+        switch (call.args[0]) {
+          case '$__auto_interval_variable1':
+            expect(call[1]).toBe('12h');
+            variable1Set = true;
+            break;
+          case '$__auto_interval_variable2':
+            expect(call[1]).toBe('10m');
+            variable2Set = true;
+            break;
+          case '$__auto_interval':
+            expect(call[1]).toEqual(expect.stringMatching(/^(12h|10m)$/));
+            legacySet = true;
+            break;
+          default:
+            unknownSet = true;
+            break;
+        }
+      }
+      expect(variable1Set).toBe.equal(true);
+      expect(variable2Set).toBe.equal(true);
+      expect(legacySet).toBe.equal(true);
+      expect(unknownSet).toBe.equal(false);
+    });
+  });
+});

From 034ca6961026c828960a7397806fe8cb1d91cdb4 Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <tobias.skarhed@gmail.com>
Date: Wed, 1 Aug 2018 15:17:10 +0200
Subject: [PATCH 2/4] Add mock constructor

---
 .../templating/specs/variable_srv.jest.ts     | 59 +++++++++++++------
 1 file changed, 41 insertions(+), 18 deletions(-)

diff --git a/public/app/features/templating/specs/variable_srv.jest.ts b/public/app/features/templating/specs/variable_srv.jest.ts
index d38a89675e6..33a28cda08e 100644
--- a/public/app/features/templating/specs/variable_srv.jest.ts
+++ b/public/app/features/templating/specs/variable_srv.jest.ts
@@ -19,8 +19,14 @@ describe('VariableSrv', function() {
     },
     templateSrv: {
       setGrafanaVariable: jest.fn(),
-      init: () => {},
+      init: vars => {
+        this.variables = vars;
+      },
       updateTemplateData: () => {},
+      replace: str =>
+        str.replace(this.regex, match => {
+          return match;
+        }),
     },
     $location: {
       search: () => {},
@@ -54,17 +60,20 @@ describe('VariableSrv', function() {
         scenario.setupFn();
 
         var ds: any = {};
-        ds.metricFindQuery = Promise.resolve(scenario.queryResult);
+        ds.metricFindQuery = () => Promise.resolve(scenario.queryResult);
 
         ctx.variableSrv = new VariableSrv(ctx.$rootScope, $q, ctx.$location, ctx.$injector, ctx.templateSrv);
 
         ctx.variableSrv.timeSrv = ctx.timeSrv;
-        console.log(ctx.variableSrv.timeSrv);
-        ctx.variableSrv.datasourceSrv = {
-          get: Promise.resolve(ds),
+        ctx.datasourceSrv = {
+          get: () => Promise.resolve(ds),
           getMetricSources: () => scenario.metricSources,
         };
 
+        ctx.$injector.instantiate = (ctr, model) => {
+          return getVarMockConstructor(ctr, model, ctx);
+        };
+
         ctx.variableSrv.init({
           templating: { list: [] },
           updateSubmenuVisibility: () => {},
@@ -74,7 +83,6 @@ describe('VariableSrv', function() {
         ctx.variableSrv.addVariable(scenario.variable);
 
         ctx.variableSrv.updateOptions(scenario.variable);
-        // ctx.$rootScope.$digest();
       });
 
       fn(scenario);
@@ -128,17 +136,17 @@ describe('VariableSrv', function() {
     });
 
     it('should set $__auto_interval_test', function() {
-      var call = ctx.templateSrv.setGrafanaVariable.firstCall;
-      expect(call.args[0]).toBe('$__auto_interval_test');
-      expect(call.args[1]).toBe('12h');
+      var call = ctx.templateSrv.setGrafanaVariable.mock.calls[0];
+      expect(call[0]).toBe('$__auto_interval_test');
+      expect(call[1]).toBe('12h');
     });
 
     // updateAutoValue() gets called twice: once directly once via VariableSrv.validateVariableSelectionState()
     // So use lastCall instead of a specific call number
     it('should set $__auto_interval', function() {
-      var call = ctx.templateSrv.setGrafanaVariable.lastCall;
-      expect(call.args[0]).toBe('$__auto_interval');
-      expect(call.args[1]).toBe('12h');
+      var call = ctx.templateSrv.setGrafanaVariable.mock.calls.pop();
+      expect(call[0]).toBe('$__auto_interval');
+      expect(call[1]).toBe('12h');
     });
   });
 
@@ -547,7 +555,7 @@ describe('VariableSrv', function() {
 
       ctx.variableSrv.updateOptions(variable1);
       ctx.variableSrv.updateOptions(variable2);
-      ctx.$rootScope.$digest();
+      // ctx.$rootScope.$digest();
     });
 
     it('should update options array', function() {
@@ -568,7 +576,7 @@ describe('VariableSrv', function() {
       // So check that all calls are valid rather than expect a specific number and/or ordering of calls
       for (var i = 0; i < ctx.templateSrv.setGrafanaVariable.mock.calls.length; i++) {
         var call = ctx.templateSrv.setGrafanaVariable.mock.calls[i];
-        switch (call.args[0]) {
+        switch (call[0]) {
           case '$__auto_interval_variable1':
             expect(call[1]).toBe('12h');
             variable1Set = true;
@@ -586,10 +594,25 @@ describe('VariableSrv', function() {
             break;
         }
       }
-      expect(variable1Set).toBe.equal(true);
-      expect(variable2Set).toBe.equal(true);
-      expect(legacySet).toBe.equal(true);
-      expect(unknownSet).toBe.equal(false);
+      expect(variable1Set).toEqual(true);
+      expect(variable2Set).toEqual(true);
+      expect(legacySet).toEqual(true);
+      expect(unknownSet).toEqual(false);
     });
   });
 });
+
+function getVarMockConstructor(variable, model, ctx) {
+  switch (model.model.type) {
+    case 'datasource':
+      return new variable(model.model, ctx.datasourceSrv, ctx.variableSrv, ctx.templateSrv);
+    case 'query':
+      return new variable(model.model, ctx.datasourceSrv, ctx.templateSrv, ctx.variableSrv);
+    case 'interval':
+      return new variable(model.model, ctx.timeSrv, ctx.templateSrv, ctx.variableSrv);
+    case 'custom':
+      return new variable(model.model, ctx.variableSrv);
+    default:
+      return new variable(model.model);
+  }
+}

From 46dd4eba9e9a1777bdba24b1fb4089bcec601816 Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <tobias.skarhed@gmail.com>
Date: Wed, 1 Aug 2018 15:38:48 +0200
Subject: [PATCH 3/4] All tests passing

---
 .../templating/specs/variable_srv.jest.ts     | 122 ++++++++----------
 1 file changed, 52 insertions(+), 70 deletions(-)

diff --git a/public/app/features/templating/specs/variable_srv.jest.ts b/public/app/features/templating/specs/variable_srv.jest.ts
index 33a28cda08e..f7796434b5e 100644
--- a/public/app/features/templating/specs/variable_srv.jest.ts
+++ b/public/app/features/templating/specs/variable_srv.jest.ts
@@ -2,8 +2,6 @@ import '../all';
 import { VariableSrv } from '../variable_srv';
 import moment from 'moment';
 import $q from 'q';
-// import { model } from 'mobx-state-tree/dist/internal';
-// import { Emitter } from 'app/core/core';
 
 describe('VariableSrv', function() {
   var ctx = <any>{
@@ -33,30 +31,14 @@ describe('VariableSrv', function() {
     },
   };
 
-  //   beforeEach(ctx.providePhase(['datasourceSrv', 'timeSrv', 'templateSrv', '$location']));
-  //   beforeEach(
-  //     angularMocks.inject(($rootScope, $q, $location, $injector) => {
-  //       ctx.$q = $q;
-  //       ctx.$rootScope = $rootScope;
-  //       ctx.$location = $location;
-  //       ctx.variableSrv = $injector.get('variableSrv');
-  //       ctx.variableSrv.init({
-  //         templating: { list: [] },
-  //         events: new Emitter(),
-  //         updateSubmenuVisibility: sinon.stub(),
-  //       });
-  //       ctx.$rootScope.$digest();
-  //     })
-  //   );
-
   function describeUpdateVariable(desc, fn) {
-    describe(desc, function() {
+    describe(desc, () => {
       var scenario: any = {};
       scenario.setup = function(setupFn) {
         scenario.setupFn = setupFn;
       };
 
-      beforeEach(function() {
+      beforeEach(async () => {
         scenario.setupFn();
 
         var ds: any = {};
@@ -82,7 +64,7 @@ describe('VariableSrv', function() {
         scenario.variable = ctx.variableSrv.createVariableFromModel(scenario.variableModel);
         ctx.variableSrv.addVariable(scenario.variable);
 
-        ctx.variableSrv.updateOptions(scenario.variable);
+        await ctx.variableSrv.updateOptions(scenario.variable);
       });
 
       fn(scenario);
@@ -129,13 +111,13 @@ describe('VariableSrv', function() {
       //   ctx.templateSrv.setGrafanaVariable = jest.fn();
     });
 
-    it('should update options array', function() {
+    it('should update options array', () => {
       expect(scenario.variable.options.length).toBe(5);
       expect(scenario.variable.options[0].text).toBe('auto');
       expect(scenario.variable.options[0].value).toBe('$__auto_interval_test');
     });
 
-    it('should set $__auto_interval_test', function() {
+    it('should set $__auto_interval_test', () => {
       var call = ctx.templateSrv.setGrafanaVariable.mock.calls[0];
       expect(call[0]).toBe('$__auto_interval_test');
       expect(call[1]).toBe('12h');
@@ -143,7 +125,7 @@ describe('VariableSrv', function() {
 
     // updateAutoValue() gets called twice: once directly once via VariableSrv.validateVariableSelectionState()
     // So use lastCall instead of a specific call number
-    it('should set $__auto_interval', function() {
+    it('should set $__auto_interval', () => {
       var call = ctx.templateSrv.setGrafanaVariable.mock.calls.pop();
       expect(call[0]).toBe('$__auto_interval');
       expect(call[1]).toBe('12h');
@@ -154,7 +136,7 @@ describe('VariableSrv', function() {
   // Query variable update
   //
   describeUpdateVariable('query variable with empty current object and refresh', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: '',
@@ -164,7 +146,7 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
     });
 
-    it('should set current value to first option', function() {
+    it('should set current value to first option', () => {
       expect(scenario.variable.options.length).toBe(2);
       expect(scenario.variable.current.value).toBe('backend1');
     });
@@ -173,7 +155,7 @@ describe('VariableSrv', function() {
   describeUpdateVariable(
     'query variable with multi select and new options does not contain some selected values',
     function(scenario) {
-      scenario.setup(function() {
+      scenario.setup(() => {
         scenario.variableModel = {
           type: 'query',
           query: '',
@@ -186,7 +168,7 @@ describe('VariableSrv', function() {
         scenario.queryResult = [{ text: 'val2' }, { text: 'val3' }];
       });
 
-      it('should update current value', function() {
+      it('should update current value', () => {
         expect(scenario.variable.current.value).toEqual(['val2', 'val3']);
         expect(scenario.variable.current.text).toEqual('val2 + val3');
       });
@@ -196,7 +178,7 @@ describe('VariableSrv', function() {
   describeUpdateVariable(
     'query variable with multi select and new options does not contain any selected values',
     function(scenario) {
-      scenario.setup(function() {
+      scenario.setup(() => {
         scenario.variableModel = {
           type: 'query',
           query: '',
@@ -209,7 +191,7 @@ describe('VariableSrv', function() {
         scenario.queryResult = [{ text: 'val5' }, { text: 'val6' }];
       });
 
-      it('should update current value with first one', function() {
+      it('should update current value with first one', () => {
         expect(scenario.variable.current.value).toEqual('val5');
         expect(scenario.variable.current.text).toEqual('val5');
       });
@@ -217,7 +199,7 @@ describe('VariableSrv', function() {
   );
 
   describeUpdateVariable('query variable with multi select and $__all selected', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: '',
@@ -231,14 +213,14 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'val5' }, { text: 'val6' }];
     });
 
-    it('should keep current All value', function() {
+    it('should keep current All value', () => {
       expect(scenario.variable.current.value).toEqual(['$__all']);
       expect(scenario.variable.current.text).toEqual('All');
     });
   });
 
   describeUpdateVariable('query variable with numeric results', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: '',
@@ -248,7 +230,7 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 12, value: 12 }];
     });
 
-    it('should set current value to first option', function() {
+    it('should set current value to first option', () => {
       expect(scenario.variable.current.value).toBe('12');
       expect(scenario.variable.options[0].value).toBe('12');
       expect(scenario.variable.options[0].text).toBe('12');
@@ -256,37 +238,37 @@ describe('VariableSrv', function() {
   });
 
   describeUpdateVariable('basic query variable', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
       scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
     });
 
-    it('should update options array', function() {
+    it('should update options array', () => {
       expect(scenario.variable.options.length).toBe(2);
       expect(scenario.variable.options[0].text).toBe('backend1');
       expect(scenario.variable.options[0].value).toBe('backend1');
       expect(scenario.variable.options[1].value).toBe('backend2');
     });
 
-    it('should select first option as value', function() {
+    it('should select first option as value', () => {
       expect(scenario.variable.current.value).toBe('backend1');
     });
   });
 
   describeUpdateVariable('and existing value still exists in options', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
       scenario.variableModel.current = { value: 'backend2', text: 'backend2' };
       scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
     });
 
-    it('should keep variable value', function() {
+    it('should keep variable value', () => {
       expect(scenario.variable.current.text).toBe('backend2');
     });
   });
 
   describeUpdateVariable('and regex pattern exists', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
       scenario.variableModel.regex = '/apps.*(backend_[0-9]+)/';
       scenario.queryResult = [
@@ -295,13 +277,13 @@ describe('VariableSrv', function() {
       ];
     });
 
-    it('should extract and use match group', function() {
+    it('should extract and use match group', () => {
       expect(scenario.variable.options[0].value).toBe('backend_01');
     });
   });
 
   describeUpdateVariable('and regex pattern exists and no match', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
       scenario.variableModel.regex = '/apps.*(backendasd[0-9]+)/';
       scenario.queryResult = [
@@ -310,14 +292,14 @@ describe('VariableSrv', function() {
       ];
     });
 
-    it('should not add non matching items, None option should be added instead', function() {
+    it('should not add non matching items, None option should be added instead', () => {
       expect(scenario.variable.options.length).toBe(1);
       expect(scenario.variable.options[0].isNone).toBe(true);
     });
   });
 
   describeUpdateVariable('regex pattern without slashes', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
       scenario.variableModel.regex = 'backend_01';
       scenario.queryResult = [
@@ -326,13 +308,13 @@ describe('VariableSrv', function() {
       ];
     });
 
-    it('should return matches options', function() {
+    it('should return matches options', () => {
       expect(scenario.variable.options.length).toBe(1);
     });
   });
 
   describeUpdateVariable('regex pattern remove duplicates', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
       scenario.variableModel.regex = '/backend_01/';
       scenario.queryResult = [
@@ -341,13 +323,13 @@ describe('VariableSrv', function() {
       ];
     });
 
-    it('should return matches options', function() {
+    it('should return matches options', () => {
       expect(scenario.variable.options.length).toBe(1);
     });
   });
 
   describeUpdateVariable('with include All', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: 'apps.*',
@@ -357,14 +339,14 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }, { text: 'backend3' }];
     });
 
-    it('should add All option', function() {
+    it('should add All option', () => {
       expect(scenario.variable.options[0].text).toBe('All');
       expect(scenario.variable.options[0].value).toBe('$__all');
     });
   });
 
   describeUpdateVariable('with include all and custom value', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: 'apps.*',
@@ -375,13 +357,13 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }, { text: 'backend3' }];
     });
 
-    it('should add All option with custom value', function() {
+    it('should add All option with custom value', () => {
       expect(scenario.variable.options[0].value).toBe('$__all');
     });
   });
 
   describeUpdateVariable('without sort', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: 'apps.*',
@@ -391,7 +373,7 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
     });
 
-    it('should return options without sort', function() {
+    it('should return options without sort', () => {
       expect(scenario.variable.options[0].text).toBe('bbb2');
       expect(scenario.variable.options[1].text).toBe('aaa10');
       expect(scenario.variable.options[2].text).toBe('ccc3');
@@ -399,7 +381,7 @@ describe('VariableSrv', function() {
   });
 
   describeUpdateVariable('with alphabetical sort (asc)', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: 'apps.*',
@@ -409,7 +391,7 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
     });
 
-    it('should return options with alphabetical sort', function() {
+    it('should return options with alphabetical sort', () => {
       expect(scenario.variable.options[0].text).toBe('aaa10');
       expect(scenario.variable.options[1].text).toBe('bbb2');
       expect(scenario.variable.options[2].text).toBe('ccc3');
@@ -417,7 +399,7 @@ describe('VariableSrv', function() {
   });
 
   describeUpdateVariable('with alphabetical sort (desc)', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: 'apps.*',
@@ -427,7 +409,7 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
     });
 
-    it('should return options with alphabetical sort', function() {
+    it('should return options with alphabetical sort', () => {
       expect(scenario.variable.options[0].text).toBe('ccc3');
       expect(scenario.variable.options[1].text).toBe('bbb2');
       expect(scenario.variable.options[2].text).toBe('aaa10');
@@ -435,7 +417,7 @@ describe('VariableSrv', function() {
   });
 
   describeUpdateVariable('with numerical sort (asc)', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: 'apps.*',
@@ -445,7 +427,7 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
     });
 
-    it('should return options with numerical sort', function() {
+    it('should return options with numerical sort', () => {
       expect(scenario.variable.options[0].text).toBe('bbb2');
       expect(scenario.variable.options[1].text).toBe('ccc3');
       expect(scenario.variable.options[2].text).toBe('aaa10');
@@ -453,7 +435,7 @@ describe('VariableSrv', function() {
   });
 
   describeUpdateVariable('with numerical sort (desc)', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'query',
         query: 'apps.*',
@@ -463,7 +445,7 @@ describe('VariableSrv', function() {
       scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
     });
 
-    it('should return options with numerical sort', function() {
+    it('should return options with numerical sort', () => {
       expect(scenario.variable.options[0].text).toBe('aaa10');
       expect(scenario.variable.options[1].text).toBe('ccc3');
       expect(scenario.variable.options[2].text).toBe('bbb2');
@@ -474,7 +456,7 @@ describe('VariableSrv', function() {
   // datasource variable update
   //
   describeUpdateVariable('datasource variable with regex filter', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'datasource',
         query: 'graphite',
@@ -490,13 +472,13 @@ describe('VariableSrv', function() {
       ];
     });
 
-    it('should set only contain graphite ds and filtered using regex', function() {
+    it('should set only contain graphite ds and filtered using regex', () => {
       expect(scenario.variable.options.length).toBe(2);
       expect(scenario.variable.options[0].value).toBe('backend2_pee');
       expect(scenario.variable.options[1].value).toBe('backend4_pee');
     });
 
-    it('should keep current value if available', function() {
+    it('should keep current value if available', () => {
       expect(scenario.variable.current.value).toBe('backend4_pee');
     });
   });
@@ -505,7 +487,7 @@ describe('VariableSrv', function() {
   // Custom variable update
   //
   describeUpdateVariable('update custom variable', function(scenario) {
-    scenario.setup(function() {
+    scenario.setup(() => {
       scenario.variableModel = {
         type: 'custom',
         query: 'hej, hop, asd',
@@ -513,17 +495,17 @@ describe('VariableSrv', function() {
       };
     });
 
-    it('should update options array', function() {
+    it('should update options array', () => {
       expect(scenario.variable.options.length).toBe(3);
       expect(scenario.variable.options[0].text).toBe('hej');
       expect(scenario.variable.options[1].value).toBe('hop');
     });
   });
 
-  describe('multiple interval variables with auto', function() {
+  describe('multiple interval variables with auto', () => {
     var variable1, variable2;
 
-    beforeEach(function() {
+    beforeEach(() => {
       var range = {
         from: moment(new Date())
           .subtract(7, 'days')
@@ -558,7 +540,7 @@ describe('VariableSrv', function() {
       // ctx.$rootScope.$digest();
     });
 
-    it('should update options array', function() {
+    it('should update options array', () => {
       expect(variable1.options.length).toBe(5);
       expect(variable1.options[0].text).toBe('auto');
       expect(variable1.options[0].value).toBe('$__auto_interval_variable1');
@@ -567,7 +549,7 @@ describe('VariableSrv', function() {
       expect(variable2.options[0].value).toBe('$__auto_interval_variable2');
     });
 
-    it('should correctly set $__auto_interval_variableX', function() {
+    it('should correctly set $__auto_interval_variableX', () => {
       var variable1Set,
         variable2Set,
         legacySet,

From 9f87f6081af9945ea2aa1099c897bc6458c5f42d Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <tobias.skarhed@gmail.com>
Date: Wed, 1 Aug 2018 15:39:59 +0200
Subject: [PATCH 4/4] Remove Karma test

---
 .../templating/specs/variable_srv_specs.ts    | 568 ------------------
 1 file changed, 568 deletions(-)
 delete mode 100644 public/app/features/templating/specs/variable_srv_specs.ts

diff --git a/public/app/features/templating/specs/variable_srv_specs.ts b/public/app/features/templating/specs/variable_srv_specs.ts
deleted file mode 100644
index 6ab5dcad20e..00000000000
--- a/public/app/features/templating/specs/variable_srv_specs.ts
+++ /dev/null
@@ -1,568 +0,0 @@
-import { describe, beforeEach, it, sinon, expect, angularMocks } from 'test/lib/common';
-
-import '../all';
-
-import moment from 'moment';
-import helpers from 'test/specs/helpers';
-import { Emitter } from 'app/core/core';
-
-describe('VariableSrv', function() {
-  var ctx = new helpers.ControllerTestContext();
-
-  beforeEach(angularMocks.module('grafana.core'));
-  beforeEach(angularMocks.module('grafana.controllers'));
-  beforeEach(angularMocks.module('grafana.services'));
-
-  beforeEach(ctx.providePhase(['datasourceSrv', 'timeSrv', 'templateSrv', '$location']));
-  beforeEach(
-    angularMocks.inject(($rootScope, $q, $location, $injector) => {
-      ctx.$q = $q;
-      ctx.$rootScope = $rootScope;
-      ctx.$location = $location;
-      ctx.variableSrv = $injector.get('variableSrv');
-      ctx.variableSrv.init({
-        templating: { list: [] },
-        events: new Emitter(),
-        updateSubmenuVisibility: sinon.stub(),
-      });
-      ctx.$rootScope.$digest();
-    })
-  );
-
-  function describeUpdateVariable(desc, fn) {
-    describe(desc, function() {
-      var scenario: any = {};
-      scenario.setup = function(setupFn) {
-        scenario.setupFn = setupFn;
-      };
-
-      beforeEach(function() {
-        scenario.setupFn();
-        var ds: any = {};
-        ds.metricFindQuery = sinon.stub().returns(ctx.$q.when(scenario.queryResult));
-        ctx.datasourceSrv.get = sinon.stub().returns(ctx.$q.when(ds));
-        ctx.datasourceSrv.getMetricSources = sinon.stub().returns(scenario.metricSources);
-
-        scenario.variable = ctx.variableSrv.createVariableFromModel(scenario.variableModel);
-        ctx.variableSrv.addVariable(scenario.variable);
-
-        ctx.variableSrv.updateOptions(scenario.variable);
-        ctx.$rootScope.$digest();
-      });
-
-      fn(scenario);
-    });
-  }
-
-  describeUpdateVariable('interval variable without auto', scenario => {
-    scenario.setup(() => {
-      scenario.variableModel = {
-        type: 'interval',
-        query: '1s,2h,5h,1d',
-        name: 'test',
-      };
-    });
-
-    it('should update options array', () => {
-      expect(scenario.variable.options.length).to.be(4);
-      expect(scenario.variable.options[0].text).to.be('1s');
-      expect(scenario.variable.options[0].value).to.be('1s');
-    });
-  });
-
-  //
-  // Interval variable update
-  //
-  describeUpdateVariable('interval variable with auto', scenario => {
-    scenario.setup(() => {
-      scenario.variableModel = {
-        type: 'interval',
-        query: '1s,2h,5h,1d',
-        name: 'test',
-        auto: true,
-        auto_count: 10,
-      };
-
-      var range = {
-        from: moment(new Date())
-          .subtract(7, 'days')
-          .toDate(),
-        to: new Date(),
-      };
-
-      ctx.timeSrv.timeRange = sinon.stub().returns(range);
-      ctx.templateSrv.setGrafanaVariable = sinon.spy();
-    });
-
-    it('should update options array', function() {
-      expect(scenario.variable.options.length).to.be(5);
-      expect(scenario.variable.options[0].text).to.be('auto');
-      expect(scenario.variable.options[0].value).to.be('$__auto_interval_test');
-    });
-
-    it('should set $__auto_interval_test', function() {
-      var call = ctx.templateSrv.setGrafanaVariable.firstCall;
-      expect(call.args[0]).to.be('$__auto_interval_test');
-      expect(call.args[1]).to.be('12h');
-    });
-
-    // updateAutoValue() gets called twice: once directly once via VariableSrv.validateVariableSelectionState()
-    // So use lastCall instead of a specific call number
-    it('should set $__auto_interval', function() {
-      var call = ctx.templateSrv.setGrafanaVariable.lastCall;
-      expect(call.args[0]).to.be('$__auto_interval');
-      expect(call.args[1]).to.be('12h');
-    });
-  });
-
-  //
-  // Query variable update
-  //
-  describeUpdateVariable('query variable with empty current object and refresh', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: '',
-        name: 'test',
-        current: {},
-      };
-      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
-    });
-
-    it('should set current value to first option', function() {
-      expect(scenario.variable.options.length).to.be(2);
-      expect(scenario.variable.current.value).to.be('backend1');
-    });
-  });
-
-  describeUpdateVariable(
-    'query variable with multi select and new options does not contain some selected values',
-    function(scenario) {
-      scenario.setup(function() {
-        scenario.variableModel = {
-          type: 'query',
-          query: '',
-          name: 'test',
-          current: {
-            value: ['val1', 'val2', 'val3'],
-            text: 'val1 + val2 + val3',
-          },
-        };
-        scenario.queryResult = [{ text: 'val2' }, { text: 'val3' }];
-      });
-
-      it('should update current value', function() {
-        expect(scenario.variable.current.value).to.eql(['val2', 'val3']);
-        expect(scenario.variable.current.text).to.eql('val2 + val3');
-      });
-    }
-  );
-
-  describeUpdateVariable(
-    'query variable with multi select and new options does not contain any selected values',
-    function(scenario) {
-      scenario.setup(function() {
-        scenario.variableModel = {
-          type: 'query',
-          query: '',
-          name: 'test',
-          current: {
-            value: ['val1', 'val2', 'val3'],
-            text: 'val1 + val2 + val3',
-          },
-        };
-        scenario.queryResult = [{ text: 'val5' }, { text: 'val6' }];
-      });
-
-      it('should update current value with first one', function() {
-        expect(scenario.variable.current.value).to.eql('val5');
-        expect(scenario.variable.current.text).to.eql('val5');
-      });
-    }
-  );
-
-  describeUpdateVariable('query variable with multi select and $__all selected', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: '',
-        name: 'test',
-        includeAll: true,
-        current: {
-          value: ['$__all'],
-          text: 'All',
-        },
-      };
-      scenario.queryResult = [{ text: 'val5' }, { text: 'val6' }];
-    });
-
-    it('should keep current All value', function() {
-      expect(scenario.variable.current.value).to.eql(['$__all']);
-      expect(scenario.variable.current.text).to.eql('All');
-    });
-  });
-
-  describeUpdateVariable('query variable with numeric results', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: '',
-        name: 'test',
-        current: {},
-      };
-      scenario.queryResult = [{ text: 12, value: 12 }];
-    });
-
-    it('should set current value to first option', function() {
-      expect(scenario.variable.current.value).to.be('12');
-      expect(scenario.variable.options[0].value).to.be('12');
-      expect(scenario.variable.options[0].text).to.be('12');
-    });
-  });
-
-  describeUpdateVariable('basic query variable', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
-      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
-    });
-
-    it('should update options array', function() {
-      expect(scenario.variable.options.length).to.be(2);
-      expect(scenario.variable.options[0].text).to.be('backend1');
-      expect(scenario.variable.options[0].value).to.be('backend1');
-      expect(scenario.variable.options[1].value).to.be('backend2');
-    });
-
-    it('should select first option as value', function() {
-      expect(scenario.variable.current.value).to.be('backend1');
-    });
-  });
-
-  describeUpdateVariable('and existing value still exists in options', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
-      scenario.variableModel.current = { value: 'backend2', text: 'backend2' };
-      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }];
-    });
-
-    it('should keep variable value', function() {
-      expect(scenario.variable.current.text).to.be('backend2');
-    });
-  });
-
-  describeUpdateVariable('and regex pattern exists', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
-      scenario.variableModel.regex = '/apps.*(backend_[0-9]+)/';
-      scenario.queryResult = [
-        { text: 'apps.backend.backend_01.counters.req' },
-        { text: 'apps.backend.backend_02.counters.req' },
-      ];
-    });
-
-    it('should extract and use match group', function() {
-      expect(scenario.variable.options[0].value).to.be('backend_01');
-    });
-  });
-
-  describeUpdateVariable('and regex pattern exists and no match', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
-      scenario.variableModel.regex = '/apps.*(backendasd[0-9]+)/';
-      scenario.queryResult = [
-        { text: 'apps.backend.backend_01.counters.req' },
-        { text: 'apps.backend.backend_02.counters.req' },
-      ];
-    });
-
-    it('should not add non matching items, None option should be added instead', function() {
-      expect(scenario.variable.options.length).to.be(1);
-      expect(scenario.variable.options[0].isNone).to.be(true);
-    });
-  });
-
-  describeUpdateVariable('regex pattern without slashes', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
-      scenario.variableModel.regex = 'backend_01';
-      scenario.queryResult = [
-        { text: 'apps.backend.backend_01.counters.req' },
-        { text: 'apps.backend.backend_02.counters.req' },
-      ];
-    });
-
-    it('should return matches options', function() {
-      expect(scenario.variable.options.length).to.be(1);
-    });
-  });
-
-  describeUpdateVariable('regex pattern remove duplicates', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = { type: 'query', query: 'apps.*', name: 'test' };
-      scenario.variableModel.regex = '/backend_01/';
-      scenario.queryResult = [
-        { text: 'apps.backend.backend_01.counters.req' },
-        { text: 'apps.backend.backend_01.counters.req' },
-      ];
-    });
-
-    it('should return matches options', function() {
-      expect(scenario.variable.options.length).to.be(1);
-    });
-  });
-
-  describeUpdateVariable('with include All', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: 'apps.*',
-        name: 'test',
-        includeAll: true,
-      };
-      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }, { text: 'backend3' }];
-    });
-
-    it('should add All option', function() {
-      expect(scenario.variable.options[0].text).to.be('All');
-      expect(scenario.variable.options[0].value).to.be('$__all');
-    });
-  });
-
-  describeUpdateVariable('with include all and custom value', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: 'apps.*',
-        name: 'test',
-        includeAll: true,
-        allValue: '*',
-      };
-      scenario.queryResult = [{ text: 'backend1' }, { text: 'backend2' }, { text: 'backend3' }];
-    });
-
-    it('should add All option with custom value', function() {
-      expect(scenario.variable.options[0].value).to.be('$__all');
-    });
-  });
-
-  describeUpdateVariable('without sort', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: 'apps.*',
-        name: 'test',
-        sort: 0,
-      };
-      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
-    });
-
-    it('should return options without sort', function() {
-      expect(scenario.variable.options[0].text).to.be('bbb2');
-      expect(scenario.variable.options[1].text).to.be('aaa10');
-      expect(scenario.variable.options[2].text).to.be('ccc3');
-    });
-  });
-
-  describeUpdateVariable('with alphabetical sort (asc)', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: 'apps.*',
-        name: 'test',
-        sort: 1,
-      };
-      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
-    });
-
-    it('should return options with alphabetical sort', function() {
-      expect(scenario.variable.options[0].text).to.be('aaa10');
-      expect(scenario.variable.options[1].text).to.be('bbb2');
-      expect(scenario.variable.options[2].text).to.be('ccc3');
-    });
-  });
-
-  describeUpdateVariable('with alphabetical sort (desc)', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: 'apps.*',
-        name: 'test',
-        sort: 2,
-      };
-      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
-    });
-
-    it('should return options with alphabetical sort', function() {
-      expect(scenario.variable.options[0].text).to.be('ccc3');
-      expect(scenario.variable.options[1].text).to.be('bbb2');
-      expect(scenario.variable.options[2].text).to.be('aaa10');
-    });
-  });
-
-  describeUpdateVariable('with numerical sort (asc)', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: 'apps.*',
-        name: 'test',
-        sort: 3,
-      };
-      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
-    });
-
-    it('should return options with numerical sort', function() {
-      expect(scenario.variable.options[0].text).to.be('bbb2');
-      expect(scenario.variable.options[1].text).to.be('ccc3');
-      expect(scenario.variable.options[2].text).to.be('aaa10');
-    });
-  });
-
-  describeUpdateVariable('with numerical sort (desc)', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'query',
-        query: 'apps.*',
-        name: 'test',
-        sort: 4,
-      };
-      scenario.queryResult = [{ text: 'bbb2' }, { text: 'aaa10' }, { text: 'ccc3' }];
-    });
-
-    it('should return options with numerical sort', function() {
-      expect(scenario.variable.options[0].text).to.be('aaa10');
-      expect(scenario.variable.options[1].text).to.be('ccc3');
-      expect(scenario.variable.options[2].text).to.be('bbb2');
-    });
-  });
-
-  //
-  // datasource variable update
-  //
-  describeUpdateVariable('datasource variable with regex filter', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'datasource',
-        query: 'graphite',
-        name: 'test',
-        current: { value: 'backend4_pee', text: 'backend4_pee' },
-        regex: '/pee$/',
-      };
-      scenario.metricSources = [
-        { name: 'backend1', meta: { id: 'influx' } },
-        { name: 'backend2_pee', meta: { id: 'graphite' } },
-        { name: 'backend3', meta: { id: 'graphite' } },
-        { name: 'backend4_pee', meta: { id: 'graphite' } },
-      ];
-    });
-
-    it('should set only contain graphite ds and filtered using regex', function() {
-      expect(scenario.variable.options.length).to.be(2);
-      expect(scenario.variable.options[0].value).to.be('backend2_pee');
-      expect(scenario.variable.options[1].value).to.be('backend4_pee');
-    });
-
-    it('should keep current value if available', function() {
-      expect(scenario.variable.current.value).to.be('backend4_pee');
-    });
-  });
-
-  //
-  // Custom variable update
-  //
-  describeUpdateVariable('update custom variable', function(scenario) {
-    scenario.setup(function() {
-      scenario.variableModel = {
-        type: 'custom',
-        query: 'hej, hop, asd',
-        name: 'test',
-      };
-    });
-
-    it('should update options array', function() {
-      expect(scenario.variable.options.length).to.be(3);
-      expect(scenario.variable.options[0].text).to.be('hej');
-      expect(scenario.variable.options[1].value).to.be('hop');
-    });
-  });
-
-  describe('multiple interval variables with auto', function() {
-    var variable1, variable2;
-
-    beforeEach(function() {
-      var range = {
-        from: moment(new Date())
-          .subtract(7, 'days')
-          .toDate(),
-        to: new Date(),
-      };
-      ctx.timeSrv.timeRange = sinon.stub().returns(range);
-      ctx.templateSrv.setGrafanaVariable = sinon.spy();
-
-      var variableModel1 = {
-        type: 'interval',
-        query: '1s,2h,5h,1d',
-        name: 'variable1',
-        auto: true,
-        auto_count: 10,
-      };
-      variable1 = ctx.variableSrv.createVariableFromModel(variableModel1);
-      ctx.variableSrv.addVariable(variable1);
-
-      var variableModel2 = {
-        type: 'interval',
-        query: '1s,2h,5h',
-        name: 'variable2',
-        auto: true,
-        auto_count: 1000,
-      };
-      variable2 = ctx.variableSrv.createVariableFromModel(variableModel2);
-      ctx.variableSrv.addVariable(variable2);
-
-      ctx.variableSrv.updateOptions(variable1);
-      ctx.variableSrv.updateOptions(variable2);
-      ctx.$rootScope.$digest();
-    });
-
-    it('should update options array', function() {
-      expect(variable1.options.length).to.be(5);
-      expect(variable1.options[0].text).to.be('auto');
-      expect(variable1.options[0].value).to.be('$__auto_interval_variable1');
-      expect(variable2.options.length).to.be(4);
-      expect(variable2.options[0].text).to.be('auto');
-      expect(variable2.options[0].value).to.be('$__auto_interval_variable2');
-    });
-
-    it('should correctly set $__auto_interval_variableX', function() {
-      var variable1Set,
-        variable2Set,
-        legacySet,
-        unknownSet = false;
-      // updateAutoValue() gets called repeatedly: once directly once via VariableSrv.validateVariableSelectionState()
-      // So check that all calls are valid rather than expect a specific number and/or ordering of calls
-      for (var i = 0; i < ctx.templateSrv.setGrafanaVariable.callCount; i++) {
-        var call = ctx.templateSrv.setGrafanaVariable.getCall(i);
-        switch (call.args[0]) {
-          case '$__auto_interval_variable1':
-            expect(call.args[1]).to.be('12h');
-            variable1Set = true;
-            break;
-          case '$__auto_interval_variable2':
-            expect(call.args[1]).to.be('10m');
-            variable2Set = true;
-            break;
-          case '$__auto_interval':
-            expect(call.args[1]).to.match(/^(12h|10m)$/);
-            legacySet = true;
-            break;
-          default:
-            unknownSet = true;
-            break;
-        }
-      }
-      expect(variable1Set).to.be.equal(true);
-      expect(variable2Set).to.be.equal(true);
-      expect(legacySet).to.be.equal(true);
-      expect(unknownSet).to.be.equal(false);
-    });
-  });
-});