Chore: Upgrades jQuery and @types/jQuery (#25651)

* Chore: upgrades jQuery and @types/jQuery

* Chore: reduce strict null errors

* Fixed issue in graphite func editor

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>

package.json

@@ -84,7 +84,7 @@
     "@types/hoist-non-react-statics": "3.3.0",
     "@types/is-hotkey": "0.1.1",
     "@types/jest": "26.0.0",
-    "@types/jquery": "3.3.32",
+    "@types/jquery": "3.3.38",
     "@types/lodash": "4.14.149",
     "@types/lru-cache": "^5.1.0",
     "@types/marked": "0.6.5",
@@ -232,7 +232,7 @@
     "hoist-non-react-statics": "3.3.0",
     "immutable": "3.8.2",
     "is-hotkey": "0.1.6",
-    "jquery": "3.4.1",
+    "jquery": "3.5.1",
     "jsurl": "^0.1.5",
     "lodash": "4.17.15",
     "lru-cache": "^5.1.1",

packages/grafana-data/package.json

@@ -37,7 +37,7 @@
     "@rollup/plugin-node-resolve": "7.1.1",
     "@types/braintree__sanitize-url": "4.0.0",
     "@types/jest": "23.3.14",
-    "@types/jquery": "1.10.35",
+    "@types/jquery": "3.3.38",
     "@types/lodash": "4.14.123",
     "@types/node": "10.14.1",
     "@types/papaparse": "4.5.9",

packages/grafana-ui/package.json

@@ -45,7 +45,7 @@
     "d3": "5.15.0",
     "emotion": "10.0.27",
     "immutable": "3.8.2",
-    "jquery": "3.4.1",
+    "jquery": "3.5.1",
     "lodash": "4.17.15",
     "moment": "2.24.0",
     "papaparse": "4.6.3",
@@ -83,7 +83,7 @@
     "@types/common-tags": "^1.8.0",
     "@types/d3": "5.7.2",
     "@types/jest": "23.3.14",
-    "@types/jquery": "1.10.35",
+    "@types/jquery": "3.3.38",
     "@types/lodash": "4.14.123",
     "@types/node": "10.14.1",
     "@types/papaparse": "4.5.9",

public/app/core/reducers/root.test.ts

@@ -1,6 +1,5 @@
 import { createRootReducer, recursiveCleanState } from './root';
 import { describe, expect } from '../../../test/lib/common';
-import { NavModelItem } from '@grafana/data';
 import { reducerTester } from '../../../test/core/redux/reducerTester';
 import { StoreState } from '../../types/store';
 import { Team } from '../../types';
@@ -8,10 +7,10 @@ import { cleanUpAction } from '../actions/cleanUp';
 import { initialTeamsState, teamsLoaded } from '../../features/teams/state/reducers';
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   config: {
     bootData: {
-      navTree: [] as NavModelItem[],
+      navTree: [],
       user: {},
     },
   },

public/app/features/dashboard/components/DashExportModal/DashboardExporter.test.ts

@@ -8,6 +8,10 @@ import { createConstantVariableAdapter } from '../../../variables/constant/adapt
 import { createQueryVariableAdapter } from '../../../variables/query/adapter';
 import { createDataSourceVariableAdapter } from '../../../variables/datasource/adapter';
 
+function getStub(arg: string) {
+  return Promise.resolve(stubs[arg || 'gfdb']);
+}
+
 jest.mock('app/core/store', () => {
   return {
     getBool: jest.fn(),
@@ -16,7 +20,7 @@ jest.mock('app/core/store', () => {
 });
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getDataSourceSrv: () => ({
     get: jest.fn(arg => getStub(arg)),
   }),
@@ -269,7 +273,3 @@ stubs['-- Grafana --'] = {
     builtIn: true,
   },
 };
-
-function getStub(arg: string) {
-  return Promise.resolve(stubs[arg || 'gfdb']);
-}

public/app/features/explore/state/actions.test.ts

@@ -1,28 +1,28 @@
 import { PayloadAction } from '@reduxjs/toolkit';
-import { DataQuery, DefaultTimeZone, ExploreMode, LogsDedupStrategy, RawTimeRange, toUtc } from '@grafana/data';
+import { DataQuery, DefaultTimeZone, ExploreMode, LogsDedupStrategy, toUtc } from '@grafana/data';
 
 import * as Actions from './actions';
 import {
+  cancelQueries,
   changeDatasource,
+  changeMode,
   loadDatasource,
   navigateToExplore,
   refreshExplore,
-  cancelQueries,
-  changeMode,
 } from './actions';
 import { ExploreId, ExploreUpdateState, ExploreUrlState } from 'app/types';
 import { thunkTester } from 'test/core/thunk/thunkTester';
 import {
+  cancelQueriesAction,
+  changeModeAction,
   initializeExploreAction,
   InitializeExplorePayload,
   loadDatasourcePendingAction,
   loadDatasourceReadyAction,
+  scanStopAction,
   setQueriesAction,
   updateDatasourceInstanceAction,
   updateUIStateAction,
-  cancelQueriesAction,
-  scanStopAction,
-  changeModeAction,
 } from './actionTypes';
 import { Emitter } from 'app/core/core';
 import { makeInitialUpdateState } from './reducers';
@@ -65,8 +65,8 @@ const testRange = {
   },
 };
 jest.mock('app/core/utils/explore', () => ({
-  ...jest.requireActual('app/core/utils/explore'),
+  ...((jest.requireActual('app/core/utils/explore') as unknown) as object),
-  getTimeRangeFromUrl: (range: RawTimeRange) => testRange,
+  getTimeRangeFromUrl: (range: any) => testRange,
 }));
 
 const setup = (updateOverides?: Partial<ExploreUpdateState>) => {

public/app/features/explore/utils/ResultProcessor.test.ts

@@ -98,7 +98,7 @@ describe('ResultProcessor', () => {
         const valueField = dataFrames[0].fields[1];
         const theResult = resultProcessor.getGraphResult();
 
-        expect(theResult[0]).toEqual({
+        expect(theResult![0]).toEqual({
           label: 'A-series',
           color: '#7EB26D',
           data: [

public/app/features/explore/utils/links.test.ts

@@ -51,7 +51,11 @@ describe('getFieldLinksForExplore', () => {
       '/explore?left={"range":{"from":"now-1h","to":"now"},"datasource":"test_ds","queries":[{"query":"query_1"}],"mode":"Metrics","ui":{"showingGraph":true,"showingTable":true,"showingLogs":true}}'
     );
     expect(links[0].title).toBe('test_ds');
-    links[0].onClick({});
+
+    if (links[0].onClick) {
+      links[0].onClick({});
+    }
+
     expect(splitfn).toBeCalledWith({ datasourceUid: 'uid_1', query: 'query_1' });
   });
 });

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

@@ -14,7 +14,7 @@ describe('datasource', () => {
           },
         ],
       } as any)) as any;
-      expect(response.error.message).toBe('Log group is required');
+      expect(response.error?.message).toBe('Log group is required');
     });
 
     it('should return empty response if queries are hidden', async () => {

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

@@ -18,7 +18,7 @@ jest.mock('rxjs/operators', () => {
 });
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

public/app/plugins/datasource/elasticsearch/configuration/DataLinks.test.tsx

@@ -18,9 +18,12 @@ describe('DataLinks', () => {
 
   it('renders correctly when no fields', async () => {
     let wrapper: any;
-    await act(async () => {
+    await act(
-      wrapper = await mount(<DataLinks onChange={() => {}} />);
+      // @ts-ignore we shouldn't use Promises in act => the "void | undefined" is here to forbid any sneaky "Promise" returns.
-    });
+      async () => {
+        wrapper = await mount(<DataLinks onChange={() => {}} />);
+      }
+    );
     expect(wrapper.find(Button).length).toBe(1);
     expect(wrapper.find(Button).contains('Add')).toBeTruthy();
     expect(wrapper.find(DataLink).length).toBe(0);
@@ -28,9 +31,12 @@ describe('DataLinks', () => {
 
   it('renders correctly when there are fields', async () => {
     let wrapper: any;
-    await act(async () => {
+    await act(
-      wrapper = await mount(<DataLinks value={testValue} onChange={() => {}} />);
+      // @ts-ignore we shouldn't use Promises in act => the "void | undefined" is here to forbid any sneaky "Promise" returns.
-    });
+      async () => {
+        wrapper = await mount(<DataLinks value={testValue} onChange={() => {}} />);
+      }
+    );
 
     expect(wrapper.find(Button).filterWhere((button: any) => button.contains('Add')).length).toBe(1);
     expect(wrapper.find(DataLink).length).toBe(2);
@@ -39,9 +45,12 @@ describe('DataLinks', () => {
   it('adds new field', async () => {
     const onChangeMock = jest.fn();
     let wrapper: any;
-    await act(async () => {
+    await act(
-      wrapper = await mount(<DataLinks onChange={onChangeMock} />);
+      // @ts-ignore we shouldn't use Promises in act => the "void | undefined" is here to forbid any sneaky "Promise" returns.
-    });
+      async () => {
+        wrapper = await mount(<DataLinks onChange={onChangeMock} />);
+      }
+    );
     const addButton = wrapper.find(Button).filterWhere((button: any) => button.contains('Add'));
     addButton.simulate('click');
     expect(onChangeMock.mock.calls[0][0].length).toBe(1);
@@ -50,9 +59,12 @@ describe('DataLinks', () => {
   it('removes field', async () => {
     const onChangeMock = jest.fn();
     let wrapper: any;
-    await act(async () => {
+    await act(
-      wrapper = await mount(<DataLinks value={testValue} onChange={onChangeMock} />);
+      // @ts-ignore we shouldn't use Promises in act => the "void | undefined" is here to forbid any sneaky "Promise" returns.
-    });
+      async () => {
+        wrapper = await mount(<DataLinks value={testValue} onChange={onChangeMock} />);
+      }
+    );
     const removeButton = wrapper
       .find(DataLink)
       .at(0)

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

@@ -1,18 +1,16 @@
 import angular from 'angular';
-import { CoreApp, DataQueryRequest, dateMath, Field } from '@grafana/data';
+import { CoreApp, DataQueryRequest, DataSourceInstanceSettings, dateMath, dateTime, Field, toUtc } from '@grafana/data';
 import _ from 'lodash';
 import { ElasticDatasource } from './datasource';
-import { toUtc, dateTime } from '@grafana/data';
 import { backendSrv } from 'app/core/services/backend_srv'; // will use the version in __mocks__
 import { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
 import { TemplateSrv } from 'app/features/templating/template_srv';
-import { DataSourceInstanceSettings } from '@grafana/data';
 import { ElasticsearchOptions, ElasticsearchQuery } from './types';
 
 const ELASTICSEARCH_MOCK_URL = 'http://elasticsearch.local';
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

public/app/plugins/datasource/grafana-azure-monitor-datasource/app_insights/app_insights_datasource.test.ts

@@ -1,12 +1,12 @@
 import Datasource from '../datasource';
-import { DataFrame, toUtc, getFrameDisplayName } from '@grafana/data';
+import { DataFrame, getFrameDisplayName, toUtc } from '@grafana/data';
 import { TemplateSrv } from 'app/features/templating/template_srv';
 import { backendSrv } from 'app/core/services/backend_srv'; // will use the version in __mocks__
 
 const templateSrv = new TemplateSrv();
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
   getTemplateSrv: () => templateSrv,
 }));

public/app/plugins/datasource/grafana-azure-monitor-datasource/azure_log_analytics/azure_log_analytics_datasource.test.ts

@@ -1,14 +1,14 @@
 import AzureMonitorDatasource from '../datasource';
 import FakeSchemaData from './__mocks__/schema';
 import { TemplateSrv } from 'app/features/templating/template_srv';
-import { KustoSchema, AzureLogsVariable } from '../types';
+import { AzureLogsVariable, KustoSchema } from '../types';
 import { toUtc } from '@grafana/data';
 import { backendSrv } from 'app/core/services/backend_srv'; // will use the version in __mocks__
 
 const templateSrv = new TemplateSrv();
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
   getTemplateSrv: () => templateSrv,
 }));

public/app/plugins/datasource/grafana-azure-monitor-datasource/azure_monitor/azure_monitor_datasource.test.ts

@@ -8,7 +8,7 @@ import { AzureDataSourceJsonData } from '../types';
 const templateSrv = new TemplateSrv();
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
   getTemplateSrv: () => templateSrv,
 }));

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

@@ -4,7 +4,7 @@ import { backendSrv } from 'app/core/services/backend_srv'; // will use the vers
 import { GrafanaDatasource } from '../datasource';
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

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

@@ -10,8 +10,9 @@ export function graphiteFuncEditor($compile: any, templateSrv: TemplateSrv) {
       func="func"
       onRemove="ctrl.handleRemoveFunction"
       onMoveLeft="ctrl.handleMoveLeft"
-      onMoveRight="ctrl.handleMoveRight"
+      onMoveRight="ctrl.handleMoveRight">
-    /><span>(</span>
+    </function-editor>
+    <span>(</span>
   `;
   const paramTemplate =
     '<input type="text" style="display:none"' + ' class="input-small tight-form-func-param"></input>';

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

@@ -6,7 +6,7 @@ import { dateTime, getFrameDisplayName } from '@grafana/data';
 import { backendSrv } from 'app/core/services/backend_srv'; // will use the version in __mocks__
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

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

@@ -88,7 +88,7 @@ describe('when rendering func instance', () => {
   it('should handle function with no metric param', () => {
     const func = gfunc.createFuncInstance('randomWalk');
     func.params[0] = 'test';
-    expect(func.render(undefined, replaceVariablesDummy)).toEqual("randomWalk('test')");
+    expect(func.render((undefined as unknown) as string, replaceVariablesDummy)).toEqual("randomWalk('test')");
   });
 
   it('should handle function multiple series params', () => {

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

@@ -7,7 +7,7 @@ import { backendSrv } from 'app/core/services/backend_srv'; // will use the vers
 const templateSrv = new TemplateSrvStub();
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
   getTemplateSrv: () => templateSrv,
 }));

public/app/plugins/datasource/loki/datasource.test.ts

@@ -19,7 +19,7 @@ import { CustomVariableModel } from '../../../features/variables/types';
 import { initialCustomVariableModelState } from '../../../features/variables/custom/reducer'; // will use the version in __mocks__
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

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

@@ -7,7 +7,7 @@ import { backendSrv } from 'app/core/services/backend_srv';
 import { initialCustomVariableModelState } from '../../../../features/variables/custom/reducer'; // will use the version in __mocks__
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

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

@@ -5,7 +5,7 @@ import { TemplateSrv } from 'app/features/templating/template_srv';
 import { initialCustomVariableModelState } from '../../../../features/variables/custom/reducer';
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

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

@@ -2,7 +2,7 @@ import OpenTsDatasource from '../datasource';
 import { backendSrv } from 'app/core/services/backend_srv'; // will use the version in __mocks__
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

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

@@ -5,7 +5,7 @@ import { TemplateSrv } from 'app/features/templating/template_srv';
 import { initialCustomVariableModelState } from '../../../../features/variables/custom/reducer';
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

public/app/plugins/datasource/prometheus/metric_find_query.test.ts

@@ -1,6 +1,6 @@
 import { PrometheusDatasource } from './datasource';
 import PrometheusMetricFindQuery from './metric_find_query';
-import { toUtc, DataSourceInstanceSettings } from '@grafana/data';
+import { DataSourceInstanceSettings, toUtc } from '@grafana/data';
 import { backendSrv } from 'app/core/services/backend_srv'; // will use the version in __mocks__
 import { PromOptions } from './types';
 
@@ -12,7 +12,7 @@ jest.mock('app/features/templating/template_srv', () => {
 });
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

public/app/plugins/datasource/stackdriver/api.test.ts

@@ -3,7 +3,7 @@ import { backendSrv } from 'app/core/services/backend_srv'; // will use the vers
 import { SelectableValue } from '@grafana/data';
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

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

@@ -9,7 +9,7 @@ import { CustomVariableModel } from '../../../../features/variables/types';
 import { initialCustomVariableModelState } from '../../../../features/variables/custom/reducer';
 
 jest.mock('@grafana/runtime', () => ({
-  ...jest.requireActual('@grafana/runtime'),
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
   getBackendSrv: () => backendSrv,
 }));
 

yarn.lock

@@ -6085,15 +6085,10 @@
     jest-diff "^25.2.1"
     pretty-format "^25.2.1"
 
-"@types/jquery@1.10.35":
+"@types/jquery@3.3.38":
-  version "1.10.35"
+  version "3.3.38"
-  resolved "https://registry.yarnpkg.com/@types/jquery/-/jquery-1.10.35.tgz#4e5c2b1e5b3bf0b863efb8c5e70081f52e6c9518"
+  resolved "https://registry.yarnpkg.com/@types/jquery/-/jquery-3.3.38.tgz#6385f1e1b30bd2bff55ae8ee75ea42a999cc3608"
-  integrity sha512-SVtqEcudm7yjkTwoRA1gC6CNMhGDdMx4Pg8BPdiqI7bXXdCn1BPmtxgeWYQOgDxrq53/5YTlhq5ULxBEAlWIBg==
+  integrity sha512-nkDvmx7x/6kDM5guu/YpXkGZ/Xj/IwGiLDdKM99YA5Vag7pjGyTJ8BNUh/6hxEn/sEu5DKtyRgnONJ7EmOoKrA==
-
-"@types/jquery@3.3.32":
-  version "3.3.32"
-  resolved "https://registry.yarnpkg.com/@types/jquery/-/jquery-3.3.32.tgz#93e27fdc45dd38ee07f2f0acf34b59c1ccee036f"
-  integrity sha512-UKoof2mnV/X1/Ix2g+V2Ny5sgHjV8nK/UJbiYxuo4zPwzGyFlZ/mp4KaePb2VqQrqJctmcDQNA57buU84/2uIw==
   dependencies:
     "@types/sizzle" "*"
 
@@ -16699,6 +16694,11 @@ jquery@3.4.1:
   resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.4.1.tgz#714f1f8d9dde4bdfa55764ba37ef214630d80ef2"
   integrity sha512-36+AdBzCL+y6qjw5Tx7HgzeGCzC81MDDgaUP8ld2zhx58HdqXGoBd+tHdrBMiyjGQs0Hxs/MLZTu/eHNJJuWPw==
 
+jquery@3.5.1:
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.5.1.tgz#d7b4d08e1bfdb86ad2f1a3d039ea17304717abb5"
+  integrity sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg==
+
 js-base64@^2.1.8:
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.5.1.tgz#1efa39ef2c5f7980bb1784ade4a8af2de3291121"