grafana/public/app/plugins/datasource/cloudwatch/hooks.test.ts
Ashley Harrison 1261345b81
Chore: Upgrade to react 18 (#64428)
* update react 18 related deps

* fix some types

* make sure we're on react-router-dom >= 5.3.3

* Use new root API

* Remove StrictMode for now - react 18 double rendering causes issues

* fix + ignore some @grafana/ui types

* fix some more types

* use renderHook from @testing-library/react in almost all cases

* fix storybook types

* rewrite useDashboardSave to not use useEffect

* make props optional

* only render if props are provided

* add correct type for useCallback

* make resourcepicker tests more robust

* fix ModalManager rendering

* fix some more unit tests

* store the click coordinates in a ref as setState is NOT synchronous

* fix remaining e2e tests

* rewrite dashboardpage tests to avoid act warnings

* undo lint ignores

* fix ExpanderCell types

* set SymbolCell type correctly

* fix QueryAndExpressionsStep

* looks like the types were actually wrong instead :D

* undo this for now...

* remove spinner waits

* more robust tests

* rewrite errorboundary test to not explicitly count the number of renders

* make urlParam expect async

* increase timeout in waitFor

* revert ExplorePage test changes

* Update public/app/features/dashboard/containers/DashboardPage.test.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update public/app/features/dashboard/containers/PublicDashboardPage.test.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update public/app/features/dashboard/containers/PublicDashboardPage.test.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update public/app/features/dashboard/containers/PublicDashboardPage.test.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* skip fakeTimer test, ignore table types for now + other review comments

* update package peerDeps

* small tweak to resourcepicker test

* update lockfile...

* increase timeout in sharepublicdashboard tests

* ensure ExplorePaneContainer passes correct queries to initializeExplore

* fix LokiContextUI test

* fix unit tests

* make importDashboard flow more consistent

* wait for dashboard name before continuing

* more test fixes

* readd dashboard name to variable e2e tests

* wait for switches to be enabled before clicking

* fix modal rendering

* don't use @testing-library/dom directly

* quick fix for rendering of panels in firefox

* make PromQueryField test more robust

* don't wait for chartData - in react 18 this can happen before the wait code even gets executed

---------

Co-authored-by: kay delaney <kay@grafana.com>
Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
2023-04-11 10:51:54 +01:00

144 lines
5.5 KiB
TypeScript

import { renderHook, waitFor } from '@testing-library/react';
import { config } from '@grafana/runtime';
import {
accountIdVariable,
dimensionVariable,
metricVariable,
namespaceVariable,
regionVariable,
setupMockedDataSource,
} from './__mocks__/CloudWatchDataSource';
import { setupMockedResourcesAPI } from './__mocks__/ResourcesAPI';
import { useAccountOptions, useDimensionKeys, useIsMonitoringAccount, useMetrics } from './hooks';
const originalFeatureToggleValue = config.featureToggles.cloudWatchCrossAccountQuerying;
describe('hooks', () => {
afterEach(() => {
config.featureToggles.cloudWatchCrossAccountQuerying = originalFeatureToggleValue;
});
describe('useIsMonitoringAccount', () => {
it('should interpolate variables before calling api', async () => {
config.featureToggles.cloudWatchCrossAccountQuerying = true;
const { api } = setupMockedResourcesAPI({
variables: [regionVariable],
});
const isMonitoringAccountMock = jest.fn().mockResolvedValue(true);
api.isMonitoringAccount = isMonitoringAccountMock;
renderHook(() => useIsMonitoringAccount(api, `$${regionVariable.name}`));
await waitFor(() => {
expect(isMonitoringAccountMock).toHaveBeenCalledTimes(1);
expect(isMonitoringAccountMock).toHaveBeenCalledWith(regionVariable.current.value);
});
});
});
describe('useMetricNames', () => {
it('should interpolate variables before calling api', async () => {
const { datasource } = setupMockedDataSource({
variables: [regionVariable, namespaceVariable, accountIdVariable],
});
const getMetricsMock = jest.fn().mockResolvedValue([]);
datasource.resources.getMetrics = getMetricsMock;
renderHook(() =>
useMetrics(datasource, {
namespace: `$${namespaceVariable.name}`,
region: `$${regionVariable.name}`,
accountId: `$${accountIdVariable.name}`,
})
);
await waitFor(() => {
expect(getMetricsMock).toHaveBeenCalledTimes(1);
expect(getMetricsMock).toHaveBeenCalledWith({
region: regionVariable.current.value,
namespace: namespaceVariable.current.value,
accountId: accountIdVariable.current.value,
});
});
});
});
describe('useDimensionKeys', () => {
it('should interpolate variables before calling api', async () => {
const { datasource } = setupMockedDataSource({
mockGetVariableName: true,
variables: [regionVariable, namespaceVariable, accountIdVariable, metricVariable, dimensionVariable],
});
const getDimensionKeysMock = jest.fn().mockResolvedValue([]);
datasource.resources.getDimensionKeys = getDimensionKeysMock;
renderHook(() =>
useDimensionKeys(datasource, {
namespace: `$${namespaceVariable.name}`,
metricName: `$${metricVariable.name}`,
region: `$${regionVariable.name}`,
accountId: `$${accountIdVariable.name}`,
dimensionFilters: {
environment: `$${dimensionVariable.name}`,
},
})
);
await waitFor(() => {
expect(getDimensionKeysMock).toHaveBeenCalledTimes(1);
expect(getDimensionKeysMock).toHaveBeenCalledWith({
region: regionVariable.current.value,
namespace: namespaceVariable.current.value,
metricName: metricVariable.current.value,
accountId: accountIdVariable.current.value,
dimensionFilters: {
environment: [dimensionVariable.current.value],
},
});
});
});
});
describe('useAccountOptions', () => {
it('does not call the api if the feature toggle is off', async () => {
config.featureToggles.cloudWatchCrossAccountQuerying = false;
const { api } = setupMockedResourcesAPI({
variables: [regionVariable],
});
const getAccountsMock = jest.fn().mockResolvedValue([{ id: '123', label: 'accountLabel' }]);
api.getAccounts = getAccountsMock;
renderHook(() => useAccountOptions(api, `$${regionVariable.name}`));
await waitFor(() => {
expect(getAccountsMock).toHaveBeenCalledTimes(0);
});
});
it('interpolates region variables before calling the api', async () => {
config.featureToggles.cloudWatchCrossAccountQuerying = true;
const { api } = setupMockedResourcesAPI({
variables: [regionVariable],
});
const getAccountsMock = jest.fn().mockResolvedValue([{ id: '123', label: 'accountLabel' }]);
api.getAccounts = getAccountsMock;
renderHook(() => useAccountOptions(api, `$${regionVariable.name}`));
await waitFor(() => {
expect(getAccountsMock).toHaveBeenCalledTimes(1);
expect(getAccountsMock).toHaveBeenCalledWith({ region: regionVariable.current.value });
});
});
it('returns properly formatted account options, and template variables', async () => {
config.featureToggles.cloudWatchCrossAccountQuerying = true;
const { api } = setupMockedResourcesAPI({
variables: [regionVariable],
});
const getAccountsMock = jest.fn().mockResolvedValue([{ id: '123', label: 'accountLabel' }]);
api.getAccounts = getAccountsMock;
const { result } = renderHook(() => useAccountOptions(api, `$${regionVariable.name}`));
await waitFor(() => {
expect(result.current.value).toEqual([
{ label: 'accountLabel', description: '123', value: '123' },
{ label: 'Template Variables', options: [{ label: '$region', value: '$region' }] },
]);
});
});
});
});