Fix/add default props to prom query editor (#21908)

* Plugins: Add default query to PromQueryEditor

* Plugins: Update PromQueryEditor snapshot

* Plugins: Use Partial for default PromQuery

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

@@ -37,7 +37,9 @@ export class PromQueryEditor extends PureComponent<Props, State> {
 
   constructor(props: Props) {
     super(props);
-    const { query } = props;
+    // Use default query to prevent undefined input values
+    const defaultQuery: Partial<PromQuery> = { expr: '', legendFormat: '', interval: '' };
+    const query = Object.assign({}, defaultQuery, props.query);
     this.query = query;
     // Query target properties that are fully controlled inputs
     this.state = {

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=""
       />
     </div>
     <div
@@ -62,7 +63,9 @@ exports[`Render PromQueryEditor with basic options should render 1`] = `
         className="gf-form-input width-8"
         onBlur={[Function]}
         onChange={[Function]}
+        placeholder=""
         type="text"
+        value=""
       />
     </div>
     <div
@@ -205,6 +208,8 @@ exports[`Render PromQueryEditor with basic options should render 1`] = `
           query={
             Object {
               "expr": "",
+              "interval": "",
+              "legendFormat": "",
               "refId": "A",
             }
           }