Graphite: Fix drag and drop queries (#39130)

* Do not use "select metric" segment when rendering target

* Use better names for tests

public/app/plugins/datasource/graphite/graphite_query.ts

@@ -180,7 +180,7 @@ export default class GraphiteQuery {
     };
 
     if (!this.target.textEditor) {
-      const metricPath = this.getSegmentPathUpTo(this.segments.length).replace(/\.select metric$/, '');
+      const metricPath = this.getSegmentPathUpTo(this.segments.length).replace(/\.?select metric$/, '');
       this.target.target = reduce(this.functions, wrapFunction, metricPath);
     }
 

public/app/plugins/datasource/graphite/specs/graphite_query.test.ts

@@ -74,4 +74,25 @@ describe('Graphite query model', () => {
       expect(ctx.queryModel.functions[1].params[0]).toBe('$limit');
     });
   });
+
+  describe('when query is generated from segments', () => {
+    beforeEach(() => {
+      ctx.target = { refId: 'A', target: '' };
+      ctx.queryModel = new GraphiteQuery(ctx.datasource, ctx.target, ctx.templateSrv);
+    });
+
+    it('and no segments are selected then the query is empty', () => {
+      ctx.queryModel.segments = [{ value: 'select metric' }];
+      ctx.queryModel.updateModelTarget(ctx.targets);
+
+      expect(ctx.queryModel.target.target).toBe('');
+    });
+
+    it('and some segments are selected then segments without selected value are omitted', () => {
+      ctx.queryModel.segments = [{ value: 'foo' }, { value: 'bar' }, { value: 'select metric' }];
+      ctx.queryModel.updateModelTarget(ctx.targets);
+
+      expect(ctx.queryModel.target.target).toBe('foo.bar');
+    });
+  });
 });