Chore: Remove our typeAsJestMock in favor of jest.mocked (#45114)

public/app/features/alerting/unified/AlertGroups.test.tsx

@@ -6,7 +6,6 @@ import { Router } from 'react-router-dom';
 import { fetchAlertGroups } from './api/alertmanager';
 import { byRole, byTestId, byText } from 'testing-library-selector';
 import { configureStore } from 'app/store/configureStore';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import AlertGroups from './AlertGroups';
 import { mockAlertGroup, mockAlertmanagerAlert, mockDataSource, MockDataSourceSrv } from './mocks';
 import { DataSourceType } from './utils/datasource';
@@ -16,7 +15,7 @@ jest.mock('./api/alertmanager');
 
 const mocks = {
   api: {
-    fetchAlertGroups: typeAsJestMock(fetchAlertGroups),
+    fetchAlertGroups: jest.mocked(fetchAlertGroups),
   },
 };
 

public/app/features/alerting/unified/AmRoutes.test.tsx

@@ -11,7 +11,6 @@ import {
   Route,
 } from 'app/plugins/datasource/alertmanager/types';
 import { configureStore } from 'app/store/configureStore';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { byLabelText, byRole, byTestId, byText } from 'testing-library-selector';
 import AmRoutes from './AmRoutes';
 import { fetchAlertManagerConfig, fetchStatus, updateAlertManagerConfig } from './api/alertmanager';
@@ -26,12 +25,12 @@ jest.mock('./api/alertmanager');
 jest.mock('./utils/config');
 
 const mocks = {
-  getAllDataSourcesMock: typeAsJestMock(getAllDataSources),
+  getAllDataSourcesMock: jest.mocked(getAllDataSources),
 
   api: {
-    fetchAlertManagerConfig: typeAsJestMock(fetchAlertManagerConfig),
-    updateAlertManagerConfig: typeAsJestMock(updateAlertManagerConfig),
-    fetchStatus: typeAsJestMock(fetchStatus),
+    fetchAlertManagerConfig: jest.mocked(fetchAlertManagerConfig),
+    updateAlertManagerConfig: jest.mocked(updateAlertManagerConfig),
+    fetchStatus: jest.mocked(fetchStatus),
   },
 };
 

public/app/features/alerting/unified/MuteTimings.test.tsx

@@ -5,7 +5,6 @@ import { locationService, setDataSourceSrv } from '@grafana/runtime';
 import { Provider } from 'react-redux';
 import { Router } from 'react-router-dom';
 import { fetchAlertManagerConfig, updateAlertManagerConfig } from './api/alertmanager';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { configureStore } from 'app/store/configureStore';
 
 import { mockDataSource, MockDataSourceSrv } from './mocks';
@@ -19,8 +18,8 @@ jest.mock('./api/alertmanager');
 
 const mocks = {
   api: {
-    fetchAlertManagerConfig: typeAsJestMock(fetchAlertManagerConfig),
-    updateAlertManagerConfig: typeAsJestMock(updateAlertManagerConfig),
+    fetchAlertManagerConfig: jest.mocked(fetchAlertManagerConfig),
+    updateAlertManagerConfig: jest.mocked(updateAlertManagerConfig),
   },
 };
 

public/app/features/alerting/unified/PanelAlertTabContent.test.tsx

@@ -15,7 +15,6 @@ import {
   mockRulerGrafanaRule,
 } from './mocks';
 import { DataSourceType, GRAFANA_RULES_SOURCE_NAME } from './utils/datasource';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { getAllDataSources } from './utils/config';
 import { fetchRules } from './api/prometheus';
 import { fetchRulerRules } from './api/ruler';
@@ -47,10 +46,10 @@ dataSources.prometheus.meta.alerting = true;
 dataSources.default.meta.alerting = true;
 
 const mocks = {
-  getAllDataSources: typeAsJestMock(getAllDataSources),
+  getAllDataSources: jest.mocked(getAllDataSources),
   api: {
-    fetchRules: typeAsJestMock(fetchRules),
-    fetchRulerRules: typeAsJestMock(fetchRulerRules),
+    fetchRules: jest.mocked(fetchRules),
+    fetchRulerRules: jest.mocked(fetchRulerRules),
   },
 };
 

public/app/features/alerting/unified/Receivers.test.tsx

@@ -6,7 +6,6 @@ import React from 'react';
 import { locationService, setDataSourceSrv } from '@grafana/runtime';
 import { act, render, waitFor } from '@testing-library/react';
 import { getAllDataSources } from './utils/config';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { updateAlertManagerConfig, fetchAlertManagerConfig, fetchStatus, testReceivers } from './api/alertmanager';
 import {
   mockDataSource,
@@ -31,14 +30,14 @@ jest.mock('./api/grafana');
 jest.mock('./utils/config');
 
 const mocks = {
-  getAllDataSources: typeAsJestMock(getAllDataSources),
+  getAllDataSources: jest.mocked(getAllDataSources),
 
   api: {
-    fetchConfig: typeAsJestMock(fetchAlertManagerConfig),
-    fetchStatus: typeAsJestMock(fetchStatus),
-    updateConfig: typeAsJestMock(updateAlertManagerConfig),
-    fetchNotifiers: typeAsJestMock(fetchNotifiers),
-    testReceivers: typeAsJestMock(testReceivers),
+    fetchConfig: jest.mocked(fetchAlertManagerConfig),
+    fetchStatus: jest.mocked(fetchStatus),
+    updateConfig: jest.mocked(updateAlertManagerConfig),
+    fetchNotifiers: jest.mocked(fetchNotifiers),
+    testReceivers: jest.mocked(testReceivers),
   },
 };
 

public/app/features/alerting/unified/RedirectToRuleViewer.test.tsx

@@ -6,7 +6,6 @@ import { DataSourceJsonData, PluginMeta } from '@grafana/data';
 import { locationService } from '@grafana/runtime';
 import { RedirectToRuleViewer } from './RedirectToRuleViewer';
 import { configureStore } from 'app/store/configureStore';
-import { typeAsJestMock } from '../../../../test/helpers/typeAsJestMock';
 import { useCombinedRulesMatching } from './hooks/useCombinedRule';
 import { CombinedRule, Rule } from '../../../types/unified-alerting';
 import { PromRuleType } from '../../../types/unified-alerting-dto';
@@ -31,7 +30,7 @@ const renderRedirectToRuleViewer = () => {
 };
 
 const mockRuleSourceByName = () => {
-  typeAsJestMock(getRulesSourceByName).mockReturnValue({
+  jest.mocked(getRulesSourceByName).mockReturnValue({
     name: 'prom test',
     type: 'prometheus',
     uid: 'asdf23',
@@ -44,7 +43,7 @@ const mockRuleSourceByName = () => {
 
 describe('Redirect to Rule viewer', () => {
   it('should list rules that match the same name', () => {
-    typeAsJestMock(useCombinedRulesMatching).mockReturnValue({
+    jest.mocked(useCombinedRulesMatching).mockReturnValue({
       result: mockedRules,
       loading: false,
       dispatched: true,
@@ -57,7 +56,7 @@ describe('Redirect to Rule viewer', () => {
   });
 
   it('should redirect to view rule page if only one match', () => {
-    typeAsJestMock(useCombinedRulesMatching).mockReturnValue({
+    jest.mocked(useCombinedRulesMatching).mockReturnValue({
       result: [mockedRules[0]],
       loading: false,
       dispatched: true,

public/app/features/alerting/unified/RuleEditor.test.tsx

@@ -11,7 +11,6 @@ import { contextSrv } from 'app/core/services/context_srv';
 import { mockDataSource, MockDataSourceSrv } from './mocks';
 import userEvent from '@testing-library/user-event';
 import { DataSourceInstanceSettings } from '@grafana/data';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { getAllDataSources } from './utils/config';
 import { fetchRulerRules, fetchRulerRulesGroup, fetchRulerRulesNamespace, setRulerRuleGroup } from './api/ruler';
 import { DataSourceType, GRAFANA_RULES_SOURCE_NAME } from './utils/datasource';
@@ -39,13 +38,13 @@ jest.mock('app/features/query/components/QueryEditorRow', () => ({
 }));
 
 const mocks = {
-  getAllDataSources: typeAsJestMock(getAllDataSources),
+  getAllDataSources: jest.mocked(getAllDataSources),
 
   api: {
-    fetchRulerRulesGroup: typeAsJestMock(fetchRulerRulesGroup),
-    setRulerRuleGroup: typeAsJestMock(setRulerRuleGroup),
-    fetchRulerRulesNamespace: typeAsJestMock(fetchRulerRulesNamespace),
-    fetchRulerRules: typeAsJestMock(fetchRulerRules),
+    fetchRulerRulesGroup: jest.mocked(fetchRulerRulesGroup),
+    setRulerRuleGroup: jest.mocked(setRulerRuleGroup),
+    fetchRulerRulesNamespace: jest.mocked(fetchRulerRulesNamespace),
+    fetchRulerRules: jest.mocked(fetchRulerRules),
   },
 };
 

public/app/features/alerting/unified/RuleList.test.tsx

@@ -4,7 +4,6 @@ import { configureStore } from 'app/store/configureStore';
 import { Provider } from 'react-redux';
 import RuleList from './RuleList';
 import { byLabelText, byRole, byTestId, byText } from 'testing-library-selector';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { getAllDataSources } from './utils/config';
 import { fetchRules } from './api/prometheus';
 import { fetchRulerRules, deleteRulerRulesGroup, deleteNamespace, setRulerRuleGroup } from './api/ruler';
@@ -39,14 +38,14 @@ jest.mock('app/core/core', () => ({
 }));
 
 const mocks = {
-  getAllDataSourcesMock: typeAsJestMock(getAllDataSources),
+  getAllDataSourcesMock: jest.mocked(getAllDataSources),
 
   api: {
-    fetchRules: typeAsJestMock(fetchRules),
-    fetchRulerRules: typeAsJestMock(fetchRulerRules),
-    deleteGroup: typeAsJestMock(deleteRulerRulesGroup),
-    deleteNamespace: typeAsJestMock(deleteNamespace),
-    setRulerRuleGroup: typeAsJestMock(setRulerRuleGroup),
+    fetchRules: jest.mocked(fetchRules),
+    fetchRulerRules: jest.mocked(fetchRulerRules),
+    deleteGroup: jest.mocked(deleteRulerRulesGroup),
+    deleteNamespace: jest.mocked(deleteNamespace),
+    setRulerRuleGroup: jest.mocked(setRulerRuleGroup),
   },
 };
 

public/app/features/alerting/unified/RuleViewer.test.tsx

@@ -6,7 +6,6 @@ import { DataSourceJsonData, PluginMeta } from '@grafana/data';
 import { locationService } from '@grafana/runtime';
 import { RuleViewer } from './RuleViewer';
 import { configureStore } from 'app/store/configureStore';
-import { typeAsJestMock } from '../../../../test/helpers/typeAsJestMock';
 import { useCombinedRule } from './hooks/useCombinedRule';
 import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
 import { GRAFANA_RULES_SOURCE_NAME } from './utils/datasource';
@@ -45,7 +44,7 @@ describe('RuleViewer', () => {
   });
 
   it('should render page with grafana alert', async () => {
-    typeAsJestMock(useCombinedRule).mockReturnValue({
+    jest.mocked(useCombinedRule).mockReturnValue({
       result: mockGrafanaRule as CombinedRule,
       loading: false,
       dispatched: true,
@@ -59,7 +58,7 @@ describe('RuleViewer', () => {
   });
 
   it('should render page with cloud alert', async () => {
-    typeAsJestMock(useCombinedRule).mockReturnValue({
+    jest.mocked(useCombinedRule).mockReturnValue({
       result: mockCloudRule as CombinedRule,
       loading: false,
       dispatched: true,

public/app/features/alerting/unified/Silences.test.tsx

@@ -5,7 +5,6 @@ import { dateTime } from '@grafana/data';
 import { Provider } from 'react-redux';
 import { Router } from 'react-router-dom';
 import { fetchSilences, fetchAlerts, createOrUpdateSilence } from './api/alertmanager';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { configureStore } from 'app/store/configureStore';
 import Silences from './Silences';
 import { mockAlertmanagerAlert, mockDataSource, MockDataSourceSrv, mockSilence } from './mocks';
@@ -21,9 +20,9 @@ const TEST_TIMEOUT = 60000;
 
 const mocks = {
   api: {
-    fetchSilences: typeAsJestMock(fetchSilences),
-    fetchAlerts: typeAsJestMock(fetchAlerts),
-    createOrUpdateSilence: typeAsJestMock(createOrUpdateSilence),
+    fetchSilences: jest.mocked(fetchSilences),
+    fetchAlerts: jest.mocked(fetchAlerts),
+    createOrUpdateSilence: jest.mocked(createOrUpdateSilence),
   },
 };
 

public/app/features/alerting/unified/components/admin/AlertmanagerConfig.test.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { getAllDataSources } from '../../utils/config';
 import {
   fetchAlertManagerConfig,
@@ -36,13 +35,13 @@ jest.mock('../../api/grafana');
 jest.mock('../../utils/config');
 
 const mocks = {
-  getAllDataSources: typeAsJestMock(getAllDataSources),
+  getAllDataSources: jest.mocked(getAllDataSources),
 
   api: {
-    fetchConfig: typeAsJestMock(fetchAlertManagerConfig),
-    deleteAlertManagerConfig: typeAsJestMock(deleteAlertManagerConfig),
-    updateAlertManagerConfig: typeAsJestMock(updateAlertManagerConfig),
-    fetchStatus: typeAsJestMock(fetchStatus),
+    fetchConfig: jest.mocked(fetchAlertManagerConfig),
+    deleteAlertManagerConfig: jest.mocked(deleteAlertManagerConfig),
+    updateAlertManagerConfig: jest.mocked(updateAlertManagerConfig),
+    fetchStatus: jest.mocked(fetchStatus),
   },
 };
 

public/app/plugins/panel/alertGroups/AlertGroupsPanel.test.tsx

@@ -6,7 +6,6 @@ import { byTestId } from 'testing-library-selector';
 import { configureStore } from 'app/store/configureStore';
 import { AlertGroupPanelOptions } from './types';
 import { getDefaultTimeRange, LoadingState, PanelProps, FieldConfigSource } from '@grafana/data';
-import { typeAsJestMock } from 'test/helpers/typeAsJestMock';
 import { fetchAlertGroups } from 'app/features/alerting/unified/api/alertmanager';
 import {
   mockAlertGroup,
@@ -32,7 +31,7 @@ jest.mock('@grafana/runtime', () => ({
 
 const mocks = {
   api: {
-    fetchAlertGroups: typeAsJestMock(fetchAlertGroups),
+    fetchAlertGroups: jest.mocked(fetchAlertGroups),
   },
 };
 

public/test/helpers/typeAsJestMock.ts

@@ -1,9 +0,0 @@
-/* type a mocked function as jest mock, example:
- * import { doFoo } from 'foo';
- *
- * jest.mock('foo');
- *
- * const doFooMock = typeAsJestMock(doFoo); // doFooMock is of type jest.Mock with proper return type for doFoo
- */
-
-export const typeAsJestMock = <T extends (...args: any) => any>(fn: T) => fn as unknown as jest.Mock<ReturnType<T>>;