Fix: Adds context to list of keys that are not part of query (#17423)

Fixes: #17408

public/app/core/utils/explore.test.ts

@@ -181,11 +181,11 @@ describe('updateHistory()', () => {
 
 describe('hasNonEmptyQuery', () => {
   test('should return true if one query is non-empty', () => {
-    expect(hasNonEmptyQuery([{ refId: '1', key: '2', expr: 'foo' }])).toBeTruthy();
+    expect(hasNonEmptyQuery([{ refId: '1', key: '2', context: 'explore', expr: 'foo' }])).toBeTruthy();
   });
 
   test('should return false if query is empty', () => {
-    expect(hasNonEmptyQuery([{ refId: '1', key: '2' }])).toBeFalsy();
+    expect(hasNonEmptyQuery([{ refId: '1', key: '2', context: 'panel' }])).toBeFalsy();
   });
 
   test('should return false if no queries exist', () => {

public/app/core/utils/explore.ts

@@ -303,17 +303,19 @@ export function ensureQueries(queries?: DataQuery[]): DataQuery[] {
 }
 
 /**
- * A target is non-empty when it has keys (with non-empty values) other than refId and key.
+ * A target is non-empty when it has keys (with non-empty values) other than refId, key and context.
  */
+const validKeys = ['refId', 'key', 'context'];
 export function hasNonEmptyQuery<TQuery extends DataQuery = any>(queries: TQuery[]): boolean {
   return (
     queries &&
-    queries.some(
-      query =>
-        Object.keys(query)
-          .map(k => query[k])
-          .filter(v => v).length > 2
-    )
+    queries.some(query => {
+      const keys = Object.keys(query)
+        .filter(key => validKeys.indexOf(key) === -1)
+        .map(k => query[k])
+        .filter(v => v);
+      return keys.length > 0;
+    })
   );
 }
 

public/app/plugins/datasource/prometheus/components/PromQueryField.tsx

@@ -13,7 +13,7 @@ import { TypeaheadOutput, HistoryItem } from 'app/types/explore';
 import { getNextCharacter, getPreviousCousin } from 'app/features/explore/utils/dom';
 import BracesPlugin from 'app/features/explore/slate-plugins/braces';
 import QueryField, { TypeaheadInput, QueryFieldState } from 'app/features/explore/QueryField';
-import { PromQuery } from '../types';
+import { PromQuery, PromContext } from '../types';
 import { CancelablePromise, makePromiseCancelable } from 'app/core/utils/CancelablePromise';
 import { DataSourceApi, ExploreQueryFieldProps, DataSourceStatus, QueryHint } from '@grafana/ui';
 
@@ -223,7 +223,7 @@ class PromQueryField extends React.PureComponent<PromQueryFieldProps, PromQueryF
     // Send text change to parent
     const { query, onChange, onRunQuery } = this.props;
     if (onChange) {
-      const nextQuery: PromQuery = { ...query, expr: value, context: 'explore' };
+      const nextQuery: PromQuery = { ...query, expr: value, context: PromContext.Explore };
       onChange(nextQuery);
 
       if (override && onRunQuery) {

public/app/plugins/datasource/prometheus/datasource.ts

@@ -2,6 +2,7 @@
 import _ from 'lodash';
 import $ from 'jquery';
 import { from, Observable } from 'rxjs';
+import { single, map, filter } from 'rxjs/operators';
 
 // Services & Utils
 import kbn from 'app/core/utils/kbn';
@@ -15,7 +16,7 @@ import { getQueryHints } from './query_hints';
 import { expandRecordingRules } from './language_utils';
 
 // Types
-import { PromQuery, PromOptions, PromQueryRequest } from './types';
+import { PromQuery, PromOptions, PromQueryRequest, PromContext } from './types';
 import {
   DataQueryRequest,
   DataSourceApi,
@@ -29,7 +30,6 @@ import { ExploreUrlState } from 'app/types/explore';
 import { safeStringifyValue } from 'app/core/utils/explore';
 import { TemplateSrv } from 'app/features/templating/template_srv';
 import { TimeSrv } from 'app/features/dashboard/services/TimeSrv';
-import { single, map, filter } from 'rxjs/operators';
 
 export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions> {
   type: string;
@@ -224,7 +224,7 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
         continue;
       }
 
-      if (target.context === 'explore') {
+      if (target.context === PromContext.Explore) {
         target.format = 'time_series';
         target.instant = false;
         const instantTarget: any = _.cloneDeep(target);
@@ -260,7 +260,10 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
       return this.$q.when({ data: [] }) as Promise<{ data: any }>;
     }
 
-    if (observer && options.targets.filter(target => target.context === 'explore').length === options.targets.length) {
+    if (
+      observer &&
+      options.targets.filter(target => target.context === PromContext.Explore).length === options.targets.length
+    ) {
       // using observer to make the instant query return immediately
       this.runObserverQueries(options, observer, queries, activeTargets, end);
       return this.$q.when({ data: [] }) as Promise<{ data: any }>;

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

 import { DataQuery, DataSourceJsonData } from '@grafana/ui/src/types';
 
+export enum PromContext {
+  Explore = 'explore',
+  Panel = 'panel',
+}
+
 export interface PromQuery extends DataQuery {
   expr: string;
-  context?: 'explore' | 'panel';
+  context?: PromContext;
   format?: string;
   instant?: boolean;
   hinting?: boolean;