chronograf/ui/spec/utils/timeSeriesToDygraphSpec.js

398 lines
8.6 KiB
JavaScript
Raw Normal View History

import timeSeriesToDygraph from 'src/utils/timeSeriesToDygraph';
2016-12-14 20:22:08 +00:00
import {STROKE_WIDTH} from 'src/shared/constants';
const {light: strokeWidth} = STROKE_WIDTH;
describe('timeSeriesToDygraph', () => {
it('parses a raw InfluxDB response into a dygraph friendly data format', () => {
const influxResponse = [
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f1"],
"values": [[1000, 1],[2000, 2]],
},
]
},
{
"series": [
{
"name":"m1",
"columns": ["time","f2"],
"values": [[2000, 3],[4000, 4]],
},
]
},
],
},
}
];
// dygraphSeries: {
// 'm1.f1': {
// axis: 'y',
// strokeWidth,
// },
// 'm1.f2': {
// axis: 'y',
// strokeWidth,
// },
// },
const actual = timeSeriesToDygraph(influxResponse);
const expected = {
labels: [
'time',
`m1.f1`,
`m1.f2`,
],
timeSeries: [
[new Date(1000), 1, null],
[new Date(2000), 2, 3],
[new Date(4000), null, 4],
],
};
expect(actual).to.deep.equal(expected);
});
it('can sort numerical timestamps correctly', () => {
const influxResponse = [
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f1"],
"values": [[100, 1],[3000, 3],[200, 2]],
},
]
},
],
},
}
];
const actual = timeSeriesToDygraph(influxResponse);
const expected = {
labels: [
'time',
'm1.f1',
],
timeSeries: [
[new Date(100), 1],
[new Date(200), 2],
[new Date(3000), 3],
],
};
2016-11-28 20:53:03 +00:00
expect(actual.timeSeries).to.deep.equal(expected.timeSeries);
});
it('can parse multiple responses into two axes', () => {
const influxResponse = [
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f1"],
"values": [[1000, 1],[2000, 2]],
},
]
},
{
"series": [
{
"name":"m1",
"columns": ["time","f2"],
"values": [[2000, 3],[4000, 4]],
},
]
},
],
},
},
{
"response":
{
"results": [
{
"series": [
{
"name":"m3",
"columns": ["time","f3"],
"values": [[1000, 1],[2000, 2]],
},
]
},
],
},
},
];
const actual = timeSeriesToDygraph(influxResponse);
2017-01-05 23:47:37 +00:00
const expected = {
'm1.f1': {
axis: 'y',
strokeWidth,
},
'm1.f2': {
axis: 'y',
strokeWidth,
},
'm3.f3': {
axis: 'y2',
strokeWidth,
},
};
expect(actual.dygraphSeries).to.deep.equal(expected);
});
it('can parse multiple responses with the same field and measurement', () => {
const influxResponse = [
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f1"],
"values": [[1000, 1],[2000, 2]],
},
]
},
],
},
},
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f1"],
"values": [[2000, 3],[4000, 4]],
},
]
},
],
},
},
];
const actual = timeSeriesToDygraph(influxResponse);
// dygraphSeries: {
// 'm1.f1': {
// axis: 'y',
// strokeWidth,
// },
// 'm1.f1-1': {
// axis: 'y2',
// strokeWidth,
// },
// },
2017-01-05 23:47:37 +00:00
2016-11-28 20:53:03 +00:00
const expected = {
labels: [
2016-11-28 20:53:03 +00:00
'time',
`m1.f1`,
`m1.f1`,
2016-11-28 20:53:03 +00:00
],
timeSeries: [
2017-01-05 23:47:37 +00:00
[new Date(1000), 1, null],
[new Date(2000), 2, 3],
[new Date(4000), null, 4],
2016-11-28 20:53:03 +00:00
],
};
2017-01-05 23:47:37 +00:00
expect(actual).to.deep.equal(expected);
});
it('it does not use multiple axes if being used for the DataExplorer', () => {
const influxResponse = [
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f1"],
"values": [[1000, 1],[2000, 2]],
},
]
},
],
},
},
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f2"],
"values": [[2000, 3],[4000, 4]],
},
]
},
],
},
},
];
const isInDataExplorer = true;
const actual = timeSeriesToDygraph(influxResponse, undefined, isInDataExplorer);
const expected = {
'm1.f1': {
strokeWidth,
},
'm1.f2': {
strokeWidth,
},
};
expect(actual.dygraphSeries).to.deep.equal(expected);
});
it('it highlights the appropriate response', () => {
const influxResponse = [
{
"response":
{
"results": [
{
"series": [
{
"name":"m1",
"columns": ["time","f1"],
"values": [[1000, 1],[2000, 2]],
},
]
},
],
},
},
{
"response":
{
"results": [
{
"series": [
{
"name":"m2",
"columns": ["time","f2"],
"values": [[2000, 3],[4000, 4]],
},
]
},
],
},
},
];
const highlightIndex = 1;
const actual = timeSeriesToDygraph(influxResponse, highlightIndex);
const {dygraphSeries} = actual;
expect(dygraphSeries["m2.f2"].strokeWidth).to.be.above(dygraphSeries["m1.f1"].strokeWidth);
});
2017-01-06 19:56:38 +00:00
it('parses labels alphabetically with the correct field values for multiple series', () => {
2017-01-06 19:56:38 +00:00
const influxResponse = [
{
"response":
{
"results": [
{
"series": [
{
"name":"mb",
"columns": ["time","fa"],
2017-01-24 00:08:45 +00:00
"values": [
[1000, 200],
[2000, 300],
[4000, 400],
],
},
{
"name":"mc",
"columns": ["time","fa"],
"values": [
[1000, 400],
[2000, 600],
[3000, 800],
[5000, 1000],
2017-01-24 00:08:45 +00:00
],
2017-01-06 19:56:38 +00:00
},
]
},
{
"series": [
{
"name":"ma",
2017-01-24 00:08:45 +00:00
"columns": ["time","fa","fc","fb"],
"values": [
[1000, 20, 10, 10],
[2000, 30, 15, 9],
[3000, 40, 20, 8],
2017-01-24 00:08:45 +00:00
],
2017-01-06 19:56:38 +00:00
},
]
},
],
},
}
];
const actual = timeSeriesToDygraph(influxResponse);
2017-01-24 00:08:45 +00:00
const expected = {
labels: [
'time',
`ma.fa`,
`ma.fb`,
`ma.fc`,
`mb.fa`,
`mc.fa`,
2017-01-24 00:08:45 +00:00
],
timeSeries: [
[new Date(1000), 20, 10, 10, 200, 400],
[new Date(2000), 30, 9, 15, 300, 600],
[new Date(3000), 40, 8, 20, null, 800],
[new Date(4000), null, null, null, 400, null],
[new Date(5000), null, null, null, null, 1000],
2017-01-24 00:08:45 +00:00
],
};
2017-01-06 19:56:38 +00:00
// console.log(actual.timeSeries);
2017-01-24 00:08:45 +00:00
expect(actual.labels).to.deep.equal(expected.labels);
expect(actual.timeSeries).to.deep.equal(expected.timeSeries);
2017-01-06 19:56:38 +00:00
});
});