Merge branch 'tsconfig-no-implicit-this'

public/app/containers/Explore/utils/debounce.ts

 // Based on underscore.js debounce()
 export default function debounce(func, wait) {
   let timeout;
-  return function() {
+  return function(this: any) {
     const context = this;
     const args = arguments;
     const later = function() {

public/app/containers/Explore/utils/dom.ts

 // Node.closest() polyfill
 if ('Element' in window && !Element.prototype.closest) {
-  Element.prototype.closest = function(s) {
+  Element.prototype.closest = function(this: any, s) {
     const matches = (this.document || this.ownerDocument).querySelectorAll(s);
     let el = this;
     let i;

public/app/core/components/form_dropdown/form_dropdown.ts

 import _ from 'lodash';
 import coreModule from '../../core_module';
 
-function typeaheadMatcher(item) {
+function typeaheadMatcher(this: any, item) {
   let str = this.query;
   if (str === '') {
     return true;

public/app/core/components/query_part/query_part_editor.ts

@@ -33,7 +33,7 @@ export function queryPartEditorDirective($compile, templateSrv) {
 
       $scope.partActions = [];
 
-      function clickFuncParam(paramIndex) {
+      function clickFuncParam(this: any, paramIndex) {
         /*jshint validthis:true */
         const $link = $(this);
         const $input = $link.next();
@@ -53,7 +53,7 @@ export function queryPartEditorDirective($compile, templateSrv) {
         }
       }
 
-      function inputBlur(paramIndex) {
+      function inputBlur(this: any, paramIndex) {
         /*jshint validthis:true */
         const $input = $(this);
         const $link = $input.prev();
@@ -72,14 +72,14 @@ export function queryPartEditorDirective($compile, templateSrv) {
         $link.show();
       }
 
-      function inputKeyPress(paramIndex, e) {
+      function inputKeyPress(this: any, paramIndex, e) {
         /*jshint validthis:true */
         if (e.which === 13) {
           inputBlur.call(this, paramIndex);
         }
       }
 
-      function inputKeyDown() {
+      function inputKeyDown(this: any) {
         /*jshint validthis:true */
         this.style.width = (3 + this.value.length) * 8 + 'px';
       }

public/app/core/directives/tags.ts

@@ -69,7 +69,7 @@ function bootstrapTagsinput() {
             },
       });
 
-      select.on('itemAdded', function(event) {
+      select.on('itemAdded', event => {
         if (scope.model.indexOf(event.item) === -1) {
           scope.model.push(event.item);
           if (scope.onTagsUpdated) {
@@ -79,7 +79,7 @@ function bootstrapTagsinput() {
         const tagElement = select
           .next()
           .children('span')
-          .filter(function() {
+          .filter(() => {
             return $(this).text() === event.item;
           });
         setColor(event.item, tagElement);

public/app/core/jquery_extended.ts

@@ -9,10 +9,10 @@ $.fn.place_tt = (function() {
     offset: 5,
   };
 
-  return function(x, y, opts) {
+  return function(this: any, x, y, opts) {
     opts = $.extend(true, {}, defaults, opts);
 
-    return this.each(function() {
+    return this.each(() => {
       const $tooltip = $(this);
       let width, height;
 

public/app/core/services/ng_react.ts

@@ -204,7 +204,7 @@ const reactComponent = function($injector) {
       attrs.props ? watchProps(attrs.watchDepth, scope, [attrs.props], renderMyComponent) : renderMyComponent();
 
       // cleanup when scope is destroyed
-      scope.$on('$destroy', function() {
+      scope.$on('$destroy', () => {
         if (!attrs.onScopeDestroy) {
           ReactDOM.unmountComponentAtNode(elem[0]);
         } else {
@@ -280,7 +280,7 @@ const reactDirective = function($injector) {
         props.length ? watchProps(attrs.watchDepth, scope, propExpressions, renderMyComponent) : renderMyComponent();
 
         // cleanup when scope is destroyed
-        scope.$on('$destroy', function() {
+        scope.$on('$destroy', () => {
           if (!attrs.onScopeDestroy) {
             ReactDOM.unmountComponentAtNode(elem[0]);
           } else {

public/app/core/services/popover_srv.ts

@@ -3,7 +3,7 @@ import coreModule from 'app/core/core_module';
 import Drop from 'tether-drop';
 
 /** @ngInject **/
-function popoverSrv($compile, $rootScope, $timeout) {
+function popoverSrv(this: any, $compile, $rootScope, $timeout) {
   let openDrop = null;
 
   this.close = function() {

public/app/core/services/segment_srv.ts

@@ -2,10 +2,10 @@ import _ from 'lodash';
 import coreModule from '../core_module';
 
 /** @ngInject */
-export function uiSegmentSrv($sce, templateSrv) {
+export function uiSegmentSrv(this: any, $sce, templateSrv) {
   const self = this;
 
-  function MetricSegment(options) {
+  function MetricSegment(this: any, options) {
     if (options === '*' || options.value === '*') {
       this.value = '*';
       this.html = $sce.trustAsHtml('<i class="fa fa-asterisk"><i>');

public/app/features/dashboard/dashboard_migration.ts

@@ -140,15 +140,12 @@ export class DashboardMigrator {
       }
 
       // ensure query refIds
-      panelUpgrades.push(function(panel) {
-        _.each(
-          panel.targets,
-          function(target) {
-            if (!target.refId) {
-              target.refId = this.dashboard.getNextQueryLetter(panel);
-            }
-          }.bind(this)
-        );
+      panelUpgrades.push(panel => {
+        _.each(panel.targets, target => {
+          if (!target.refId) {
+            target.refId = this.dashboard.getNextQueryLetter(panel);
+          }
+        });
       });
     }
 

public/app/features/dashboard/unsaved_changes_srv.ts

@@ -2,7 +2,7 @@ import angular from 'angular';
 import { ChangeTracker } from './change_tracker';
 
 /** @ngInject */
-export function unsavedChangesSrv($rootScope, $q, $location, $timeout, contextSrv, dashboardSrv, $window) {
+export function unsavedChangesSrv(this: any, $rootScope, $q, $location, $timeout, contextSrv, dashboardSrv, $window) {
   this.init = function(dashboard, scope) {
     this.tracker = new ChangeTracker(dashboard, scope, 1000, $location, $window, $timeout, contextSrv, $rootScope);
     return this.tracker;

public/app/features/templating/specs/variable_srv.test.ts

@@ -3,7 +3,7 @@ import { VariableSrv } from '../variable_srv';
 import moment from 'moment';
 import $q from 'q';
 
-describe('VariableSrv', function() {
+describe('VariableSrv', function(this: any) {
   const ctx = <any>{
     datasourceSrv: {},
     timeSrv: {

public/app/features/templating/specs/variable_srv_init.test.ts

@@ -4,7 +4,7 @@ import _ from 'lodash';
 import { VariableSrv } from '../variable_srv';
 import $q from 'q';
 
-describe('VariableSrv init', function() {
+describe('VariableSrv init', function(this: any) {
   const templateSrv = {
     init: vars => {
       this.variables = vars;

public/app/plugins/datasource/elasticsearch/datasource.ts

@@ -203,7 +203,7 @@ export class ElasticDatasource {
     this.timeSrv.setTime({ from: 'now-1m', to: 'now' }, true);
     // validate that the index exist and has date field
     return this.getFields({ type: 'date' }).then(
-      function(dateFields) {
+      dateFields => {
         const timeField = _.find(dateFields, { text: this.timeField });
         if (!timeField) {
           return {
@@ -212,7 +212,7 @@ export class ElasticDatasource {
           };
         }
         return { status: 'success', message: 'Index OK. Time field name OK.' };
-      }.bind(this),
+      },
       function(err) {
         console.log(err);
         if (err.data && err.data.error) {

public/app/plugins/datasource/elasticsearch/specs/datasource.test.ts

@@ -5,7 +5,7 @@ import { ElasticDatasource } from '../datasource';
 
 import * as dateMath from 'app/core/utils/datemath';
 
-describe('ElasticDatasource', function() {
+describe('ElasticDatasource', function(this: any) {
   const backendSrv = {
     datasourceRequest: jest.fn(),
   };

public/app/plugins/datasource/graphite/add_graphite_func.ts

@@ -90,7 +90,7 @@ export function graphiteAddFunc($compile) {
       };
 
       $(elem)
-        .on('mouseenter', 'ul.dropdown-menu li', function() {
+        .on('mouseenter', 'ul.dropdown-menu li', () => {
           cleanUpDrop();
 
           let funcDef;

public/app/plugins/datasource/graphite/datasource.ts

@@ -4,7 +4,7 @@ import { isVersionGtOrEq, SemVersion } from 'app/core/utils/version';
 import gfunc from './gfunc';
 
 /** @ngInject */
-export function GraphiteDatasource(instanceSettings, $q, backendSrv, templateSrv) {
+export function GraphiteDatasource(this: any, instanceSettings, $q, backendSrv, templateSrv) {
   this.basicAuth = instanceSettings.basicAuth;
   this.url = instanceSettings.url;
   this.name = instanceSettings.name;

public/app/plugins/datasource/graphite/func_editor.ts

@@ -28,7 +28,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
       let paramCountAtLink = 0;
       let cancelBlur = null;
 
-      function clickFuncParam(paramIndex) {
+      function clickFuncParam(this: any, paramIndex) {
         /*jshint validthis:true */
 
         const $link = $(this);
@@ -108,7 +108,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
       }
 
       // this = input element
-      function inputBlur(paramIndex) {
+      function inputBlur(this: any, paramIndex) {
         /*jshint validthis:true */
         const inputElem = this;
         // happens long before the click event on the typeahead options
@@ -118,14 +118,14 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
         }, 200);
       }
 
-      function inputKeyPress(paramIndex, e) {
+      function inputKeyPress(this: any, paramIndex, e) {
         /*jshint validthis:true */
         if (e.which === 13) {
           $(this).blur();
         }
       }
 
-      function inputKeyDown() {
+      function inputKeyDown(this: any) {
         /*jshint validthis:true */
         this.style.width = (3 + this.value.length) * 8 + 'px';
       }

public/app/plugins/datasource/graphite/gfunc.ts

@@ -964,26 +964,23 @@ export class FuncInstance {
   render(metricExp) {
     const str = this.def.name + '(';
 
-    const parameters = _.map(
-      this.params,
-      function(value, index) {
-        let paramType;
-        if (index < this.def.params.length) {
-          paramType = this.def.params[index].type;
-        } else if (_.get(_.last(this.def.params), 'multiple')) {
-          paramType = _.get(_.last(this.def.params), 'type');
-        }
-        // param types that should never be quoted
-        if (_.includes(['value_or_series', 'boolean', 'int', 'float', 'node'], paramType)) {
-          return value;
-        }
-        // param types that might be quoted
-        if (_.includes(['int_or_interval', 'node_or_tag'], paramType) && _.isFinite(+value)) {
-          return _.toString(+value);
-        }
-        return "'" + value + "'";
-      }.bind(this)
-    );
+    const parameters = _.map(this.params, (value, index) => {
+      let paramType;
+      if (index < this.def.params.length) {
+        paramType = this.def.params[index].type;
+      } else if (_.get(_.last(this.def.params), 'multiple')) {
+        paramType = _.get(_.last(this.def.params), 'type');
+      }
+      // param types that should never be quoted
+      if (_.includes(['value_or_series', 'boolean', 'int', 'float', 'node'], paramType)) {
+        return value;
+      }
+      // param types that might be quoted
+      if (_.includes(['int_or_interval', 'node_or_tag'], paramType) && _.isFinite(+value)) {
+        return _.toString(+value);
+      }
+      return "'" + value + "'";
+    });
 
     // don't send any blank parameters to graphite
     while (parameters[parameters.length - 1] === '') {
@@ -1017,12 +1014,9 @@ export class FuncInstance {
     // handle optional parameters
     // if string contains ',' and next param is optional, split and update both
     if (this._hasMultipleParamsInString(strValue, index)) {
-      _.each(
-        strValue.split(','),
-        function(partVal, idx) {
-          this.updateParam(partVal.trim(), index + idx);
-        }.bind(this)
-      );
+      _.each(strValue.split(','), (partVal, idx) => {
+        this.updateParam(partVal.trim(), index + idx);
+      });
       return;
     }
 

public/app/plugins/datasource/graphite/lexer.ts

@@ -922,7 +922,7 @@ for (let i = 0; i < 128; i++) {
 
 const identifierPartTable = identifierStartTable;
 
-export function Lexer(expression) {
+export function Lexer(this: any, expression) {
   this.input = expression;
   this.char = 1;
   this.from = 1;
@@ -1037,7 +1037,7 @@ Lexer.prototype = {
       return /^[0-9a-fA-F]$/.test(str);
     }
 
-    const readUnicodeEscapeSequence = _.bind(function() {
+    const readUnicodeEscapeSequence = _.bind(function(this: any) {
       /*jshint validthis:true */
       index += 1;
 
@@ -1065,7 +1065,7 @@ Lexer.prototype = {
       return null;
     }, this);
 
-    const getIdentifierStart = _.bind(function() {
+    const getIdentifierStart = _.bind(function(this: any) {
       /*jshint validthis:true */
       const chr = this.peek(index);
       const code = chr.charCodeAt(0);
@@ -1096,7 +1096,7 @@ Lexer.prototype = {
       return null;
     }, this);
 
-    const getIdentifierPart = _.bind(function() {
+    const getIdentifierPart = _.bind(function(this: any) {
       /*jshint validthis:true */
       const chr = this.peek(index);
       const code = chr.charCodeAt(0);

public/app/plugins/datasource/graphite/parser.ts

 import { Lexer } from './lexer';
 
-export function Parser(expression) {
+export function Parser(this: any, expression) {
   this.expression = expression;
   this.lexer = new Lexer(expression);
   this.tokens = this.lexer.tokenize();

public/app/plugins/datasource/opentsdb/datasource.ts

@@ -39,15 +39,12 @@ export default class OpenTsDatasource {
     const end = this.convertToTSDBTime(options.rangeRaw.to, true);
     const qs = [];
 
-    _.each(
-      options.targets,
-      function(target) {
-        if (!target.metric) {
-          return;
-        }
-        qs.push(this.convertTargetToQuery(target, options, this.tsdbVersion));
-      }.bind(this)
-    );
+    _.each(options.targets, target => {
+      if (!target.metric) {
+        return;
+      }
+      qs.push(this.convertTargetToQuery(target, options, this.tsdbVersion));
+    });
 
     const queries = _.compact(qs);
 
@@ -75,30 +72,19 @@ export default class OpenTsDatasource {
       return query.hide !== true;
     });
 
-    return this.performTimeSeriesQuery(queries, start, end).then(
-      function(response) {
-        const metricToTargetMapping = this.mapMetricsToTargets(response.data, options, this.tsdbVersion);
-        const result = _.map(
-          response.data,
-          function(metricData, index) {
-            index = metricToTargetMapping[index];
-            if (index === -1) {
-              index = 0;
-            }
-            this._saveTagKeys(metricData);
-
-            return this.transformMetricData(
-              metricData,
-              groupByTags,
-              options.targets[index],
-              options,
-              this.tsdbResolution
-            );
-          }.bind(this)
-        );
-        return { data: result };
-      }.bind(this)
-    );
+    return this.performTimeSeriesQuery(queries, start, end).then(response => {
+      const metricToTargetMapping = this.mapMetricsToTargets(response.data, options, this.tsdbVersion);
+      const result = _.map(response.data, (metricData, index) => {
+        index = metricToTargetMapping[index];
+        if (index === -1) {
+          index = 0;
+        }
+        this._saveTagKeys(metricData);
+
+        return this.transformMetricData(metricData, groupByTags, options.targets[index], options, this.tsdbResolution);
+      });
+      return { data: result };
+    });
   }
 
   annotationQuery(options) {

public/app/plugins/panel/graph/graph_tooltip.ts

 import $ from 'jquery';
 import { appEvents } from 'app/core/core';
 
-export default function GraphTooltip(elem, dashboard, scope, getSeriesFn) {
+export default function GraphTooltip(this: any, elem, dashboard, scope, getSeriesFn) {
   const self = this;
   const ctrl = scope.ctrl;
   const panel = ctrl.panel;

public/app/plugins/panel/graph/jquery.flot.events.ts

@@ -420,7 +420,7 @@ export class EventMarkers {
         event: event,
       });
 
-      const mouseenter = function() {
+      const mouseenter = function(this: any) {
         createAnnotationToolip(marker, $(this).data('event'), that._plot);
       };
 
@@ -541,7 +541,7 @@ export class EventMarkers {
       event: event,
     });
 
-    const mouseenter = function() {
+    const mouseenter = function(this: any) {
       createAnnotationToolip(region, $(this).data('event'), that._plot);
     };
 
@@ -596,7 +596,7 @@ export class EventMarkers {
  */
 
 /** @ngInject */
-export function init(plot) {
+export function init(this: any, plot) {
   /*jshint validthis:true */
   const that = this;
   const eventMarkers = new EventMarkers(plot);

public/app/stores/TeamsStore/TeamsStore.ts

@@ -31,7 +31,7 @@ export const TeamModel = types
     groups: types.optional(types.map(TeamGroupModel), {}),
   })
   .views(self => ({
-    get filteredMembers() {
+    get filteredMembers(this: Team) {
       const members = this.members.values();
       const regex = new RegExp(self.search, 'i');
       return members.filter(member => {
@@ -121,7 +121,7 @@ export const TeamsStore = types
     search: types.optional(types.string, ''),
   })
   .views(self => ({
-    get filteredTeams() {
+    get filteredTeams(this: any) {
       const teams = this.map.values();
       const regex = new RegExp(self.search, 'i');
       return teams.filter(team => {

public/test/specs/helpers.ts

@@ -4,7 +4,7 @@ import * as dateMath from 'app/core/utils/datemath';
 import { angularMocks, sinon } from '../lib/common';
 import { PanelModel } from 'app/features/dashboard/panel_model';
 
-export function ControllerTestContext() {
+export function ControllerTestContext(this: any) {
   const self = this;
 
   this.datasource = {};
@@ -106,7 +106,7 @@ export function ControllerTestContext() {
   };
 }
 
-export function ServiceTestContext() {
+export function ServiceTestContext(this: any) {
   const self = this;
   self.templateSrv = new TemplateSrvStub();
   self.timeSrv = new TimeSrvStub();
@@ -138,11 +138,11 @@ export function ServiceTestContext() {
   };
 }
 
-export function DashboardViewStateStub() {
+export function DashboardViewStateStub(this: any) {
   this.registerPanel = function() {};
 }
 
-export function TimeSrvStub() {
+export function TimeSrvStub(this: any) {
   this.init = sinon.spy();
   this.time = { from: 'now-1h', to: 'now' };
   this.timeRange = function(parse) {
@@ -164,13 +164,13 @@ export function TimeSrvStub() {
   };
 }
 
-export function ContextSrvStub() {
+export function ContextSrvStub(this: any) {
   this.hasRole = function() {
     return true;
   };
 }
 
-export function TemplateSrvStub() {
+export function TemplateSrvStub(this: any) {
   this.variables = [];
   this.templateSettings = { interpolate: /\[\[([\s\S]+?)\]\]/g };
   this.data = {};

tsconfig.json

@@ -20,7 +20,7 @@
     "emitDecoratorMetadata": false,
     "experimentalDecorators": true,
     "noImplicitReturns": true,
-    "noImplicitThis": false,
+    "noImplicitThis": true,
     "noImplicitUseStrict": false,
     "noImplicitAny": false,
     "noUnusedLocals": true,