diff --git a/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx b/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx index 91c1c98e317..c2a614a3552 100644 --- a/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx +++ b/public/app/plugins/datasource/prometheus/components/PromQueryEditor.tsx @@ -37,7 +37,9 @@ export class PromQueryEditor extends PureComponent { constructor(props: Props) { super(props); - const { query } = props; + // Use default query to prevent undefined input values + const defaultQuery: Partial = { expr: '', legendFormat: '', interval: '' }; + const query = Object.assign({}, defaultQuery, props.query); this.query = query; // Query target properties that are fully controlled inputs this.state = { diff --git a/public/app/plugins/datasource/prometheus/components/__snapshots__/PromQueryEditor.test.tsx.snap b/public/app/plugins/datasource/prometheus/components/__snapshots__/PromQueryEditor.test.tsx.snap index 9723b983c4d..1f9d676b29c 100644 --- a/public/app/plugins/datasource/prometheus/components/__snapshots__/PromQueryEditor.test.tsx.snap +++ b/public/app/plugins/datasource/prometheus/components/__snapshots__/PromQueryEditor.test.tsx.snap @@ -38,6 +38,7 @@ exports[`Render PromQueryEditor with basic options should render 1`] = ` onChange={[Function]} placeholder="legend format" type="text" + value="" />