schema: Use generated dashboard model in frontend (#55769)

Co-authored-by: Ivan Ortega <ivanortegaalba@gmail.com>
Co-authored-by: Josh Hunt <joshhunt@users.noreply.github.com>
Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
Co-authored-by: polinaboneva <polina.boneva@grafana.com>

public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.test.tsx

@@ -1,13 +1,14 @@
 import { render, screen } from '@testing-library/react';
 import React from 'react';
 
-import { DashboardModel, PanelModel } from '../../state';
+import { PanelModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { AddPanelWidgetUnconnected as AddPanelWidget, Props } from './AddPanelWidget';
 
 const getTestContext = (propOverrides?: object) => {
   const props: Props = {
-    dashboard: new DashboardModel({}),
+    dashboard: createDashboardModelFixture(),
     panel: new PanelModel({}),
     addPanel: jest.fn() as any,
   };

public/app/features/dashboard/components/DashNav/DashNav.test.tsx

@@ -10,13 +10,13 @@ import { getGrafanaContextMock } from '../../../../../test/mocks/getGrafanaConte
 import { setStarred } from '../../../../core/reducers/navBarTree';
 import { configureStore } from '../../../../store/configureStore';
 import { updateTimeZoneForSession } from '../../../profile/state/reducers';
-import { DashboardModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { DashNav } from './DashNav';
 
 describe('Public dashboard title tag', () => {
   it('will be rendered when publicDashboardEnabled set to true in dashboard meta', async () => {
-    let dashboard = new DashboardModel({}, { publicDashboardEnabled: false });
+    let dashboard = createDashboardModelFixture({}, { publicDashboardEnabled: false });
 
     const store = configureStore();
     const context = getGrafanaContextMock();

public/app/features/dashboard/components/DashboardPrompt/DashboardPrompt.test.tsx

@@ -1,21 +1,22 @@
 import { getPanelPlugin } from 'app/features/plugins/__mocks__/pluginMocks';
 
 import { setContextSrv } from '../../../../core/services/context_srv';
-import { DashboardModel } from '../../state/DashboardModel';
 import { PanelModel } from '../../state/PanelModel';
+import { createDashboardModelFixture, createPanelJSONFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { hasChanges, ignoreChanges } from './DashboardPrompt';
 
-function getDefaultDashboardModel(): DashboardModel {
-  return new DashboardModel({
+function getDefaultDashboardModel() {
+  return createDashboardModelFixture({
     refresh: false,
     panels: [
-      {
+      createPanelJSONFixture({
         id: 1,
         type: 'graph',
         gridPos: { x: 0, y: 0, w: 24, h: 6 },
-        legend: { sortDesc: false },
-      },
+        legend: { show: true, sortDesc: false }, // TODO legend is marked as a non-persisted field
+      }),
+
       {
         id: 2,
         type: 'row',
@@ -26,7 +27,7 @@ function getDefaultDashboardModel(): DashboardModel {
           { id: 4, type: 'graph', gridPos: { x: 12, y: 6, w: 12, h: 2 } },
         ],
       },
-      { id: 5, type: 'row', gridPos: { x: 0, y: 6, w: 1, h: 1 } },
+      { id: 5, type: 'row', gridPos: { x: 0, y: 6, w: 1, h: 1 }, collapsed: false, panels: [] },
     ],
   });
 }
@@ -34,8 +35,8 @@ function getDefaultDashboardModel(): DashboardModel {
 function getTestContext() {
   const contextSrv: any = { isSignedIn: true, isEditor: true };
   setContextSrv(contextSrv);
-  const dash: any = getDefaultDashboardModel();
-  const original: any = dash.getSaveModelClone();
+  const dash = getDefaultDashboardModel();
+  const original = dash.getSaveModelClone();
 
   return { dash, original, contextSrv };
 }
@@ -68,8 +69,8 @@ describe('DashboardPrompt', () => {
 
   it('Should ignore panel legend changes', () => {
     const { original, dash } = getTestContext();
-    dash.panels[0].legend.sortDesc = true;
-    dash.panels[0].legend.sort = 'avg';
+    dash.panels[0]!.legend!.sortDesc = true;
+    dash.panels[0]!.legend!.sort = 'avg';
     expect(hasChanges(dash, original)).toBe(false);
   });
 
@@ -90,47 +91,45 @@ describe('DashboardPrompt', () => {
     describe('when called without current dashboard', () => {
       it('then it should return true', () => {
         const { original } = getTestContext();
-        expect(ignoreChanges(null as unknown as DashboardModel, original)).toBe(true);
-      });
-    });
-
-    describe('when called without meta in current dashboard', () => {
-      it('then it should return true', () => {
-        const { original, dash } = getTestContext();
-        expect(ignoreChanges({ ...dash, meta: undefined }, original)).toBe(true);
+        expect(ignoreChanges(null, original)).toBe(true);
       });
     });
 
     describe('when called for a viewer without save permissions', () => {
       it('then it should return true', () => {
-        const { original, dash, contextSrv } = getTestContext();
+        const { contextSrv } = getTestContext();
+        const dash = createDashboardModelFixture({}, { canSave: false });
+        const original = dash.getSaveModelClone();
         contextSrv.isEditor = false;
-        expect(ignoreChanges({ ...dash, meta: { canSave: false } }, original)).toBe(true);
+        expect(ignoreChanges(dash, original)).toBe(true);
       });
     });
 
     describe('when called for a viewer with save permissions', () => {
       it('then it should return undefined', () => {
-        const { original, dash, contextSrv } = getTestContext();
+        const { contextSrv } = getTestContext();
+        const dash = createDashboardModelFixture({}, { canSave: true });
+        const original = dash.getSaveModelClone();
         contextSrv.isEditor = false;
-        expect(ignoreChanges({ ...dash, meta: { canSave: true } }, original)).toBe(undefined);
+        expect(ignoreChanges(dash, original)).toBe(undefined);
       });
     });
 
     describe('when called for an user that is not signed in', () => {
       it('then it should return true', () => {
-        const { original, dash, contextSrv } = getTestContext();
+        const { contextSrv } = getTestContext();
+        const dash = createDashboardModelFixture({}, { canSave: true });
+        const original = dash.getSaveModelClone();
         contextSrv.isSignedIn = false;
-        expect(ignoreChanges({ ...dash, meta: { canSave: true } }, original)).toBe(true);
+        expect(ignoreChanges(dash, original)).toBe(true);
       });
     });
 
     describe('when called with fromScript', () => {
       it('then it should return true', () => {
-        const { original, dash } = getTestContext();
-        expect(
-          ignoreChanges({ ...dash, meta: { canSave: true, fromScript: true, fromFile: undefined } }, original)
-        ).toBe(true);
+        const dash = createDashboardModelFixture({}, { canSave: true, fromScript: true, fromFile: undefined });
+        const original = dash.getSaveModelClone();
+        expect(ignoreChanges(dash, original)).toBe(true);
       });
     });
 
@@ -147,19 +146,17 @@ describe('DashboardPrompt', () => {
 
     describe('when called with fromFile', () => {
       it('then it should return true', () => {
-        const { original, dash } = getTestContext();
-        expect(
-          ignoreChanges({ ...dash, meta: { canSave: true, fromScript: undefined, fromFile: true } }, original)
-        ).toBe(true);
+        const dash = createDashboardModelFixture({}, { canSave: true, fromScript: undefined, fromFile: true });
+        const original = dash.getSaveModelClone();
+        expect(ignoreChanges(dash, original)).toBe(true);
       });
     });
 
     describe('when called with canSave but without fromScript and fromFile', () => {
       it('then it should return false', () => {
-        const { original, dash } = getTestContext();
-        expect(
-          ignoreChanges({ ...dash, meta: { canSave: true, fromScript: undefined, fromFile: undefined } }, original)
-        ).toBe(undefined);
+        const dash = createDashboardModelFixture({}, { canSave: true, fromScript: undefined, fromFile: undefined });
+        const original = dash.getSaveModelClone();
+        expect(ignoreChanges(dash, original)).toBe(undefined);
       });
     });
   });

public/app/features/dashboard/components/DashboardPrompt/DashboardPrompt.tsx

@@ -4,6 +4,7 @@ import React, { useContext, useEffect, useState } from 'react';
 import { Prompt } from 'react-router-dom';
 
 import { locationService } from '@grafana/runtime';
+import { Dashboard } from '@grafana/schema';
 import { ModalsContext } from '@grafana/ui';
 import { appEvents } from 'app/core/app_events';
 import { contextSrv } from 'app/core/services/context_srv';
@@ -140,7 +141,7 @@ function moveToBlockedLocationAfterReactStateUpdate(location?: H.Location | null
 /**
  * For some dashboards and users changes should be ignored *
  */
-export function ignoreChanges(current: DashboardModel, original: object | null) {
+export function ignoreChanges(current: DashboardModel | null, original: object | null) {
   if (!original) {
     return true;
   }
@@ -150,7 +151,7 @@ export function ignoreChanges(current: DashboardModel, original: object | null)
     return true;
   }
 
-  if (!current || !current.meta) {
+  if (!current) {
     return true;
   }
 
@@ -165,7 +166,7 @@ export function ignoreChanges(current: DashboardModel, original: object | null)
 /**
  * Remove stuff that should not count in diff
  */
-function cleanDashboardFromIgnoredChanges(dashData: unknown) {
+function cleanDashboardFromIgnoredChanges(dashData: Dashboard) {
   // need to new up the domain model class to get access to expand / collapse row logic
   const model = new DashboardModel(dashData);
 
@@ -193,13 +194,14 @@ function cleanDashboardFromIgnoredChanges(dashData: unknown) {
   return dash;
 }
 
+// TODO: Adapt original to be Dashboard type instead
 export function hasChanges(current: DashboardModel, original: unknown) {
   if (current.hasUnsavedChanges()) {
     return true;
   }
-
-  const currentClean = cleanDashboardFromIgnoredChanges(current.getSaveModelClone());
-  const originalClean = cleanDashboardFromIgnoredChanges(original);
+  // TODO: Make getSaveModelClone return Dashboard type instead
+  const currentClean = cleanDashboardFromIgnoredChanges(current.getSaveModelClone() as unknown as Dashboard);
+  const originalClean = cleanDashboardFromIgnoredChanges(original as Dashboard);
 
   const currentTimepicker = find((currentClean as any).nav, { type: 'timepicker' });
   const originalTimepicker = find((originalClean as any).nav, { type: 'timepicker' });

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

@@ -13,6 +13,7 @@ import { mockDataSource, MockDataSourceSrv } from 'app/features/alerting/unified
 
 import { configureStore } from '../../../../store/configureStore';
 import { DashboardModel } from '../../state/DashboardModel';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { AnnotationsSettings } from './AnnotationsSettings';
 
@@ -83,7 +84,7 @@ describe('AnnotationsSettings', () => {
   });
 
   beforeEach(() => {
-    dashboard = new DashboardModel({
+    dashboard = createDashboardModelFixture({
       id: 74,
       version: 7,
       annotations: {
@@ -96,6 +97,7 @@ describe('AnnotationsSettings', () => {
             iconColor: 'rgba(0, 211, 255, 1)',
             name: 'Annotations & Alerts',
             type: 'dashboard',
+            showIn: 1,
           },
         ],
       },

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

@@ -9,7 +9,7 @@ import { BackendSrv, setBackendSrv } from '@grafana/runtime';
 import { GrafanaContext } from 'app/core/context/GrafanaContext';
 import { configureStore } from 'app/store/configureStore';
 
-import { DashboardModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { DashboardSettings } from './DashboardSettings';
 
@@ -27,7 +27,7 @@ setBackendSrv({
 
 describe('DashboardSettings', () => {
   it('pressing escape navigates away correctly', async () => {
-    const dashboard = new DashboardModel(
+    const dashboard = createDashboardModelFixture(
       {
         title: 'Foo',
       },

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

@@ -12,7 +12,7 @@ import { BackendSrv, setBackendSrv } from '@grafana/runtime';
 import { GrafanaContext } from 'app/core/context/GrafanaContext';
 
 import { configureStore } from '../../../../store/configureStore';
-import { DashboardModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { GeneralSettingsUnconnected as GeneralSettings, Props } from './GeneralSettings';
 
@@ -23,13 +23,16 @@ setBackendSrv({
 const setupTestContext = (options: Partial<Props>) => {
   const store = configureStore();
   const defaults: Props = {
-    dashboard: new DashboardModel(
+    dashboard: createDashboardModelFixture(
       {
         title: 'test dashboard title',
         description: 'test dashboard description',
         timepicker: {
           refresh_intervals: ['5s', '10s', '30s', '1m', '5m', '15m', '30m', '1h', '2h', '1d', '2d'],
           time_options: ['5m', '15m', '1h', '6h', '12h', '24h', '2d', '7d', '30d'],
+          collapse: true,
+          enable: true,
+          hidden: false,
         },
         timezone: 'utc',
       },

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

@@ -12,6 +12,7 @@ import { GrafanaContext } from 'app/core/context/GrafanaContext';
 
 import { configureStore } from '../../../../store/configureStore';
 import { DashboardModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { DashboardSettings } from './DashboardSettings';
 
@@ -37,7 +38,7 @@ function setup(dashboard: DashboardModel) {
 }
 
 function buildTestDashboard() {
-  return new DashboardModel({
+  return createDashboardModelFixture({
     links: [
       {
         asDropdown: false,
@@ -87,7 +88,7 @@ describe('LinksSettings', () => {
   };
 
   test('it renders a header and cta if no links', () => {
-    const linklessDashboard = new DashboardModel({ links: [] });
+    const linklessDashboard = createDashboardModelFixture({ links: [] });
     setup(linklessDashboard);
 
     expect(screen.getByRole('heading', { name: 'Links' })).toBeInTheDocument();

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

@@ -9,7 +9,7 @@ import { getGrafanaContextMock } from 'test/mocks/getGrafanaContextMock';
 import { GrafanaContext } from 'app/core/context/GrafanaContext';
 
 import { configureStore } from '../../../../store/configureStore';
-import { DashboardModel } from '../../state/DashboardModel';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 import { historySrv } from '../VersionHistory/HistorySrv';
 
 import { VersionsSettings, VERSIONS_FETCH_LIMIT } from './VersionsSettings';
@@ -30,11 +30,11 @@ const queryByFullText = (text: string) =>
 
 function setup() {
   const store = configureStore();
-  const dashboard = new DashboardModel({
+  const dashboard = createDashboardModelFixture({
     id: 74,
     version: 11,
-    formatDate: jest.fn(() => 'date'),
-    getRelativeTime: jest.fn(() => 'time ago'),
+    // formatDate: jest.fn(() => 'date'),
+    // getRelativeTime: jest.fn(() => 'time ago'),
   });
 
   const sectionNav = {

public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.test.tsx

@@ -16,7 +16,8 @@ import { selectors } from '@grafana/e2e-selectors';
 import { getAllOptionEditors, getAllStandardFieldConfigs } from 'app/core/components/OptionsUI/registry';
 import { getPanelPlugin } from 'app/features/plugins/__mocks__/pluginMocks';
 
-import { DashboardModel, PanelModel } from '../../state';
+import { PanelModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { OptionsPaneOptions } from './OptionsPaneOptions';
 import { dataOverrideTooltipDescription, overrideRuleTooltipDescription } from './state/getOptionOverrides';
@@ -88,7 +89,7 @@ class OptionsPaneOptionsTestScenario {
     options: {},
   });
 
-  dashboard = new DashboardModel({});
+  dashboard = createDashboardModelFixture();
   store = mockStore({
     dashboard: { panels: [] },
     templating: {

public/app/features/dashboard/components/PanelEditor/PanelEditorTableView.test.tsx

@@ -18,7 +18,8 @@ import {
 import { getTimeSrv, TimeSrv, setTimeSrv } from 'app/features/dashboard/services/TimeSrv';
 
 import { PanelQueryRunner } from '../../../query/state/PanelQueryRunner';
-import { DashboardModel, PanelModel } from '../../state';
+import { PanelModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { PanelEditorTableView, Props } from './PanelEditorTableView';
 
@@ -53,14 +54,11 @@ function setupTestContext(options: Partial<Props> = {}) {
       getDisplayTitle: jest.fn(),
       runAllPanelQueries: jest.fn(),
     }),
-    dashboard: new DashboardModel({
+    dashboard: createDashboardModelFixture({
       id: 1,
       uid: 'super-unique-id',
-      panelInitialized: jest.fn(),
-      events: new EventBusSrv(),
-      meta: {
-        isPublic: false,
-      },
+      // panelInitialized: jest.fn(),
+      // events: new EventBusSrv(),
       panels: [],
     }),
     plugin: {

public/app/features/dashboard/components/PanelEditor/state/actions.test.ts

@@ -1,8 +1,9 @@
+import { createDashboardModelFixture } from 'app/features/dashboard/state/__fixtures__/dashboardFixtures';
 import { panelModelAndPluginReady, removePanel } from 'app/features/panel/state/reducers';
 import { getPanelPlugin } from 'app/features/plugins/__mocks__/pluginMocks';
 
 import { thunkTester } from '../../../../../../test/core/thunk/thunkTester';
-import { DashboardModel, PanelModel } from '../../../state';
+import { PanelModel } from '../../../state';
 
 import { exitPanelEditor, initPanelEditor, skipPanelUpdate } from './actions';
 import { closeEditor, initialState, PanelEditorState } from './reducers';
@@ -10,7 +11,7 @@ import { closeEditor, initialState, PanelEditorState } from './reducers';
 describe('panelEditor actions', () => {
   describe('initPanelEditor', () => {
     it('initPanelEditor should create edit panel model as clone', async () => {
-      const dashboard = new DashboardModel({
+      const dashboard = createDashboardModelFixture({
         panels: [{ id: 12, type: 'graph' }],
       });
       const sourcePanel = new PanelModel({ id: 12, type: 'graph' });
@@ -34,7 +35,7 @@ describe('panelEditor actions', () => {
   describe('panelEditorCleanUp', () => {
     it('should update source panel', async () => {
       const sourcePanel = new PanelModel({ id: 12, type: 'graph' });
-      const dashboard = new DashboardModel({
+      const dashboard = createDashboardModelFixture({
         panels: [{ id: 12, type: 'graph' }],
       });
 
@@ -66,7 +67,7 @@ describe('panelEditor actions', () => {
 
     it('should dispatch panelModelAndPluginReady if type changed', async () => {
       const sourcePanel = new PanelModel({ id: 12, type: 'graph' });
-      const dashboard = new DashboardModel({
+      const dashboard = createDashboardModelFixture({
         panels: [{ id: 12, type: 'graph' }],
       });
 
@@ -105,7 +106,7 @@ describe('panelEditor actions', () => {
         customFieldConfigs: {},
       } as any;
 
-      const dashboard = new DashboardModel({
+      const dashboard = createDashboardModelFixture({
         panels: [{ id: 12, type: 'graph' }],
       });
 
@@ -138,7 +139,7 @@ describe('panelEditor actions', () => {
       sourcePanel.plugin = getPanelPlugin({});
       sourcePanel.plugin.angularPanelCtrl = undefined;
 
-      const dashboard = new DashboardModel({
+      const dashboard = createDashboardModelFixture({
         panels: [{ id: 12, type: 'graph' }],
       });
 
@@ -168,7 +169,7 @@ describe('panelEditor actions', () => {
       sourcePanel.plugin = getPanelPlugin({});
       sourcePanel.plugin.angularPanelCtrl = undefined;
 
-      const dashboard = new DashboardModel({
+      const dashboard = createDashboardModelFixture({
         panels: [{ id: 12, type: 'graph' }],
       });
 
@@ -207,7 +208,7 @@ describe('panelEditor actions', () => {
       sourcePanel.plugin = getPanelPlugin({});
       sourcePanel.plugin.angularPanelCtrl = {};
 
-      const dashboard = new DashboardModel({
+      const dashboard = createDashboardModelFixture({
         panels: [{ id: 12, type: 'graph' }],
       });
 

public/app/features/dashboard/components/SaveDashboard/SaveDashboardDrawer.test.tsx

@@ -6,6 +6,7 @@ import { Provider } from 'react-redux';
 import { configureStore } from 'app/store/configureStore';
 
 import { DashboardModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { SaveDashboardDrawer } from './SaveDashboardDrawer';
 
@@ -30,7 +31,7 @@ jest.mock('app/core/services/backend_srv', () => ({
 const store = configureStore();
 const mockPost = jest.fn();
 const buildMocks = () => ({
-  dashboard: new DashboardModel({
+  dashboard: createDashboardModelFixture({
     uid: 'mockDashboardUid',
     version: 1,
   }),

public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardAsForm.tsx

@@ -31,7 +31,6 @@ const getSaveAsDashboardClone = (dashboard: DashboardModel) => {
     });
   }
 
-  delete clone.autoUpdate;
   return clone;
 };
 

public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardForm.test.tsx

@@ -3,6 +3,7 @@ import userEvent from '@testing-library/user-event';
 import React from 'react';
 
 import { DashboardModel } from 'app/features/dashboard/state';
+import { createDashboardModelFixture } from 'app/features/dashboard/state/__fixtures__/dashboardFixtures';
 
 import { SaveDashboardOptions } from '../types';
 
@@ -123,14 +124,14 @@ describe('SaveDashboardAsForm', () => {
     it('renders saved message draft if it was filled before', () => {
       render(
         <SaveDashboardForm
-          dashboard={new DashboardModel({})}
+          dashboard={createDashboardModelFixture()}
           onCancel={() => {}}
           onSuccess={() => {}}
           onSubmit={async () => {
             return {};
           }}
           saveModel={{
-            clone: new DashboardModel({}),
+            clone: createDashboardModelFixture(),
             diff: {},
             diffCount: 0,
             hasChanges: true,

public/app/features/dashboard/components/ShareModal/ShareEmbed.test.tsx

@@ -6,7 +6,8 @@ import { setEchoSrv } from '@grafana/runtime/src';
 import config from 'app/core/config';
 
 import { Echo } from '../../../../core/services/echo/Echo';
-import { DashboardModel, PanelModel } from '../../state';
+import { PanelModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { ShareEmbed } from './ShareEmbed';
 
@@ -68,7 +69,7 @@ describe('ShareEmbed', () => {
   });
 
   it('generates the correct embed url for a dashboard', () => {
-    const mockDashboard = new DashboardModel({
+    const mockDashboard = createDashboardModelFixture({
       uid: 'mockDashboardUid',
     });
     const mockPanel = new PanelModel({
@@ -86,7 +87,7 @@ describe('ShareEmbed', () => {
 
   it('generates the correct embed url for a dashboard set to the homepage in the grafana config', () => {
     mockLocationHref('http://dashboards.grafana.com/?orgId=1');
-    const mockDashboard = new DashboardModel({
+    const mockDashboard = createDashboardModelFixture({
       uid: 'mockDashboardUid',
     });
     const mockPanel = new PanelModel({
@@ -104,7 +105,7 @@ describe('ShareEmbed', () => {
   it('generates the correct embed url for a snapshot', () => {
     const mockSlug = 'mockSlug';
     mockLocationHref(`http://dashboards.grafana.com/dashboard/snapshot/${mockSlug}?orgId=1`);
-    const mockDashboard = new DashboardModel({
+    const mockDashboard = createDashboardModelFixture({
       uid: 'mockDashboardUid',
     });
     const mockPanel = new PanelModel({
@@ -122,7 +123,7 @@ describe('ShareEmbed', () => {
   it('generates the correct embed url for a scripted dashboard', () => {
     const mockSlug = 'scripted.js';
     mockLocationHref(`http://dashboards.grafana.com/dashboard/script/${mockSlug}?orgId=1`);
-    const mockDashboard = new DashboardModel({
+    const mockDashboard = createDashboardModelFixture({
       uid: 'mockDashboardUid',
     });
     const mockPanel = new PanelModel({

public/app/features/dashboard/components/ShareModal/ShareLink.test.tsx

@@ -11,7 +11,8 @@ import { initTemplateSrv } from '../../../../../test/helpers/initTemplateSrv';
 import { Echo } from '../../../../core/services/echo/Echo';
 import { variableAdapters } from '../../../variables/adapters';
 import { createQueryVariableAdapter } from '../../../variables/query/adapter';
-import { DashboardModel, PanelModel } from '../../state';
+import { PanelModel } from '../../state';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { Props, ShareLink } from './ShareLink';
 
@@ -78,13 +79,20 @@ describe('ShareModal', () => {
   });
 
   beforeEach(() => {
+    const defaultTimeRange = getDefaultTimeRange();
     setUTCTimeZone();
     mockLocationHref('http://server/#!/test');
     config.rendererAvailable = true;
     config.bootData.user.orgId = 1;
     props = {
       panel: new PanelModel({ id: 22, options: {}, fieldConfig: { defaults: {}, overrides: [] } }),
-      dashboard: new DashboardModel({ time: getDefaultTimeRange(), id: 1 }),
+      dashboard: createDashboardModelFixture({
+        time: {
+          from: defaultTimeRange.from.toISOString(),
+          to: defaultTimeRange.to.toISOString(),
+        },
+        id: 1,
+      }),
     };
   });
 
@@ -175,7 +183,7 @@ describe('when appUrl is set in the grafana config', () => {
   });
 
   it('should render the correct link', async () => {
-    const mockDashboard = new DashboardModel({
+    const mockDashboard = createDashboardModelFixture({
       uid: 'mockDashboardUid',
       id: 1,
     });

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/SharePublicDashboard.test.tsx

@@ -8,11 +8,13 @@ import 'whatwg-fetch';
 import { BootData, DataQuery } from '@grafana/data/src';
 import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
 import { setEchoSrv } from '@grafana/runtime/src';
+import { Panel } from '@grafana/schema';
 import config from 'app/core/config';
 import { backendSrv } from 'app/core/services/backend_srv';
 import { contextSrv } from 'app/core/services/context_srv';
 import { Echo } from 'app/core/services/echo/Echo';
 import { DashboardModel, PanelModel } from 'app/features/dashboard/state';
+import { createDashboardModelFixture } from 'app/features/dashboard/state/__fixtures__/dashboardFixtures';
 import { configureStore } from 'app/store/configureStore';
 
 import { ShareModal } from '../ShareModal';
@@ -71,7 +73,7 @@ beforeAll(() => {
 
 beforeEach(() => {
   config.featureToggles.publicDashboards = true;
-  mockDashboard = new DashboardModel({
+  mockDashboard = createDashboardModelFixture({
     uid: 'mockDashboardUid',
   });
 
@@ -203,8 +205,8 @@ describe('SharePublic - New config setup', () => {
           datasource: { type: 'notSupportedDatasource', uid: 'abc123' },
         } as DataQuery,
       ] as DataQuery[],
-    } as PanelModel;
-    const dashboard = new DashboardModel({
+    } as unknown as Panel;
+    const dashboard = createDashboardModelFixture({
       id: 1,
       panels: [panelModel],
     });

public/app/features/dashboard/components/VersionHistory/HistorySrv.test.ts

@@ -1,4 +1,5 @@
 import { DashboardModel } from '../../state/DashboardModel';
+import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures';
 
 import { HistorySrv } from './HistorySrv';
 import { restore, versions } from './__mocks__/dashboardHistoryMocks';
@@ -25,8 +26,8 @@ describe('historySrv', () => {
 
   let historySrv = new HistorySrv();
 
-  const dash = new DashboardModel({ uid: '_U4zObQMz' });
-  const emptyDash = new DashboardModel({});
+  const dash = createDashboardModelFixture({ uid: '_U4zObQMz' });
+  const emptyDash = createDashboardModelFixture();
   const historyListOpts = { limit: 10, start: 0 };
 
   beforeEach(() => {