diff --git a/public/app/plugins/datasource/loki/querybuilder/operations.ts b/public/app/plugins/datasource/loki/querybuilder/operations.ts
index b0c7f481406..31cf3aca86c 100644
--- a/public/app/plugins/datasource/loki/querybuilder/operations.ts
+++ b/public/app/plugins/datasource/loki/querybuilder/operations.ts
@@ -202,6 +202,7 @@ export function getOperationDefinitions(): QueryBuilderOperationDef[] {
placeholder: 'Text to find',
description: 'Find log lines that contains this text',
minWidth: 20,
+ runQueryOnEnter: true,
},
],
defaultParams: [''],
@@ -223,6 +224,7 @@ export function getOperationDefinitions(): QueryBuilderOperationDef[] {
placeholder: 'Text to exclude',
description: 'Find log lines that does not contain this text',
minWidth: 26,
+ runQueryOnEnter: true,
},
],
defaultParams: [''],
@@ -244,6 +246,7 @@ export function getOperationDefinitions(): QueryBuilderOperationDef[] {
placeholder: 'Pattern to match',
description: 'Find log lines that match this regex pattern',
minWidth: 30,
+ runQueryOnEnter: true,
},
],
defaultParams: [''],
@@ -265,6 +268,7 @@ export function getOperationDefinitions(): QueryBuilderOperationDef[] {
placeholder: 'Pattern to exclude',
description: 'Find log lines that does not match this regex pattern',
minWidth: 30,
+ runQueryOnEnter: true,
},
],
defaultParams: [''],
diff --git a/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.test.tsx b/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.test.tsx
index 1bd9458fb50..031192b7cfc 100644
--- a/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.test.tsx
+++ b/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.test.tsx
@@ -49,4 +49,52 @@ describe('AutoSizeInput', () => {
fireEvent.change(input, { target: { value: 'very very long value' } });
expect(getComputedStyle(inputWrapper).width).toBe('304px');
});
+
+ it('should call onBlur if set when blurring', () => {
+ const onBlur = jest.fn();
+ const onCommitChange = jest.fn();
+ render();
+
+ const input: HTMLInputElement = screen.getByTestId('autosize-input');
+
+ fireEvent.blur(input);
+
+ expect(onBlur).toHaveBeenCalled();
+ expect(onCommitChange).not.toHaveBeenCalled();
+ });
+
+ it('should call onCommitChange if not set when blurring', () => {
+ const onCommitChange = jest.fn();
+ render();
+
+ const input: HTMLInputElement = screen.getByTestId('autosize-input');
+
+ fireEvent.blur(input);
+
+ expect(onCommitChange).toHaveBeenCalled();
+ });
+
+ it('should call onKeyDown if set when keydown', () => {
+ const onKeyDown = jest.fn();
+ const onCommitChange = jest.fn();
+ render();
+
+ const input: HTMLInputElement = screen.getByTestId('autosize-input');
+
+ fireEvent.keyDown(input, { key: 'Enter' });
+
+ expect(onKeyDown).toHaveBeenCalled();
+ expect(onCommitChange).not.toHaveBeenCalled();
+ });
+
+ it('should call onCommitChange if not set when keydown', () => {
+ const onCommitChange = jest.fn();
+ render();
+
+ const input: HTMLInputElement = screen.getByTestId('autosize-input');
+
+ fireEvent.keyDown(input, { key: 'Enter' });
+
+ expect(onCommitChange).toHaveBeenCalled();
+ });
});
diff --git a/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.tsx b/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.tsx
index a81e3c91010..639dcc8a781 100644
--- a/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.tsx
+++ b/public/app/plugins/datasource/prometheus/querybuilder/shared/AutoSizeInput.tsx
@@ -30,19 +30,17 @@ export const AutoSizeInput = React.forwardRef((props, r
}}
width={inputWidth}
onBlur={(event) => {
- if (onCommitChange) {
- onCommitChange(event);
- }
if (onBlur) {
onBlur(event);
+ } else if (onCommitChange) {
+ onCommitChange(event);
}
}}
onKeyDown={(event) => {
- if (event.key === 'Enter' && onCommitChange) {
- onCommitChange(event);
- }
if (onKeyDown) {
onKeyDown(event);
+ } else if (event.key === 'Enter' && onCommitChange) {
+ onCommitChange(event);
}
}}
data-testid={'autosize-input'}
diff --git a/public/app/plugins/datasource/prometheus/querybuilder/shared/OperationParamEditor.tsx b/public/app/plugins/datasource/prometheus/querybuilder/shared/OperationParamEditor.tsx
index 2ebe1431e34..0c375360522 100644
--- a/public/app/plugins/datasource/prometheus/querybuilder/shared/OperationParamEditor.tsx
+++ b/public/app/plugins/datasource/prometheus/querybuilder/shared/OperationParamEditor.tsx
@@ -39,6 +39,9 @@ function SimpleInputParamEditor(props: QueryBuilderOperationParamEditorProps) {
title={props.paramDef.description}
onCommitChange={(evt) => {
props.onChange(props.index, evt.currentTarget.value);
+ if (props.paramDef.runQueryOnEnter && evt.type === 'keydown') {
+ props.onRunQuery();
+ }
}}
/>
);
diff --git a/public/app/plugins/datasource/prometheus/querybuilder/shared/types.ts b/public/app/plugins/datasource/prometheus/querybuilder/shared/types.ts
index 1b79b22a5a3..8839158c50f 100644
--- a/public/app/plugins/datasource/prometheus/querybuilder/shared/types.ts
+++ b/public/app/plugins/datasource/prometheus/querybuilder/shared/types.ts
@@ -70,6 +70,7 @@ export interface QueryBuilderOperationParamDef {
description?: string;
minWidth?: number;
editor?: ComponentType;
+ runQueryOnEnter?: boolean;
}
export interface QueryBuilderOperationEditorProps {