[Tech]: Start migrating to Jest for tests (#9610)

* tech: investigating karma + jest mix

* tech: migrating tests to jest

* tech: moved anoter test file to jest

* test: migrated two more test files to jest

* test: updated readme and made test fail to verify that it causes CI build failure

* tech: added code coverage for jest tests

* tech: testing codecov coverage

* tech: migrated more tests

* tech: migrated template srv to typescript and the tests to jest

* tech: minor build fix

* tech: build fixes

* build: another attempt at fixing go test with coverage

public/app/features/templating/specs/adhoc_variable.jest.ts

@@ -1,5 +1,3 @@
-import {describe, it, expect} from 'test/lib/common';
-
 import {AdhocVariable} from '../adhoc_variable';
 
 describe('AdhocVariable', function() {
@@ -15,7 +13,7 @@ describe('AdhocVariable', function() {
         ]
       });
       var urlValue = variable.getValueForUrl();
-      expect(urlValue).to.eql(["key1|=|value1", "key2|!=|value2", "key3|=|value3a__gfp__value3b__gfp__value3c"]);
+      expect(urlValue).toMatchObject(["key1|=|value1", "key2|!=|value2", "key3|=|value3a__gfp__value3b__gfp__value3c"]);
     });
 
   });
@@ -26,17 +24,17 @@ describe('AdhocVariable', function() {
       var variable = new AdhocVariable({});
       variable.setValueFromUrl(["key1|=|value1", "key2|!=|value2", "key3|=|value3a__gfp__value3b__gfp__value3c"]);
 
-      expect(variable.filters[0].key).to.be('key1');
-      expect(variable.filters[0].operator).to.be('=');
-      expect(variable.filters[0].value).to.be('value1');
+      expect(variable.filters[0].key).toBe('key1');
+      expect(variable.filters[0].operator).toBe('=');
+      expect(variable.filters[0].value).toBe('value1');
 
-      expect(variable.filters[1].key).to.be('key2');
-      expect(variable.filters[1].operator).to.be('!=');
-      expect(variable.filters[1].value).to.be('value2');
+      expect(variable.filters[1].key).toBe('key2');
+      expect(variable.filters[1].operator).toBe('!=');
+      expect(variable.filters[1].value).toBe('value2');
 
-      expect(variable.filters[2].key).to.be('key3');
-      expect(variable.filters[2].operator).to.be('=');
-      expect(variable.filters[2].value).to.be('value3a|value3b|value3c');
+      expect(variable.filters[2].key).toBe('key3');
+      expect(variable.filters[2].operator).toBe('=');
+      expect(variable.filters[2].value).toBe('value3a|value3b|value3c');
     });
 
   });

public/app/features/templating/specs/query_variable.jest.ts

@@ -1,5 +1,3 @@
-import {describe, it, expect} from 'test/lib/common';
-
 import {QueryVariable} from '../query_variable';
 
 describe('QueryVariable', () => {
@@ -8,14 +6,14 @@ describe('QueryVariable', () => {
 
     it('should set defaults', () => {
       var variable = new QueryVariable({}, null, null, null, null);
-      expect(variable.datasource).to.be(null);
-      expect(variable.refresh).to.be(0);
-      expect(variable.sort).to.be(0);
-      expect(variable.name).to.be('');
-      expect(variable.hide).to.be(0);
-      expect(variable.options.length).to.be(0);
-      expect(variable.multi).to.be(false);
-      expect(variable.includeAll).to.be(false);
+      expect(variable.datasource).toBe(null);
+      expect(variable.refresh).toBe(0);
+      expect(variable.sort).toBe(0);
+      expect(variable.name).toBe('');
+      expect(variable.hide).toBe(0);
+      expect(variable.options.length).toBe(0);
+      expect(variable.multi).toBe(false);
+      expect(variable.includeAll).toBe(false);
     });
 
     it('get model should copy changes back to model', () => {
@@ -26,11 +24,11 @@ describe('QueryVariable', () => {
       variable.sort = 50;
 
       var model = variable.getSaveModel();
-      expect(model.options.length).to.be(1);
-      expect(model.options[0].text).to.be('test');
-      expect(model.datasource).to.be('google');
-      expect(model.regex).to.be('asd');
-      expect(model.sort).to.be(50);
+      expect(model.options.length).toBe(1);
+      expect(model.options[0].text).toBe('test');
+      expect(model.datasource).toBe('google');
+      expect(model.regex).toBe('asd');
+      expect(model.sort).toBe(50);
     });
 
     it('if refresh != 0 then remove options in presisted mode', () => {
@@ -39,7 +37,7 @@ describe('QueryVariable', () => {
       variable.refresh = 1;
 
       var model = variable.getSaveModel();
-      expect(model.options.length).to.be(0);
+      expect(model.options.length).toBe(0);
     });
   });
 
@@ -67,14 +65,14 @@ describe('QueryVariable', () => {
       it('should return in same order', () => {
         var i = 0;
 
-        expect(result.length).to.be(11);
-        expect(result[i++].text).to.be('');
-        expect(result[i++].text).to.be('0');
-        expect(result[i++].text).to.be('1');
-        expect(result[i++].text).to.be('3');
-        expect(result[i++].text).to.be('4');
-        expect(result[i++].text).to.be('5');
-        expect(result[i++].text).to.be('6');
+        expect(result.length).toBe(11);
+        expect(result[i++].text).toBe('');
+        expect(result[i++].text).toBe('0');
+        expect(result[i++].text).toBe('1');
+        expect(result[i++].text).toBe('3');
+        expect(result[i++].text).toBe('4');
+        expect(result[i++].text).toBe('5');
+        expect(result[i++].text).toBe('6');
       });
     });
   });

public/app/features/templating/specs/template_srv.jest.ts

@@ -1,28 +1,11 @@
-import {describe, beforeEach, it, expect, angularMocks} from 'test/lib/common';
-
-import '../all';
-import {Emitter} from 'app/core/core';
+import { TemplateSrv } from '../template_srv';
 
 describe('templateSrv', function() {
-  var _templateSrv, _variableSrv;
-
-  beforeEach(angularMocks.module('grafana.core'));
-  beforeEach(angularMocks.module('grafana.services'));
-  beforeEach(angularMocks.module($provide => {
-    $provide.value('timeSrv', {});
-    $provide.value('datasourceSrv', {});
-  }));
-
-  beforeEach(angularMocks.inject(function(variableSrv, templateSrv) {
-    _templateSrv = templateSrv;
-    _variableSrv = variableSrv;
-  }));
+  var _templateSrv;
 
   function initTemplateSrv(variables) {
-    _variableSrv.init({
-      templating: {list: variables},
-      events: new Emitter(),
-    });
+    _templateSrv = new TemplateSrv();
+    _templateSrv.init(variables);
   }
 
   describe('init', function() {
@@ -32,7 +15,7 @@ describe('templateSrv', function() {
 
     it('should initialize template data', function() {
       var target = _templateSrv.replace('this.[[test]].filters');
-      expect(target).to.be('this.oogle.filters');
+      expect(target).toBe('this.oogle.filters');
     });
   });
 
@@ -43,12 +26,12 @@ describe('templateSrv', function() {
 
     it('should replace $test with scoped value', function() {
       var target = _templateSrv.replace('this.$test.filters', {'test': {value: 'mupp', text: 'asd'}});
-      expect(target).to.be('this.mupp.filters');
+      expect(target).toBe('this.mupp.filters');
     });
 
     it('should replace $test with scoped text', function() {
       var target = _templateSrv.replaceWithText('this.$test.filters', {'test': {value: 'mupp', text: 'asd'}});
-      expect(target).to.be('this.asd.filters');
+      expect(target).toBe('this.asd.filters');
     });
   });
 
@@ -63,17 +46,17 @@ describe('templateSrv', function() {
 
     it('should return filters if datasourceName match', function() {
       var filters = _templateSrv.getAdhocFilters('oogle');
-      expect(filters).to.eql([1]);
+      expect(filters).toMatchObject([1]);
     });
 
     it('should return empty array if datasourceName does not match', function() {
       var filters = _templateSrv.getAdhocFilters('oogleasdasd');
-      expect(filters).to.eql([]);
+      expect(filters).toMatchObject([]);
     });
 
     it('should return filters when datasourceName match via data source variable', function() {
       var filters = _templateSrv.getAdhocFilters('logstash');
-      expect(filters).to.eql([2]);
+      expect(filters).toMatchObject([2]);
     });
   });
 
@@ -84,17 +67,17 @@ describe('templateSrv', function() {
 
     it('should replace $test with globbed value', function() {
       var target = _templateSrv.replace('this.$test.filters', {}, 'glob');
-      expect(target).to.be('this.{value1,value2}.filters');
+      expect(target).toBe('this.{value1,value2}.filters');
     });
 
     it('should replace $test with piped value', function() {
       var target = _templateSrv.replace('this=$test', {}, 'pipe');
-      expect(target).to.be('this=value1|value2');
+      expect(target).toBe('this=value1|value2');
     });
 
     it('should replace $test with piped value', function() {
       var target = _templateSrv.replace('this=$test', {}, 'pipe');
-      expect(target).to.be('this=value1|value2');
+      expect(target).toBe('this=value1|value2');
     });
   });
 
@@ -112,7 +95,7 @@ describe('templateSrv', function() {
 
     it('should replace $test with formatted all value', function() {
       var target = _templateSrv.replace('this.$test.filters', {}, 'glob');
-      expect(target).to.be('this.{value1,value2}.filters');
+      expect(target).toBe('this.{value1,value2}.filters');
     });
   });
 
@@ -131,12 +114,12 @@ describe('templateSrv', function() {
 
     it('should replace $test with formatted all value', function() {
       var target = _templateSrv.replace('this.$test.filters', {}, 'glob');
-      expect(target).to.be('this.*.filters');
+      expect(target).toBe('this.*.filters');
     });
 
     it('should not escape custom all value', function() {
       var target = _templateSrv.replace('this.$test', {}, 'regex');
-      expect(target).to.be('this.*');
+      expect(target).toBe('this.*');
     });
   });
 
@@ -144,49 +127,49 @@ describe('templateSrv', function() {
     it('should properly escape $test with lucene escape sequences', function() {
       initTemplateSrv([{type: 'query', name: 'test', current: {value: 'value/4' }}]);
       var target = _templateSrv.replace('this:$test', {}, 'lucene');
-      expect(target).to.be("this:value\\\/4");
+      expect(target).toBe("this:value\\\/4");
     });
   });
 
   describe('format variable to string values', function() {
     it('single value should return value', function() {
       var result = _templateSrv.formatValue('test');
-      expect(result).to.be('test');
+      expect(result).toBe('test');
     });
 
     it('multi value and glob format should render glob string', function() {
       var result = _templateSrv.formatValue(['test','test2'], 'glob');
-      expect(result).to.be('{test,test2}');
+      expect(result).toBe('{test,test2}');
     });
 
     it('multi value and lucene should render as lucene expr', function() {
       var result = _templateSrv.formatValue(['test','test2'], 'lucene');
-      expect(result).to.be('("test" OR "test2")');
+      expect(result).toBe('("test" OR "test2")');
     });
 
     it('multi value and regex format should render regex string', function() {
       var result = _templateSrv.formatValue(['test.','test2'], 'regex');
-      expect(result).to.be('(test\\.|test2)');
+      expect(result).toBe('(test\\.|test2)');
     });
 
     it('multi value and pipe should render pipe string', function() {
       var result = _templateSrv.formatValue(['test','test2'], 'pipe');
-      expect(result).to.be('test|test2');
+      expect(result).toBe('test|test2');
     });
 
     it('multi value and distributed should render distributed string', function() {
       var result = _templateSrv.formatValue(['test','test2'], 'distributed', { name: 'build' });
-      expect(result).to.be('test,build=test2');
+      expect(result).toBe('test,build=test2');
     });
 
     it('multi value and distributed should render when not string', function() {
       var result = _templateSrv.formatValue(['test'], 'distributed', { name: 'build' });
-      expect(result).to.be('test');
+      expect(result).toBe('test');
     });
 
     it('slash should be properly escaped in regex format', function() {
       var result = _templateSrv.formatValue('Gi3/14', 'regex');
-      expect(result).to.be('Gi3\\/14');
+      expect(result).toBe('Gi3\\/14');
     });
 
   });
@@ -198,7 +181,7 @@ describe('templateSrv', function() {
 
     it('should return true if exists', function() {
       var result = _templateSrv.variableExists('$test');
-      expect(result).to.be(true);
+      expect(result).toBe(true);
     });
   });
 
@@ -209,17 +192,17 @@ describe('templateSrv', function() {
 
     it('should insert html', function() {
       var result = _templateSrv.highlightVariablesAsHtml('$test');
-      expect(result).to.be('<span class="template-variable">$test</span>');
+      expect(result).toBe('<span class="template-variable">$test</span>');
     });
 
     it('should insert html anywhere in string', function() {
       var result = _templateSrv.highlightVariablesAsHtml('this $test ok');
-      expect(result).to.be('this <span class="template-variable">$test</span> ok');
+      expect(result).toBe('this <span class="template-variable">$test</span> ok');
     });
 
     it('should ignore if variables does not exist', function() {
       var result = _templateSrv.highlightVariablesAsHtml('this $google ok');
-      expect(result).to.be('this $google ok');
+      expect(result).toBe('this $google ok');
     });
   });
 
@@ -230,19 +213,28 @@ describe('templateSrv', function() {
 
     it('should set current value and update template data', function() {
       var target = _templateSrv.replace('this.[[test]].filters');
-      expect(target).to.be('this.muuuu.filters');
+      expect(target).toBe('this.muuuu.filters');
     });
   });
 
   describe('fillVariableValuesForUrl with multi value', function() {
     beforeEach(function() {
-      initTemplateSrv([{type: 'query', name: 'test', current: { value: ['val1', 'val2'] }}]);
+      initTemplateSrv([
+        {
+          type: 'query',
+          name: 'test',
+          current: { value: ['val1', 'val2'] },
+          getValueForUrl: function() {
+            return this.current.value;
+          }
+        }
+      ]);
     });
 
     it('should set multiple url params', function() {
       var params = {};
       _templateSrv.fillVariableValuesForUrl(params);
-      expect(params['var-test']).to.eql(['val1', 'val2']);
+      expect(params['var-test']).toMatchObject(['val1', 'val2']);
     });
   });
 
@@ -254,7 +246,7 @@ describe('templateSrv', function() {
     it('should set scoped value as url params', function() {
       var params = {};
       _templateSrv.fillVariableValuesForUrl(params, {'test': {value: 'val1'}});
-      expect(params['var-test']).to.eql('val1');
+      expect(params['var-test']).toBe('val1');
     });
   });
 
@@ -270,7 +262,7 @@ describe('templateSrv', function() {
 
     it('should replace with text except for grafanaVariables', function() {
       var target = _templateSrv.replaceWithText('Server: $server, period: $period');
-      expect(target).to.be('Server: All, period: 13m');
+      expect(target).toBe('Server: All, period: 13m');
     });
   });
 
@@ -281,7 +273,7 @@ describe('templateSrv', function() {
 
     it('should replace $__interval_ms with interval milliseconds', function() {
       var target = _templateSrv.replace('10 * $__interval_ms', {"__interval_ms": {text: "100", value: "100"}});
-      expect(target).to.be('10 * 100');
+      expect(target).toBe('10 * 100');
     });
 
   });