TestData: Don't add query model for every testdata query scenario by default (#32388)

public/app/plugins/datasource/testdata/QueryEditor.test.tsx

@@ -4,6 +4,7 @@ import userEvent from '@testing-library/user-event';
 import { defaultQuery } from './constants';
 import { QueryEditor, Props } from './QueryEditor';
 import { scenarios } from './__mocks__/scenarios';
+import { defaultStreamQuery } from './runStreams';
 
 beforeEach(() => {
   jest.clearAllMocks();
@@ -67,9 +68,13 @@ describe('Test Datasource Query Editor', () => {
     await fireEvent.keyDown(select, { keyCode: 40 });
     await userEvent.click(screen.getByText('Streaming Client'));
     expect(mockOnChange).toHaveBeenCalledWith(
-      expect.objectContaining({ scenarioId: 'streaming_client', stringInput: '' })
+      expect.objectContaining({ scenarioId: 'streaming_client', stream: defaultStreamQuery })
     );
-    rerender(<QueryEditor {...props} query={{ ...defaultQuery, scenarioId: 'streaming_client', stringInput: '' }} />);
+
+    const streamQuery = { ...defaultQuery, stream: defaultStreamQuery, scenarioId: 'streaming_client' };
+
+    rerender(<QueryEditor {...props} query={streamQuery} />);
+
     expect(await screen.findByText('Streaming Client')).toBeInTheDocument();
     expect(screen.getByText('Type')).toBeInTheDocument();
     expect(screen.getByLabelText('Noise')).toHaveValue(2.2);

public/app/plugins/datasource/testdata/QueryEditor.tsx

@@ -13,9 +13,10 @@ import { TestDataDataSource } from './datasource';
 import { TestDataQuery, Scenario, NodesQuery } from './types';
 import { PredictablePulseEditor } from './components/PredictablePulseEditor';
 import { CSVWaveEditor } from './components/CSVWaveEditor';
-import { defaultQuery } from './constants';
+import { defaultCSVWaveQuery, defaultPulseQuery, defaultQuery } from './constants';
 import { GrafanaLiveEditor } from './components/GrafanaLiveEditor';
 import { NodeGraphEditor } from './components/NodeGraphEditor';
+import { defaultStreamQuery } from './runStreams';
 
 const showLabelsFor = ['random_walk', 'predictable_pulse', 'predictable_csv_wave'];
 const endpoints = [
@@ -58,20 +59,33 @@ export const QueryEditor = ({ query, datasource, onChange, onRunQuery }: Props)
       return;
     }
 
-    const update = { ...query, scenarioId: item.value! };
+    // Clear model from existing props that belong to other scenarios
+    const update: TestDataQuery = {
+      scenarioId: item.value!,
+      refId: query.refId,
+      alias: query.alias,
+    };
 
     if (scenario.stringInput) {
       update.stringInput = scenario.stringInput;
     }
 
-    if (scenario.id === 'grafana_api') {
-      update.stringInput = 'datasources';
-    } else if (scenario.id === 'streaming_client') {
-      update.stringInput = '';
-    } else if (scenario.id === 'live') {
-      if (!update.channel) {
+    switch (scenario.id) {
+      case 'grafana_api':
+        update.stringInput = 'datasources';
+        break;
+      case 'streaming_client':
+        update.stream = defaultStreamQuery;
+        break;
+      case 'live':
         update.channel = 'random-2s-stream'; // default stream
-      }
+        break;
+      case 'predictable_pulse':
+        update.pulseWave = defaultPulseQuery;
+        break;
+      case 'predictable_csv_wave':
+        update.csvWave = defaultCSVWaveQuery;
+        break;
     }
 
     onUpdate(update);

public/app/plugins/datasource/testdata/components/ManualEntryEditor.tsx

@@ -9,22 +9,24 @@ export interface Props extends EditorProps {
 }
 
 export const ManualEntryEditor = ({ onChange, query, onRunQuery }: Props) => {
+  const points = query.points ?? [];
+
   const addPoint = (point: NewPoint) => {
     const newPointTime = dateMath.parse(point.newPointTime);
-    const points = [...query.points, [Number(point.newPointValue), newPointTime!.valueOf()]].sort(
+    const pointsUpdated = [...points, [Number(point.newPointValue), newPointTime!.valueOf()]].sort(
       (a, b) => a[1] - b[1]
     );
-    onChange({ ...query, points });
+    onChange({ ...query, points: pointsUpdated });
     onRunQuery();
   };
 
   const deletePoint = (point: SelectableValue) => {
-    const points = query.points.filter((_, index) => index !== point.value);
-    onChange({ ...query, points });
+    const pointsUpdated = points.filter((_, index) => index !== point.value);
+    onChange({ ...query, points: pointsUpdated });
     onRunQuery();
   };
 
-  const points = query.points.map((point, index) => {
+  const pointOptions = points.map((point, index) => {
     return {
       label: dateTime(point[1]).format('MMMM Do YYYY, H:mm:ss') + ' : ' + point[0],
       value: index,
@@ -64,7 +66,7 @@ export const ManualEntryEditor = ({ onChange, query, onRunQuery }: Props) => {
               <InputControl
                 control={control}
                 as={Select}
-                options={points}
+                options={pointOptions}
                 width={32}
                 name="selectedPoint"
                 onChange={(value) => value[0]}

public/app/plugins/datasource/testdata/constants.ts

@@ -1,7 +1,6 @@
-import { defaultQuery as defaultStreamQuery } from './runStreams';
 import { TestDataQuery } from './types';
 
-export const defaultPulse: any = {
+export const defaultPulseQuery: any = {
   timeStep: 60,
   onCount: 3,
   onValue: 2,
@@ -9,19 +8,12 @@ export const defaultPulse: any = {
   offValue: 1,
 };
 
-export const defaultCSVWave: any = {
+export const defaultCSVWaveQuery: any = {
   timeStep: 60,
   valuesCSV: '0,0,2,2,1,1',
 };
 
 export const defaultQuery: TestDataQuery = {
-  points: [],
-  stream: defaultStreamQuery,
-  pulseWave: defaultPulse,
-  csvWave: defaultCSVWave,
-  stringInput: '',
   scenarioId: 'random_walk',
-  lines: 10,
   refId: '',
-  alias: '',
 };

public/app/plugins/datasource/testdata/datasource.ts

@@ -146,7 +146,7 @@ export class TestDataDataSource extends DataSourceWithBackend<TestDataQuery> {
   }
 
   variablesQuery(target: TestDataQuery, options: DataQueryRequest<TestDataQuery>): Observable<DataQueryResponse> {
-    const query = target.stringInput;
+    const query = target.stringInput ?? '';
     const interpolatedQuery = this.templateSrv.replace(
       query,
       getSearchFilterScopedVar({ query, wildcardChar: '*', options: options.scopedVars })

public/app/plugins/datasource/testdata/runStreams.ts

@@ -17,7 +17,7 @@ import {
 import { TestDataQuery, StreamingQuery } from './types';
 import { getRandomLine } from './LogIpsum';
 
-export const defaultQuery: StreamingQuery = {
+export const defaultStreamQuery: StreamingQuery = {
   type: 'signal',
   speed: 250, // ms
   spread: 3.5,
@@ -26,7 +26,7 @@ export const defaultQuery: StreamingQuery = {
 };
 
 export function runStream(target: TestDataQuery, req: DataQueryRequest<TestDataQuery>): Observable<DataQueryResponse> {
-  const query = defaults(target.stream, defaultQuery);
+  const query = defaults(target.stream, defaultStreamQuery);
   if ('signal' === query.type) {
     return runSignalStream(target, query, req);
   }

public/app/plugins/datasource/testdata/types.ts

@@ -17,11 +17,11 @@ export type Points = PointValue[][];
 export interface TestDataQuery extends DataQuery {
   alias?: string;
   scenarioId: string;
-  stringInput: string;
-  points: Points;
+  stringInput?: string;
+  points?: Points;
   stream?: StreamingQuery;
   pulseWave?: PulseWaveQuery;
-  csvWave: any;
+  csvWave?: any;
   labels?: string;
   lines?: number;
   levelColumn?: boolean;