mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 09:19:04 -04:00
getting a new layout class in and tests
This commit is contained in:
Shelby Sturgis
parent
c2ee82b475
commit
ae7ef90f0a
14 changed files with 426 additions and 47 deletions
|
|
@ -1,37 +0,0 @@
|
|||
define(function (require) {
|
||||
return function ZeroInjectionWrapperUtilService(Private) {
|
||||
var _ = require('lodash');
|
||||
|
||||
var injectZeros = Private(require('components/vislib/components/_functions/zero_injection/inject_zeros'));
|
||||
|
||||
return function (obj) {
|
||||
var arr;
|
||||
|
||||
// rows or columns
|
||||
if (!obj.series) {
|
||||
arr = obj.rows ? obj.rows : obj.columns;
|
||||
|
||||
var flatArray = _.chain(arr)
|
||||
.pluck('series')
|
||||
.flatten()
|
||||
.value();
|
||||
console.log('flatArray', flatArray);
|
||||
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
arr[i].series = injectZeros(arr[i].series, arr[i].ordered);
|
||||
}
|
||||
}
|
||||
|
||||
// series
|
||||
arr = injectZeros(arr, obj.ordered);
|
||||
|
||||
// obj.rows or obj.cols
|
||||
obj.series = injectZeros(obj.series, obj.ordered);
|
||||
|
||||
console.log(obj);
|
||||
return obj;
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
});
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
define(function () {
|
||||
return function XAxisFactory(d3) {
|
||||
return function XAxisSplitFactory(d3) {
|
||||
return function (selection) {
|
||||
selection.each(function () {
|
||||
var div = d3.select(this);
|
||||
|
|
|
|||
|
|
@ -99,8 +99,8 @@ define(function (require) {
|
|||
});
|
||||
};
|
||||
|
||||
Handler.prototype.removeAll = function (elem) {
|
||||
return d3.select(elem).selectAll('*').remove();
|
||||
Handler.prototype.removeAll = function (el) {
|
||||
return d3.select(el).selectAll('*').remove();
|
||||
};
|
||||
|
||||
Handler.prototype.error = function (message) {
|
||||
|
|
|
|||
|
|
@ -76,12 +76,12 @@ define(function (require) {
|
|||
};
|
||||
|
||||
// Appends a `type` of DOM element to `el` and gives it a class attribute `elClass`
|
||||
Layout.prototype.appendElem = function (el, type, elClass) {
|
||||
if (!el || !type || !elClass) {
|
||||
Layout.prototype.appendElem = function (el, type, className) {
|
||||
if (!el || !type || !className) {
|
||||
throw new Error('Function requires that an el, type, and class be provided');
|
||||
}
|
||||
return d3.select(el).append(type)
|
||||
.attr('class', elClass);
|
||||
.attr('class', className);
|
||||
};
|
||||
|
||||
// Removes all DOM elements from `el`
|
||||
|
|
|
|||
|
|
@ -88,10 +88,14 @@
|
|||
'specs/vislib/zero_injection',
|
||||
'specs/vislib/labels',
|
||||
'specs/vislib/d3functions',
|
||||
'specs/vislib/xAxis',
|
||||
'specs/vislib/yAxis',
|
||||
'specs/vislib/axisTitle',
|
||||
'specs/vislib/chartTitle',
|
||||
'specs/vislib/x_axis',
|
||||
'specs/vislib/y_axis',
|
||||
'specs/vislib/axis_title',
|
||||
'specs/vislib/chart_title',
|
||||
'specs/vislib/layout_types',
|
||||
'specs/vislib/vis_types',
|
||||
'specs/vislib/splits',
|
||||
'specs/vislib/column_layout',
|
||||
'specs/utils/diff_time_picker_vals',
|
||||
'specs/factories/events',
|
||||
'specs/index_patterns/_flatten_search_response',
|
||||
|
|
|
|||
96
test/unit/specs/vislib/column_layout.js
Normal file
96
test/unit/specs/vislib/column_layout.js
Normal file
|
|
@ -0,0 +1,96 @@
|
|||
define(function (require) {
|
||||
var angular = require('angular');
|
||||
var _ = require('lodash');
|
||||
|
||||
angular.module('ColumnLayoutFactory', ['kibana']);
|
||||
|
||||
describe('Vislib Column Layout Test Suite', function () {
|
||||
var layoutType;
|
||||
var columnLayout;
|
||||
var el;
|
||||
var data = {
|
||||
hits: 621,
|
||||
label: '',
|
||||
ordered: {
|
||||
date: true,
|
||||
interval: 30000,
|
||||
max: 1408734982458,
|
||||
min: 1408734082458
|
||||
},
|
||||
series: [
|
||||
{
|
||||
values: [
|
||||
{
|
||||
x: 1408734060000,
|
||||
y: 8
|
||||
},
|
||||
{
|
||||
x: 1408734090000,
|
||||
y: 23
|
||||
},
|
||||
{
|
||||
x: 1408734120000,
|
||||
y: 30
|
||||
},
|
||||
{
|
||||
x: 1408734150000,
|
||||
y: 28
|
||||
},
|
||||
{
|
||||
x: 1408734180000,
|
||||
y: 36
|
||||
},
|
||||
{
|
||||
x: 1408734210000,
|
||||
y: 30
|
||||
},
|
||||
{
|
||||
x: 1408734240000,
|
||||
y: 26
|
||||
},
|
||||
{
|
||||
x: 1408734270000,
|
||||
y: 22
|
||||
},
|
||||
{
|
||||
x: 1408734300000,
|
||||
y: 29
|
||||
},
|
||||
{
|
||||
x: 1408734330000,
|
||||
y: 24
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
xAxisLabel: 'Date Histogram',
|
||||
yAxisLabel: 'Count'
|
||||
};
|
||||
|
||||
beforeEach(function () {
|
||||
module('ColumnLayoutFactory');
|
||||
});
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3, Private) {
|
||||
layoutType = Private(require('components/vislib/layout_types'));
|
||||
el = d3.select('body').append('div').attr('class', 'visualization');
|
||||
columnLayout = layoutType.histogram(el, data);
|
||||
});
|
||||
});
|
||||
|
||||
afterEach(function () {
|
||||
el.remove();
|
||||
});
|
||||
|
||||
it('should return an array of objects', function () {
|
||||
expect(_.isArray(columnLayout)).to.be(true);
|
||||
expect(_.isObject(columnLayout[0])).to.be(true);
|
||||
});
|
||||
|
||||
it('should throw an error when the wrong number or no arguments provided', function () {
|
||||
expect(function () { layoutType.histogram(el); }).to.throwError();
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
31
test/unit/specs/vislib/layout_types.js
Normal file
31
test/unit/specs/vislib/layout_types.js
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
define(function (require) {
|
||||
var angular = require('angular');
|
||||
var _ = require('lodash');
|
||||
|
||||
angular.module('LayoutTypeFactory', ['kibana']);
|
||||
|
||||
describe('Vislib Layout Types Test Suite', function () {
|
||||
var layoutType;
|
||||
var layoutFunc;
|
||||
|
||||
beforeEach(function () {
|
||||
module('LayoutTypeFactory');
|
||||
});
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3, Private) {
|
||||
layoutType = Private(require('components/vislib/layout_types'));
|
||||
layoutFunc = layoutType.histogram;
|
||||
});
|
||||
});
|
||||
|
||||
it('should be an object', function () {
|
||||
expect(_.isObject(layoutType)).to.be(true);
|
||||
});
|
||||
|
||||
it('should return a function', function () {
|
||||
expect(typeof layoutFunc).to.be('function');
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
254
test/unit/specs/vislib/splits.js
Normal file
254
test/unit/specs/vislib/splits.js
Normal file
|
|
@ -0,0 +1,254 @@
|
|||
define(function (require) {
|
||||
var angular = require('angular');
|
||||
var _ = require('lodash');
|
||||
var $ = require('jquery');
|
||||
|
||||
angular.module('ChartSplitFactory', ['kibana']);
|
||||
angular.module('ChartTitleSplitFactory', ['kibana']);
|
||||
angular.module('XAxisSplitFactory', ['kibana']);
|
||||
angular.module('YAxisSplitFactory', ['kibana']);
|
||||
|
||||
describe('Vislib Split Function Test Suite', function () {
|
||||
var chartSplit;
|
||||
var chartTitleSplit;
|
||||
var xAxisSplit;
|
||||
var yAxisSplit;
|
||||
var el;
|
||||
var data = {
|
||||
rows : [
|
||||
{
|
||||
hits: 621,
|
||||
label: '',
|
||||
ordered: {
|
||||
date: true,
|
||||
interval: 30000,
|
||||
max: 1408734982458,
|
||||
min: 1408734082458
|
||||
},
|
||||
series: [
|
||||
{
|
||||
values: [
|
||||
{
|
||||
x: 1408734060000,
|
||||
y: 8
|
||||
},
|
||||
{
|
||||
x: 1408734090000,
|
||||
y: 23
|
||||
},
|
||||
{
|
||||
x: 1408734120000,
|
||||
y: 30
|
||||
},
|
||||
{
|
||||
x: 1408734150000,
|
||||
y: 28
|
||||
},
|
||||
{
|
||||
x: 1408734180000,
|
||||
y: 36
|
||||
},
|
||||
{
|
||||
x: 1408734210000,
|
||||
y: 30
|
||||
},
|
||||
{
|
||||
x: 1408734240000,
|
||||
y: 26
|
||||
},
|
||||
{
|
||||
x: 1408734270000,
|
||||
y: 22
|
||||
},
|
||||
{
|
||||
x: 1408734300000,
|
||||
y: 29
|
||||
},
|
||||
{
|
||||
x: 1408734330000,
|
||||
y: 24
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
xAxisLabel: 'Date Histogram',
|
||||
yAxisLabel: 'Count'
|
||||
},
|
||||
{
|
||||
hits: 621,
|
||||
label: '',
|
||||
ordered: {
|
||||
date: true,
|
||||
interval: 30000,
|
||||
max: 1408734982458,
|
||||
min: 1408734082458
|
||||
},
|
||||
series: [
|
||||
{
|
||||
values: [
|
||||
{
|
||||
x: 1408734060000,
|
||||
y: 8
|
||||
},
|
||||
{
|
||||
x: 1408734090000,
|
||||
y: 23
|
||||
},
|
||||
{
|
||||
x: 1408734120000,
|
||||
y: 30
|
||||
},
|
||||
{
|
||||
x: 1408734150000,
|
||||
y: 28
|
||||
},
|
||||
{
|
||||
x: 1408734180000,
|
||||
y: 36
|
||||
},
|
||||
{
|
||||
x: 1408734210000,
|
||||
y: 30
|
||||
},
|
||||
{
|
||||
x: 1408734240000,
|
||||
y: 26
|
||||
},
|
||||
{
|
||||
x: 1408734270000,
|
||||
y: 22
|
||||
},
|
||||
{
|
||||
x: 1408734300000,
|
||||
y: 29
|
||||
},
|
||||
{
|
||||
x: 1408734330000,
|
||||
y: 24
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
xAxisLabel: 'Date Histogram',
|
||||
yAxisLabel: 'Count'
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
beforeEach(function () {
|
||||
module('ChartSplitFactory');
|
||||
module('ChartTitleSplitFactory');
|
||||
module('XAxisSplitFactory');
|
||||
module('YAxisSplitFactory');
|
||||
});
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3, Private) {
|
||||
chartSplit = Private(require('components/vislib/components/layouts/splits/column_chart/chart_split'));
|
||||
chartTitleSplit = Private(require('components/vislib/components/layouts/splits/column_chart/chart_title_split'));
|
||||
xAxisSplit = Private(require('components/vislib/components/layouts/splits/column_chart/x_axis_split'));
|
||||
yAxisSplit = Private(require('components/vislib/components/layouts/splits/column_chart/y_axis_split'));
|
||||
|
||||
el = d3.select('body').append('div')
|
||||
.attr('class', 'visualization')
|
||||
.datum(data);
|
||||
});
|
||||
});
|
||||
|
||||
afterEach(function () {
|
||||
el.remove();
|
||||
});
|
||||
|
||||
describe('chart split function', function () {
|
||||
var fixture;
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3) {
|
||||
fixture = d3.select('.visualization').call(chartSplit);
|
||||
});
|
||||
});
|
||||
|
||||
it('should append the correct number of divs', function () {
|
||||
expect($('.chart').length).to.be(2);
|
||||
});
|
||||
|
||||
it('should add the correct class name', function () {
|
||||
expect(!!$('.chart-wrapper-row').length).to.be(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('chart title split function', function () {
|
||||
var newEl;
|
||||
var fixture;
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3) {
|
||||
el.append('div').attr('class', 'x-axis-chart-title');
|
||||
el.append('div').attr('class', 'y-axis-chart-title');
|
||||
d3.select('.x-axis-chart-title').call(chartTitleSplit);
|
||||
d3.select('.y-axis-chart-title').call(chartTitleSplit);
|
||||
|
||||
newEl = d3.select('body').append('div')
|
||||
.attr('class', 'series')
|
||||
.datum({ series: []});
|
||||
newEl.append('div').attr('class', 'x-axis-chart-title');
|
||||
newEl.append('div').attr('class', 'y-axis-chart-title');
|
||||
newEl.select('.x-axis-chart-title').call(chartTitleSplit);
|
||||
newEl.select('.y-axis-chart-title').call(chartTitleSplit);
|
||||
fixture = newEl.selectAll(this.childNodes)[0].length;
|
||||
});
|
||||
});
|
||||
|
||||
it('should append the correct number of divs', function () {
|
||||
expect($('.chart-title').length).to.be(2);
|
||||
});
|
||||
|
||||
it('should remove the correct div', function () {
|
||||
expect($('.y-axis-chart-title').length).to.be(1);
|
||||
expect($('.x-axis-chart-title').length).to.be(0);
|
||||
});
|
||||
|
||||
it('should remove all chart title divs when only one chart is rendered', function () {
|
||||
expect(fixture).to.be(0);
|
||||
});
|
||||
});
|
||||
|
||||
describe('x axis split function', function () {
|
||||
var fixture;
|
||||
var divs;
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3) {
|
||||
fixture = d3.select('body').append('div')
|
||||
.attr('class', 'columns')
|
||||
.datum({ columns: [{}, {}] });
|
||||
d3.select('.columns').call(xAxisSplit);
|
||||
divs = d3.selectAll('.x-axis-div')[0];
|
||||
});
|
||||
});
|
||||
|
||||
it('should append the correct number of divs', function () {
|
||||
expect(divs.length).to.be(2);
|
||||
});
|
||||
});
|
||||
|
||||
describe('y axis split function', function () {
|
||||
var fixture;
|
||||
var divs;
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3) {
|
||||
fixture = d3.select('body').append('div')
|
||||
.attr('class', 'rows')
|
||||
.datum({ rows: [{}, {}] });
|
||||
d3.select('.rows').call(yAxisSplit);
|
||||
divs = d3.selectAll('.y-axis-div')[0];
|
||||
});
|
||||
});
|
||||
|
||||
it('should append the correct number of divs', function () {
|
||||
expect(divs.length).to.be(2);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
31
test/unit/specs/vislib/vis_types.js
Normal file
31
test/unit/specs/vislib/vis_types.js
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
define(function (require) {
|
||||
var angular = require('angular');
|
||||
var _ = require('lodash');
|
||||
|
||||
angular.module('VisTypeFactory', ['kibana']);
|
||||
|
||||
describe('Vislib Vis Types Test Suite', function () {
|
||||
var visTypes;
|
||||
var visFunc;
|
||||
|
||||
beforeEach(function () {
|
||||
module('VisTypeFactory');
|
||||
});
|
||||
|
||||
beforeEach(function () {
|
||||
inject(function (d3, Private) {
|
||||
visTypes = Private(require('components/vislib/vis_types'));
|
||||
visFunc = visTypes.histogram;
|
||||
});
|
||||
});
|
||||
|
||||
it('should be an object', function () {
|
||||
expect(_.isObject(visTypes)).to.be(true);
|
||||
});
|
||||
|
||||
it('should return a function', function () {
|
||||
expect(typeof visFunc).to.be('function');
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue