created test for graph disclaimer

public/app/features/explore/Graph.test.tsx

@@ -0,0 +1,60 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import Graph from './Graph';
+import { mockData } from './__mocks__/mockData';
+
+const setup = (propOverrides?: object) => {
+  const props = Object.assign(
+    {
+      data: mockData().slice(0, 19),
+      options: {
+        interval: '20s',
+        range: { from: 'now-6h', to: 'now' },
+        targets: [
+          {
+            format: 'time_series',
+            instant: false,
+            hinting: true,
+            expr: 'prometheus_http_request_duration_seconds_bucket',
+          },
+        ],
+      },
+    },
+    propOverrides
+  );
+
+  // Enzyme.shallow did not work well with jquery.flop. Mocking the draw function.
+  Graph.prototype.draw = jest.fn();
+
+  const wrapper = shallow(<Graph {...props} />);
+  const instance = wrapper.instance() as Graph;
+
+  return {
+    wrapper,
+    instance,
+  };
+};
+
+describe('Render', () => {
+  it('should render component', () => {
+    const { wrapper } = setup();
+
+    expect(wrapper).toMatchSnapshot();
+  });
+
+  it('should render component with disclaimer', () => {
+    const { wrapper } = setup({
+      data: mockData(),
+    });
+
+    expect(wrapper).toMatchSnapshot();
+  });
+
+  it('should show query return no time series', () => {
+    const { wrapper } = setup({
+      data: [],
+    });
+
+    expect(wrapper).toMatchSnapshot();
+  });
+});

public/app/features/explore/__mocks__/mockData.ts

@@ -0,0 +1,274 @@
+export const mockData = () => {
+  return [
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '+Inf',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.1',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.2',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.4',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '1',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '120',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '20',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '3',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '60',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/label/:name/values',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '8',
+      },
+      values: [[1537858100, '16'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '+Inf',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.1',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.4',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '1',
+      },
+      values: [[1537847900, '953'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '120',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '20',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '3',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '60',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/metrics',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '8',
+      },
+      values: [[1537858060, '1195'], [1537858080, '1195'], [1537858100, '1195']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '+Inf',
+      },
+      values: [[1537858100, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.1',
+      },
+      values: [[1537858100, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.2',
+      },
+      values: [[1537858100, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '0.4',
+      },
+      values: [[1537858100, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '1',
+      },
+      values: [[1537858100, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '120',
+      },
+      values: [[1537858100, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '20',
+      },
+      values: [[1537858100, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+    {
+      metric: {
+        __name__: 'prometheus_http_request_duration_seconds_bucket',
+        handler: '/query',
+        instance: 'localhost:9090',
+        job: 'prometheus',
+        le: '3',
+      },
+      values: [[1537857260, '55'], [1537861960, '1'], [1537861980, '1']],
+    },
+  ];
+};

public/app/features/explore/__snapshots__/Graph.test.tsx.snap

@@ -0,0 +1,971 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Render should render component 1`] = `
+<div>
+  <div
+    className="panel-container"
+  >
+    <div
+      className="explore-graph"
+      style={
+        Object {
+          "height": undefined,
+        }
+      }
+    />
+    <Legend
+      data={
+        Array [
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "+Inf",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.1",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.2",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.4",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "1",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "120",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "20",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "3",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "60",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "8",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "+Inf",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.1",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.4",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "1",
+            },
+            "values": Array [
+              Array [
+                1537847900,
+                "953",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "120",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "20",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "3",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "60",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "8",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+        ]
+      }
+    />
+  </div>
+</div>
+`;
+
+exports[`Render should render component with disclaimer 1`] = `
+<div>
+  <div
+    className="time-series-disclaimer"
+  >
+    <i
+      className="fa fa-fw fa-warning disclaimer-icon"
+    />
+    Showing only 20 time series.
+     
+    <span
+      className="show-all-time-series"
+      onClick={[Function]}
+    >
+      Show all 27
+    </span>
+  </div>
+  <div
+    className="panel-container"
+  >
+    <div
+      className="explore-graph"
+      style={
+        Object {
+          "height": undefined,
+        }
+      }
+    />
+    <Legend
+      data={
+        Array [
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "+Inf",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.1",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.2",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.4",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "1",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "120",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "20",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "3",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "60",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/label/:name/values",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "8",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "16",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "+Inf",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.1",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "0.4",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "1",
+            },
+            "values": Array [
+              Array [
+                1537847900,
+                "953",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "120",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "20",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "3",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "60",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/metrics",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "8",
+            },
+            "values": Array [
+              Array [
+                1537858060,
+                "1195",
+              ],
+              Array [
+                1537858080,
+                "1195",
+              ],
+              Array [
+                1537858100,
+                "1195",
+              ],
+            ],
+          },
+          Object {
+            "metric": Object {
+              "__name__": "prometheus_http_request_duration_seconds_bucket",
+              "handler": "/query",
+              "instance": "localhost:9090",
+              "job": "prometheus",
+              "le": "+Inf",
+            },
+            "values": Array [
+              Array [
+                1537858100,
+                "55",
+              ],
+              Array [
+                1537861960,
+                "1",
+              ],
+              Array [
+                1537861980,
+                "1",
+              ],
+            ],
+          },
+        ]
+      }
+    />
+  </div>
+</div>
+`;
+
+exports[`Render should show query return no time series 1`] = `
+<div
+  className="panel-container"
+>
+  <div
+    className="muted m-a-1"
+  >
+    The queries returned no time series to graph.
+  </div>
+</div>
+`;