Dashboards: Update tests to be compatible with react router 6 (#93080)

* Dashboards: Update tests to be compatible with react router 6

* Update VersionsSettings.test

* Update DashboardGrid.test

* Update TimeSrv.test

* Remove redundant mock

* Update PublicDashboardListTable.test

* Update PlaylistEditPage.test

* Revert TimeSrv changes

public/app/features/dashboard-scene/settings/DashboardLinksEditView.test.tsx

@@ -12,17 +12,6 @@ import { activateFullSceneTree } from '../utils/test-utils';
 import { DashboardLinksEditView } from './DashboardLinksEditView';
 import { NEW_LINK } from './links/utils';
 
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
-  useLocation: jest.fn().mockReturnValue({
-    pathname: '/d/dash-1/settings/links',
-    search: '',
-    hash: '',
-    state: null,
-    key: '5nvxpbdafa',
-  }),
-}));
-
 function render(component: React.ReactNode) {
   return RTLRender(<TestProvider>{component}</TestProvider>);
 }

public/app/features/dashboard/components/DashboardSettings/GeneralSettings.test.tsx

@@ -1,16 +1,12 @@
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { Provider } from 'react-redux';
-import { BrowserRouter } from 'react-router-dom';
 import { selectOptionInTest } from 'test/helpers/selectOptionInTest';
-import { getGrafanaContextMock } from 'test/mocks/getGrafanaContextMock';
+import { render } from 'test/test-utils';
 import { byRole } from 'testing-library-selector';
 
 import { selectors } from '@grafana/e2e-selectors';
 import { BackendSrv, setBackendSrv } from '@grafana/runtime';
-import { GrafanaContext } from 'app/core/context/GrafanaContext';
 
-import { configureStore } from '../../../../store/configureStore';
 import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { GeneralSettingsUnconnected as GeneralSettings, Props } from './GeneralSettings';
@@ -20,7 +16,6 @@ setBackendSrv({
 } as unknown as BackendSrv);
 
 const setupTestContext = (options: Partial<Props>) => {
-  const store = configureStore();
   const defaults: Props = {
     dashboard: createDashboardModelFixture(
       {
@@ -50,15 +45,7 @@ const setupTestContext = (options: Partial<Props>) => {
 
   const props = { ...defaults, ...options };
 
-  const { rerender } = render(
-    <GrafanaContext.Provider value={getGrafanaContextMock()}>
-      <Provider store={store}>
-        <BrowserRouter>
-          <GeneralSettings {...props} />
-        </BrowserRouter>
-      </Provider>
-    </GrafanaContext.Provider>
-  );
+  const { rerender } = render(<GeneralSettings {...props} />);
 
   return { rerender, props };
 };

public/app/features/dashboard/components/DashboardSettings/VersionsSettings.test.tsx

@@ -1,13 +1,9 @@
-import { render, screen, waitFor, within } from '@testing-library/react';
+import { screen, waitFor, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { Provider } from 'react-redux';
-import { BrowserRouter } from 'react-router-dom';
-import { getGrafanaContextMock } from 'test/mocks/getGrafanaContextMock';
+import { render } from 'test/test-utils';
 
-import { GrafanaContext } from 'app/core/context/GrafanaContext';
 import { historySrv } from 'app/features/dashboard-scene/settings/version-history/HistorySrv';
 
-import { configureStore } from '../../../../store/configureStore';
 import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { VersionsSettings, VERSIONS_FETCH_LIMIT } from './VersionsSettings';
@@ -27,7 +23,6 @@ const queryByFullText = (text: string) =>
   });
 
 function setup() {
-  const store = configureStore();
   const dashboard = createDashboardModelFixture({
     id: 74,
     version: 11,
@@ -42,15 +37,7 @@ function setup() {
     },
   };
 
-  return render(
-    <GrafanaContext.Provider value={getGrafanaContextMock()}>
-      <Provider store={store}>
-        <BrowserRouter>
-          <VersionsSettings sectionNav={sectionNav} dashboard={dashboard} />
-        </BrowserRouter>
-      </Provider>
-    </GrafanaContext.Provider>
-  );
+  return render(<VersionsSettings sectionNav={sectionNav} dashboard={dashboard} />);
 }
 
 describe('VersionSettings', () => {

public/app/features/dashboard/dashgrid/DashboardGrid.test.tsx

@@ -1,17 +1,12 @@
-import { act, render, screen } from '@testing-library/react';
-import { Provider } from 'react-redux';
-import { Router } from 'react-router-dom';
+import { act, screen } from '@testing-library/react';
 import { useEffectOnce } from 'react-use';
-import { getGrafanaContextMock } from 'test/mocks/getGrafanaContextMock';
+import { render } from 'test/test-utils';
 
 import { TextBoxVariableModel } from '@grafana/data';
-import { locationService } from '@grafana/runtime';
 import { Dashboard } from '@grafana/schema';
 import appEvents from 'app/core/app_events';
-import { GrafanaContext } from 'app/core/context/GrafanaContext';
 import { GetVariables } from 'app/features/variables/state/selectors';
 import { VariablesChanged } from 'app/features/variables/types';
-import { configureStore } from 'app/store/configureStore';
 import { DashboardMeta } from 'app/types';
 
 import { DashboardModel } from '../state';
@@ -41,18 +36,7 @@ jest.mock('app/features/dashboard/dashgrid/LazyLoader', () => {
 });
 
 function setup(props: Props) {
-  const context = getGrafanaContextMock();
-  const store = configureStore({});
-
-  return render(
-    <GrafanaContext.Provider value={context}>
-      <Provider store={store}>
-        <Router history={locationService.getHistory()}>
-          <DashboardGrid {...props} />
-        </Router>
-      </Provider>
-    </GrafanaContext.Provider>
-  );
+  return render(<DashboardGrid {...props} />);
 }
 
 function getTestDashboard(

public/app/features/manage-dashboards/components/PublicDashboardListTable/PublicDashboardListTable.test.tsx

@@ -1,9 +1,7 @@
-import { render, screen, waitForElementToBeRemoved, within } from '@testing-library/react';
+import { screen, waitForElementToBeRemoved, within } from '@testing-library/react';
 import { http, HttpResponse } from 'msw';
 import { setupServer } from 'msw/node';
-import { BrowserRouter } from 'react-router-dom';
-import { TestProvider } from 'test/helpers/TestProvider';
-import { getGrafanaContextMock } from 'test/mocks/getGrafanaContextMock';
+import { render } from 'test/test-utils';
 
 import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
 import { backendSrv } from 'app/core/services/backend_srv';
@@ -69,15 +67,7 @@ afterEach(() => {
 const selectors = e2eSelectors.pages.PublicDashboards;
 
 const renderPublicDashboardTable = async (waitForListRendering?: boolean) => {
-  const context = getGrafanaContextMock();
-
-  render(
-    <TestProvider grafanaContext={context}>
-      <BrowserRouter>
-        <PublicDashboardListTable />
-      </BrowserRouter>
-    </TestProvider>
-  );
+  render(<PublicDashboardListTable />);
 
   waitForListRendering && (await waitForElementToBeRemoved(screen.getAllByTestId('Spinner')[0], { timeout: 3000 }));
 };

public/app/features/playlist/PlaylistEditPage.test.tsx

@@ -1,14 +1,13 @@
 import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { History, Location } from 'history';
-import { type match } from 'react-router-dom';
 import { TestProvider } from 'test/helpers/TestProvider';
 
 import { locationService } from '@grafana/runtime';
 import { RouteDescriptor } from 'app/core/navigation/types';
 import { backendSrv } from 'app/core/services/backend_srv';
 
-import { PlaylistEditPage, RouteParams } from './PlaylistEditPage';
+import { PlaylistEditPage } from './PlaylistEditPage';
 import { Playlist } from './types';
 
 jest.mock('@grafana/runtime', () => ({
@@ -27,7 +26,7 @@ async function getTestContext({ name, interval, items, uid }: Partial<Playlist>
   const playlist = { name, items, interval, uid } as unknown as Playlist;
   const queryParams = {};
   const route = {} as RouteDescriptor;
-  const match = { params: { uid: 'foo' } } as unknown as match<RouteParams>;
+  const match = { isExact: false, path: '', url: '', params: { uid: 'foo' } };
   const location = {} as Location;
   const history = {} as History;
   const getMock = jest.spyOn(backendSrv, 'get');