mirror of
https://github.com/Combodo/iTop.git
synced 2026-04-23 02:28:44 +02:00
N°5621 Move C3 0.4.11 to NPM
This commit is contained in:
Pierre Goiffon
54
node_modules/c3/spec/api.axis-spec.js
generated
vendored
Normal file
54
node_modules/c3/spec/api.axis-spec.js
generated
vendored
Normal file
@@ -0,0 +1,54 @@
|
||||
describe('c3 api axis', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('axis.labels', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100],
|
||||
['data2', 50, 20, 10]
|
||||
],
|
||||
axes: {
|
||||
data1: 'y',
|
||||
data2: 'y2'
|
||||
}
|
||||
},
|
||||
axis: {
|
||||
y: {
|
||||
label: 'Y Axis Label'
|
||||
},
|
||||
y2: {
|
||||
show: true,
|
||||
label: 'Y2 Axis Label'
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should update y axis label', function () {
|
||||
chart.axis.labels({y: 'New Y Axis Label'});
|
||||
var label = d3.select('.c3-axis-y-label');
|
||||
expect(label.text()).toBe('New Y Axis Label');
|
||||
expect(label.attr('dx')).toBe('-0.5em');
|
||||
expect(label.attr('dy')).toBe('1.2em');
|
||||
});
|
||||
|
||||
it('should update y axis label', function () {
|
||||
chart.axis.labels({y2: 'New Y2 Axis Label'});
|
||||
var label = d3.select('.c3-axis-y2-label');
|
||||
expect(label.text()).toBe('New Y2 Axis Label');
|
||||
expect(label.attr('dx')).toBe('-0.5em');
|
||||
expect(label.attr('dy')).toBe('-0.5em');
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
201
node_modules/c3/spec/api.data-spec.js
generated
vendored
Normal file
201
node_modules/c3/spec/api.data-spec.js
generated
vendored
Normal file
@@ -0,0 +1,201 @@
|
||||
describe('c3 api data', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
|
||||
var args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 5000, 2000, 1000, 4000, 1500, 2500]
|
||||
],
|
||||
names: {
|
||||
data1: 'Data Name 1',
|
||||
data2: 'Data Name 2'
|
||||
},
|
||||
colors: {
|
||||
data1: '#FF0000',
|
||||
data2: '#00FF00'
|
||||
},
|
||||
axes: {
|
||||
data1: 'y',
|
||||
data2: 'y2'
|
||||
}
|
||||
},
|
||||
axis: {
|
||||
y2: {
|
||||
show: true
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
jasmine.addMatchers(customMatchers);
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('data()', function () {
|
||||
|
||||
it('should return all of data if no argument given', function () {
|
||||
var results = chart.data(),
|
||||
expected = ['data1', 'data2'];
|
||||
results.forEach(function (result, i) {
|
||||
expect(result.id).toBe(expected[i]);
|
||||
});
|
||||
});
|
||||
|
||||
it('should return specifid data if string argument given', function () {
|
||||
var results = chart.data('data1');
|
||||
expect(results.length).toBe(1);
|
||||
expect(results[0].id).toBe('data1');
|
||||
});
|
||||
|
||||
it('should return specifid data if array argument given', function () {
|
||||
var results = chart.data(['data1', 'data2']);
|
||||
expect(results.length).toBe(2);
|
||||
expect(results[0].id).toBe('data1');
|
||||
expect(results[1].id).toBe('data2');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('data.shown()', function () {
|
||||
|
||||
it('should return only shown targets', function () {
|
||||
var results;
|
||||
chart.hide('data1');
|
||||
results = chart.data.shown();
|
||||
expect(results.length).toBe(1);
|
||||
expect(results[0].id).toBe('data2');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('data.values()', function () {
|
||||
|
||||
it('should return values for specified target', function () {
|
||||
var values = chart.data.values('data1'),
|
||||
expectedValues = [30, 200, 100, 400, 150, 250];
|
||||
expect(values.length).toBe(6);
|
||||
values.forEach(function (v, i) {
|
||||
expect(v).toBe(expectedValues[i]);
|
||||
});
|
||||
});
|
||||
|
||||
it('should return null when no args', function () {
|
||||
var values = chart.data.values();
|
||||
expect(values).toBeNull();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('data.names()', function () {
|
||||
|
||||
it('should return data.names specified as argument', function () {
|
||||
var results = chart.data.names();
|
||||
expect(results.data1).toBe('Data Name 1');
|
||||
expect(results.data2).toBe('Data Name 2');
|
||||
});
|
||||
|
||||
it('should return data.names specified as api', function () {
|
||||
var results = chart.data.names({
|
||||
data1: 'New Data Name 1',
|
||||
data2: 'New Data Name 2'
|
||||
});
|
||||
expect(results.data1).toBe('New Data Name 1');
|
||||
expect(results.data2).toBe('New Data Name 2');
|
||||
});
|
||||
|
||||
it('should set data.names specified as api', function () {
|
||||
expect(d3.select('.c3-legend-item-data1 text').text()).toBe("New Data Name 1");
|
||||
expect(d3.select('.c3-legend-item-data2 text').text()).toBe("New Data Name 2");
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('data.colors()', function () {
|
||||
|
||||
it('should return data.colors specified as argument', function () {
|
||||
var results = chart.data.colors();
|
||||
expect(results.data1).toBeHexOrRGB('#FF0000');
|
||||
expect(results.data2).toBeHexOrRGB('#00FF00');
|
||||
});
|
||||
|
||||
it('should return data.colors specified as api', function () {
|
||||
var results = chart.data.colors({
|
||||
data1: '#00FF00',
|
||||
data2: '#FF0000'
|
||||
});
|
||||
expect(results.data1).toBeHexOrRGB('#00FF00');
|
||||
expect(results.data2).toBeHexOrRGB('#FF0000');
|
||||
});
|
||||
|
||||
it('should set data.colors specified as api', function () {
|
||||
expect(d3.select('.c3-line-data1').style('stroke')).toBeHexOrRGB("#00ff00");
|
||||
expect(d3.select('.c3-line-data2').style('stroke')).toBeHexOrRGB("#ff0000");
|
||||
expect(d3.select('.c3-legend-item-data1 .c3-legend-item-tile').style('stroke')).toBeHexOrRGB("#00ff00");
|
||||
expect(d3.select('.c3-legend-item-data2 .c3-legend-item-tile').style('stroke')).toBeHexOrRGB("#ff0000");
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('data.axes()', function () {
|
||||
|
||||
it('should return data.axes specified as argument', function () {
|
||||
var results = chart.data.axes();
|
||||
expect(results.data1).toBe('y');
|
||||
expect(results.data2).toBe('y2');
|
||||
expect(d3.select('.c3-axis-y g.tick text').text()).toBe('0');
|
||||
expect(d3.select('.c3-axis-y2 g.tick text').text()).toBe('1000');
|
||||
});
|
||||
|
||||
it('should return data.axes specified as api', function () {
|
||||
var results = chart.data.axes({
|
||||
data1: 'y2',
|
||||
data2: 'y'
|
||||
});
|
||||
expect(results.data1).toBe('y2');
|
||||
expect(results.data2).toBe('y');
|
||||
expect(d3.select('.c3-axis-y g.tick text').text()).toBe('1000');
|
||||
expect(d3.select('.c3-axis-y2 g.tick text').text()).toBe('0');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
var customMatchers = {
|
||||
toBeHexOrRGB: function(util, customEqualityTesters) {
|
||||
'use strict';
|
||||
function rgb2hex(rgb){
|
||||
rgb = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
|
||||
return (rgb && rgb.length === 4) ? "#" +
|
||||
("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
|
||||
("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
|
||||
("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : '';
|
||||
}
|
||||
|
||||
|
||||
return {
|
||||
compare: function(actual, expected){
|
||||
if (expected === undefined) {
|
||||
expected = '';
|
||||
}
|
||||
|
||||
var result = {};
|
||||
actual = actual.match('rgb') ? rgb2hex(actual) : actual;
|
||||
expected = expected.match('rgb') ? rgb2hex(expected) : expected;
|
||||
|
||||
result.pass = util.equals(actual, expected, customEqualityTesters);
|
||||
if (result.pass) {
|
||||
result.message = "Expected " + actual + " not to be quite so goofy";
|
||||
} else {
|
||||
result.message = "Expected " + actual + " to be goofy, but it was not very goofy";
|
||||
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
441
node_modules/c3/spec/api.focus-spec.js
generated
vendored
Normal file
441
node_modules/c3/spec/api.focus-spec.js
generated
vendored
Normal file
@@ -0,0 +1,441 @@
|
||||
describe('c3 api focus', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
|
||||
var args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400],
|
||||
['data2', 1000, 800, 500, 2000],
|
||||
['data3', 5000, 2000, 1000, 4000]
|
||||
]
|
||||
}
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('focus', function () {
|
||||
|
||||
it('should focus all targets', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus();
|
||||
setTimeout(function () {
|
||||
var targets = main.select('.c3-chart-line.c3-target'),
|
||||
legendItems = legend.select('.c3-legend-item');
|
||||
targets.each(function () {
|
||||
var line = d3.select(this);
|
||||
expect(line.classed('c3-focused')).toBeTruthy();
|
||||
});
|
||||
legendItems.each(function () {
|
||||
var item = d3.select(this);
|
||||
expect(item.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
});
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should focus one target', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus('data2');
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-focused')).toBeFalsy();
|
||||
expect(targets.data2.classed('c3-focused')).toBeTruthy();
|
||||
expect(targets.data3.classed('c3-focused')).toBeFalsy();
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should focus multiple targets', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus(['data1', 'data2']);
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-focused')).toBeTruthy();
|
||||
expect(targets.data2.classed('c3-focused')).toBeTruthy();
|
||||
expect(targets.data3.classed('c3-focused')).toBeFalsy();
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('defocus', function () {
|
||||
|
||||
it('should defocus all targets', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.defocus();
|
||||
setTimeout(function () {
|
||||
var targets = main.select('.c3-chart-line.c3-target'),
|
||||
legendItems = legend.select('.c3-legend-item');
|
||||
targets.each(function () {
|
||||
var line = d3.select(this);
|
||||
expect(line.classed('c3-focused')).toBeFalsy();
|
||||
expect(line.classed('c3-defocused')).toBeTruthy();
|
||||
});
|
||||
legendItems.each(function () {
|
||||
var item = d3.select(this);
|
||||
expect(item.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(+item.style('opacity')).toBeCloseTo(0.3);
|
||||
});
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should defocus one target', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.defocus('data2');
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-defocused')).toBeFalsy();
|
||||
expect(targets.data2.classed('c3-defocused')).toBeTruthy();
|
||||
expect(targets.data3.classed('c3-defocused')).toBeFalsy();
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(+legendItems.data1.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data2.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(+legendItems.data3.style('opacity')).toBeCloseTo(1);
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should defocus multiple targets', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.defocus(['data1', 'data2']);
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-defocused')).toBeTruthy();
|
||||
expect(targets.data2.classed('c3-defocused')).toBeTruthy();
|
||||
expect(targets.data3.classed('c3-defocused')).toBeFalsy();
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(+legendItems.data1.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(+legendItems.data2.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(+legendItems.data3.style('opacity')).toBeCloseTo(1);
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should defocus multiple targets after focused', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus();
|
||||
setTimeout(function () {
|
||||
chart.defocus(['data1', 'data2']);
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-defocused')).toBeTruthy();
|
||||
expect(targets.data2.classed('c3-defocused')).toBeTruthy();
|
||||
expect(targets.data3.classed('c3-defocused')).toBeFalsy();
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
expect(+legendItems.data1.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(+legendItems.data2.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(+legendItems.data3.style('opacity')).toBeCloseTo(1);
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('revert', function () {
|
||||
|
||||
it('should revert all targets after focus', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus();
|
||||
setTimeout(function () {
|
||||
chart.revert();
|
||||
setTimeout(function () {
|
||||
var targets = main.select('.c3-chart-line.c3-target'),
|
||||
legendItems = legend.select('.c3-legend-item');
|
||||
targets.each(function () {
|
||||
var line = d3.select(this);
|
||||
expect(line.classed('c3-focused')).toBeFalsy();
|
||||
});
|
||||
legendItems.each(function () {
|
||||
var item = d3.select(this);
|
||||
expect(item.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(+item.style('opacity')).toBeCloseTo(1);
|
||||
});
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should revert all targets after defocus', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.defocus();
|
||||
setTimeout(function () {
|
||||
chart.revert();
|
||||
setTimeout(function () {
|
||||
var targets = main.select('.c3-chart-line.c3-target'),
|
||||
legendItems = legend.select('.c3-legend-item');
|
||||
targets.each(function () {
|
||||
var line = d3.select(this);
|
||||
expect(line.classed('c3-defocused')).toBeFalsy();
|
||||
});
|
||||
legendItems.each(function () {
|
||||
var item = d3.select(this);
|
||||
expect(item.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(+item.style('opacity')).toBeCloseTo(1);
|
||||
});
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should revert one target after focus', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus();
|
||||
setTimeout(function () {
|
||||
chart.revert('data2');
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-focused')).toBeTruthy();
|
||||
expect(targets.data2.classed('c3-focused')).toBeFalsy();
|
||||
expect(targets.data3.classed('c3-focused')).toBeTruthy();
|
||||
expect(+legendItems.data1.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data3.style('opacity')).toBeCloseTo(1);
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should revert one target after defocus', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.defocus();
|
||||
setTimeout(function () {
|
||||
chart.revert('data2');
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-defocused')).toBeTruthy();
|
||||
expect(targets.data2.classed('c3-defocused')).toBeFalsy();
|
||||
expect(targets.data3.classed('c3-defocused')).toBeTruthy();
|
||||
expect(+legendItems.data1.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data3.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should focus multiple targets after focus', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus();
|
||||
setTimeout(function () {
|
||||
chart.revert(['data1', 'data2']);
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-focused')).toBeFalsy();
|
||||
expect(targets.data2.classed('c3-focused')).toBeFalsy();
|
||||
expect(targets.data3.classed('c3-focused')).toBeTruthy();
|
||||
expect(+legendItems.data1.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data3.style('opacity')).toBeCloseTo(1);
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeTruthy();
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should focus multiple targets after defocus', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.defocus();
|
||||
setTimeout(function () {
|
||||
chart.revert(['data1', 'data2']);
|
||||
setTimeout(function () {
|
||||
var targets = {
|
||||
data1: main.select('.c3-chart-line.c3-target.c3-target-data1'),
|
||||
data2: main.select('.c3-chart-line.c3-target.c3-target-data2'),
|
||||
data3: main.select('.c3-chart-line.c3-target.c3-target-data3')
|
||||
},
|
||||
legendItems = {
|
||||
data1: legend.select('.c3-legend-item-data1'),
|
||||
data2: legend.select('.c3-legend-item-data2'),
|
||||
data3: legend.select('.c3-legend-item-data3')
|
||||
};
|
||||
expect(targets.data1.classed('c3-defocused')).toBeFalsy();
|
||||
expect(targets.data2.classed('c3-defocused')).toBeFalsy();
|
||||
expect(targets.data3.classed('c3-defocused')).toBeTruthy();
|
||||
expect(+legendItems.data1.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
|
||||
expect(+legendItems.data3.style('opacity')).toBeCloseTo(0.3);
|
||||
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('when legend.show = false', function () {
|
||||
|
||||
it('should update args to hide legend', function () {
|
||||
args.legend = {
|
||||
show: false
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should focus all targets without showing legend', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus();
|
||||
setTimeout(function () {
|
||||
var targets = main.select('.c3-chart-line.c3-target'),
|
||||
legendItems = legend.select('.c3-legend-item');
|
||||
targets.each(function () {
|
||||
var line = d3.select(this);
|
||||
expect(line.classed('c3-focused')).toBeTruthy();
|
||||
});
|
||||
expect(legendItems.size()).toBeCloseTo(0);
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should defocus all targets without showing legend', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.defocus();
|
||||
setTimeout(function () {
|
||||
var targets = main.select('.c3-chart-line.c3-target'),
|
||||
legendItems = legend.select('.c3-legend-item');
|
||||
targets.each(function () {
|
||||
var line = d3.select(this);
|
||||
expect(line.classed('c3-defocused')).toBeTruthy();
|
||||
});
|
||||
expect(legendItems.size()).toBeCloseTo(0);
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
it('should revert all targets after focus', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.focus();
|
||||
setTimeout(function () {
|
||||
chart.revert();
|
||||
setTimeout(function () {
|
||||
var targets = main.select('.c3-chart-line.c3-target'),
|
||||
legendItems = legend.select('.c3-legend-item');
|
||||
targets.each(function () {
|
||||
var line = d3.select(this);
|
||||
expect(line.classed('c3-focused')).toBeFalsy();
|
||||
});
|
||||
expect(legendItems.size()).toBeCloseTo(0);
|
||||
done();
|
||||
}, 1000);
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
119
node_modules/c3/spec/api.grid-spec.js
generated
vendored
Normal file
119
node_modules/c3/spec/api.grid-spec.js
generated
vendored
Normal file
@@ -0,0 +1,119 @@
|
||||
describe('c3 api grid', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('ygrid.add and ygrid.remove', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should update y grids', function (done) {
|
||||
var main = chart.internal.main,
|
||||
expectedGrids = [
|
||||
{
|
||||
value: 100,
|
||||
text: 'Pressure Low'
|
||||
},
|
||||
{
|
||||
value: 200,
|
||||
text: 'Pressure High'
|
||||
}
|
||||
],
|
||||
grids;
|
||||
|
||||
// Call ygrids.add
|
||||
chart.ygrids.add(expectedGrids);
|
||||
setTimeout(function () {
|
||||
grids = main.selectAll('.c3-ygrid-line');
|
||||
expect(grids.size()).toBe(expectedGrids.length);
|
||||
grids.each(function (d, i) {
|
||||
var y = +d3.select(this).select('line').attr('y1'),
|
||||
text = d3.select(this).select('text').text(),
|
||||
expectedY = Math.round(chart.internal.y(expectedGrids[i].value)),
|
||||
expectedText = expectedGrids[i].text;
|
||||
expect(y).toBe(expectedY);
|
||||
expect(text).toBe(expectedText);
|
||||
});
|
||||
|
||||
// Call ygrids.remove
|
||||
chart.ygrids.remove(expectedGrids);
|
||||
setTimeout(function () {
|
||||
grids = main.selectAll('.c3-ygrid-line');
|
||||
expect(grids.size()).toBe(0);
|
||||
}, 500);
|
||||
|
||||
}, 500);
|
||||
|
||||
setTimeout(function () {
|
||||
done();
|
||||
}, 1200);
|
||||
});
|
||||
|
||||
it("should update x ygrids even if it's zoomed", function (done) {
|
||||
var main = chart.internal.main,
|
||||
expectedGrids = [
|
||||
{
|
||||
value: 0,
|
||||
text: 'Pressure Low'
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
text: 'Pressure High'
|
||||
}
|
||||
],
|
||||
grids, domain;
|
||||
|
||||
chart.zoom([0, 2]);
|
||||
setTimeout(function () {
|
||||
|
||||
// Call xgrids
|
||||
chart.xgrids(expectedGrids);
|
||||
setTimeout(function () {
|
||||
grids = main.selectAll('.c3-xgrid-line');
|
||||
expect(grids.size()).toBe(expectedGrids.length);
|
||||
grids.each(function (d, i) {
|
||||
var x = +d3.select(this).select('line').attr('x1'),
|
||||
text = d3.select(this).select('text').text(),
|
||||
expectedX = Math.round(chart.internal.x(expectedGrids[i].value)),
|
||||
expectedText = expectedGrids[i].text;
|
||||
expect(x).toBe(expectedX);
|
||||
expect(text).toBe(expectedText);
|
||||
});
|
||||
|
||||
// check if it was not rescaled
|
||||
domain = chart.internal.y.domain();
|
||||
expect(domain[0]).toBeLessThan(0);
|
||||
expect(domain[1]).toBeGreaterThan(400);
|
||||
|
||||
// Call xgrids.remove
|
||||
chart.xgrids.remove(expectedGrids);
|
||||
setTimeout(function () {
|
||||
grids = main.selectAll('.c3-xgrid-line');
|
||||
expect(grids.size()).toBe(0);
|
||||
}, 500); // for xgrids.remove()
|
||||
|
||||
}, 500); // for xgrids()
|
||||
|
||||
}, 500); // for zoom
|
||||
|
||||
setTimeout(function () {
|
||||
done();
|
||||
}, 1700);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
121
node_modules/c3/spec/api.load-spec.js
generated
vendored
Normal file
121
node_modules/c3/spec/api.load-spec.js
generated
vendored
Normal file
@@ -0,0 +1,121 @@
|
||||
describe('c3 api load', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('indexed data', function () {
|
||||
|
||||
describe('as column', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 5000, 2000, 1000, 4000, 1500, 2500]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should load additional data', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.load({
|
||||
columns: [
|
||||
['data3', 800, 500, 900, 500, 1000, 700]
|
||||
]
|
||||
});
|
||||
setTimeout(function () {
|
||||
var target = main.select('.c3-chart-line.c3-target.c3-target-data3'),
|
||||
legendItem = legend.select('.c3-legend-item.c3-legend-item-data3');
|
||||
expect(target.size()).toBe(1);
|
||||
expect(legendItem.size()).toBe(1);
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('category data', function () {
|
||||
|
||||
it('should update arg to category data', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 'cat1', 'cat2', 'cat3', 'cat4', 'cat5', 'cat6'],
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 5000, 2000, 1000, 4000, 1500, 2500]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'category'
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
describe('as column', function () {
|
||||
|
||||
it('should load additional data', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.load({
|
||||
columns: [
|
||||
['data3', 800, 500, 900, 500, 1000, 700]
|
||||
]
|
||||
});
|
||||
setTimeout(function () {
|
||||
var target = main.select('.c3-chart-line.c3-target.c3-target-data3'),
|
||||
legendItem = legend.select('.c3-legend-item.c3-legend-item-data3'),
|
||||
tickTexts = main.selectAll('.c3-axis-x g.tick text'),
|
||||
expected = ['cat1', 'cat2', 'cat3', 'cat4', 'cat5', 'cat6'];
|
||||
expect(target.size()).toBe(1);
|
||||
expect(legendItem.size()).toBe(1);
|
||||
tickTexts.each(function (d, i) {
|
||||
var text = d3.select(this).select('tspan').text();
|
||||
expect(text).toBe(expected[i]);
|
||||
});
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('should load additional data', function (done) {
|
||||
var main = chart.internal.main,
|
||||
legend = chart.internal.legend;
|
||||
chart.load({
|
||||
columns: [
|
||||
['x', 'new1', 'new2', 'new3', 'new4', 'new5', 'new6'],
|
||||
['data3', 800, 500, 900, 500, 1000, 700]
|
||||
]
|
||||
});
|
||||
setTimeout(function () {
|
||||
var target = main.select('.c3-chart-line.c3-target.c3-target-data3'),
|
||||
legendItem = legend.select('.c3-legend-item.c3-legend-item-data3'),
|
||||
tickTexts = main.selectAll('.c3-axis-x g.tick text'),
|
||||
expected = ['new1', 'new2', 'new3', 'new4', 'new5', 'new6'];
|
||||
expect(target.size()).toBe(1);
|
||||
expect(legendItem.size()).toBe(1);
|
||||
tickTexts.each(function (d, i) {
|
||||
var text = d3.select(this).select('tspan').text();
|
||||
expect(text).toBe(expected[i]);
|
||||
});
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
250
node_modules/c3/spec/api.region-spec.js
generated
vendored
Normal file
250
node_modules/c3/spec/api.region-spec.js
generated
vendored
Normal file
@@ -0,0 +1,250 @@
|
||||
describe('c3 api region', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('api.region', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
]
|
||||
},
|
||||
regions: [
|
||||
{
|
||||
axis: 'y',
|
||||
start: 300,
|
||||
end: 400,
|
||||
class: 'green',
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 0,
|
||||
end: 100,
|
||||
class: 'green',
|
||||
}
|
||||
]
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should update regions', function (done) {
|
||||
var main = chart.internal.main,
|
||||
expectedRegions = [
|
||||
{
|
||||
axis: 'y',
|
||||
start: 250,
|
||||
end: 350,
|
||||
class: 'red'
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 25,
|
||||
end: 75,
|
||||
class: 'red'
|
||||
}
|
||||
],
|
||||
regions;
|
||||
|
||||
// Call regions API
|
||||
chart.regions(expectedRegions);
|
||||
setTimeout(function () {
|
||||
regions = main.selectAll('.c3-region');
|
||||
expect(regions.size()).toBe(expectedRegions.length);
|
||||
|
||||
regions.each(function (d, i) {
|
||||
var region = d3.select(this),
|
||||
rect = region.select('rect'),
|
||||
y = +rect.attr('y'),
|
||||
height = +rect.attr('height'),
|
||||
expectedClass = 'red',
|
||||
unexpectedClass = 'green',
|
||||
expectedStart = Math.round(chart.internal.y(expectedRegions[i].start)),
|
||||
expectedEnd = Math.round(chart.internal.y(expectedRegions[i].end)),
|
||||
expectedY = expectedEnd,
|
||||
expectedHeight = expectedStart - expectedEnd;
|
||||
expect(y).toBeCloseTo(expectedY, -1);
|
||||
expect(height).toBeCloseTo(expectedHeight, -1);
|
||||
expect(region.classed(expectedClass)).toBeTruthy();
|
||||
expect(region.classed(unexpectedClass)).toBeFalsy();
|
||||
});
|
||||
}, 500);
|
||||
|
||||
setTimeout(function () {
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
});
|
||||
|
||||
describe('api.region.add', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
]
|
||||
},
|
||||
regions: [
|
||||
{
|
||||
axis: 'y',
|
||||
start: 300,
|
||||
end: 400,
|
||||
class: 'green',
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 0,
|
||||
end: 100,
|
||||
class: 'green',
|
||||
}
|
||||
]
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should add regions', function (done) {
|
||||
var main = chart.internal.main,
|
||||
expectedRegions = [
|
||||
{
|
||||
axis: 'y',
|
||||
start: 300,
|
||||
end: 400,
|
||||
class: 'green',
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 0,
|
||||
end: 100,
|
||||
class: 'green',
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 250,
|
||||
end: 350,
|
||||
class: 'red'
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 25,
|
||||
end: 75,
|
||||
class: 'red'
|
||||
}
|
||||
],
|
||||
expectedClasses = [
|
||||
'green',
|
||||
'green',
|
||||
'red',
|
||||
'red',
|
||||
],
|
||||
regions;
|
||||
|
||||
// Call regions API
|
||||
chart.regions(expectedRegions);
|
||||
setTimeout(function () {
|
||||
regions = main.selectAll('.c3-region');
|
||||
expect(regions.size()).toBe(expectedRegions.length);
|
||||
|
||||
regions.each(function (d, i) {
|
||||
var region = d3.select(this),
|
||||
rect = region.select('rect'),
|
||||
y = +rect.attr('y'),
|
||||
height = +rect.attr('height'),
|
||||
expectedClass = expectedClasses[i],
|
||||
expectedStart = Math.round(chart.internal.y(expectedRegions[i].start)),
|
||||
expectedEnd = Math.round(chart.internal.y(expectedRegions[i].end)),
|
||||
expectedY = expectedEnd,
|
||||
expectedHeight = expectedStart - expectedEnd;
|
||||
expect(y).toBeCloseTo(expectedY, -1);
|
||||
expect(height).toBeCloseTo(expectedHeight, -1);
|
||||
expect(region.classed(expectedClass)).toBeTruthy();
|
||||
});
|
||||
}, 500);
|
||||
|
||||
setTimeout(function () {
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
});
|
||||
|
||||
describe('api.region.remove', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
]
|
||||
},
|
||||
regions: [
|
||||
{
|
||||
axis: 'y',
|
||||
start: 300,
|
||||
end: 400,
|
||||
class: 'green',
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 0,
|
||||
end: 100,
|
||||
class: 'green',
|
||||
},
|
||||
{
|
||||
axis: 'y',
|
||||
start: 250,
|
||||
end: 350,
|
||||
class: 'red'
|
||||
},
|
||||
]
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should remove regions', function (done) {
|
||||
var main = chart.internal.main,
|
||||
expectedRegions = [
|
||||
{
|
||||
axis: 'y',
|
||||
start: 250,
|
||||
end: 350,
|
||||
class: 'red'
|
||||
},
|
||||
],
|
||||
expectedClasses = ['red'],
|
||||
regions;
|
||||
|
||||
// Call regions API
|
||||
chart.regions(expectedRegions);
|
||||
setTimeout(function () {
|
||||
regions = main.selectAll('.c3-region');
|
||||
expect(regions.size()).toBe(expectedRegions.length);
|
||||
|
||||
regions.each(function (d, i) {
|
||||
var region = d3.select(this),
|
||||
rect = region.select('rect'),
|
||||
y = +rect.attr('y'),
|
||||
height = +rect.attr('height'),
|
||||
expectedClass = expectedClasses[i],
|
||||
expectedStart = Math.round(chart.internal.y(expectedRegions[i].start)),
|
||||
expectedEnd = Math.round(chart.internal.y(expectedRegions[i].end)),
|
||||
expectedY = expectedEnd,
|
||||
expectedHeight = expectedStart - expectedEnd;
|
||||
expect(y).toBeCloseTo(expectedY, -1);
|
||||
expect(height).toBeCloseTo(expectedHeight, -1);
|
||||
expect(region.classed(expectedClass)).toBeTruthy();
|
||||
});
|
||||
}, 500);
|
||||
|
||||
setTimeout(function () {
|
||||
done();
|
||||
}, 1000);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
115
node_modules/c3/spec/api.zoom-spec.js
generated
vendored
Normal file
115
node_modules/c3/spec/api.zoom-spec.js
generated
vendored
Normal file
@@ -0,0 +1,115 @@
|
||||
describe('c3 api zoom', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('zoom', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
},
|
||||
zoom: {
|
||||
enabled: true
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be zoomed properly', function () {
|
||||
var target = [3, 5], domain;
|
||||
chart.zoom(target);
|
||||
domain = chart.internal.x.domain();
|
||||
expect(domain[0]).toBe(target[0]);
|
||||
expect(domain[1]).toBe(target[1]);
|
||||
});
|
||||
|
||||
it('should be zoomed properly again', function () {
|
||||
var target = [1, 4], domain;
|
||||
chart.zoom(target);
|
||||
domain = chart.internal.x.domain();
|
||||
expect(domain[0]).toBe(target[0]);
|
||||
expect(domain[1]).toBe(target[1]);
|
||||
});
|
||||
|
||||
it('should load timeseries data', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'date',
|
||||
columns: [
|
||||
['date', '2014-01-01', '2014-01-02', '2014-08-01', '2014-10-19'],
|
||||
['data1', 30, 200, 100, 400]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'timeseries'
|
||||
}
|
||||
},
|
||||
zoom: {
|
||||
enabled: true
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be zoomed properly', function () {
|
||||
var target = [new Date(2014, 7, 1), new Date(2014, 8, 1)], domain;
|
||||
chart.zoom(target);
|
||||
domain = chart.internal.x.domain();
|
||||
expect(+domain[0]).toBe(+target[0]);
|
||||
expect(+domain[1]).toBe(+target[1]);
|
||||
});
|
||||
|
||||
it('should be zoomed properly', function () {
|
||||
var target = ['2014-08-01', '2014-09-01'], domain;
|
||||
chart.zoom(target);
|
||||
domain = chart.internal.x.domain();
|
||||
expect(+domain[0]).toBe(+chart.internal.parseDate(target[0]));
|
||||
expect(+domain[1]).toBe(+chart.internal.parseDate(target[1]));
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('unzoom', function () {
|
||||
|
||||
it('should load indexed data', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250]
|
||||
]
|
||||
},
|
||||
zoom: {
|
||||
enabled: true
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be unzoomed properly', function () {
|
||||
var target = [1, 4], orginal = chart.internal.x.domain(), domain;
|
||||
|
||||
chart.zoom(target);
|
||||
domain = chart.internal.x.domain();
|
||||
expect(domain[0]).toBe(target[0]);
|
||||
expect(domain[1]).toBe(target[1]);
|
||||
|
||||
chart.unzoom();
|
||||
domain = chart.internal.x.domain();
|
||||
expect(domain[0]).toBe(orginal[0]);
|
||||
expect(domain[1]).toBe(orginal[1]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
159
node_modules/c3/spec/arc-spec.js
generated
vendored
Normal file
159
node_modules/c3/spec/arc-spec.js
generated
vendored
Normal file
@@ -0,0 +1,159 @@
|
||||
describe('c3 chart arc', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('show pie chart', function () {
|
||||
|
||||
it('should update args to have pie chart', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30],
|
||||
['data2', 150],
|
||||
['data3', 120]
|
||||
],
|
||||
type: 'pie'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have correct classes', function () {
|
||||
var chartArc = d3.select('.c3-chart-arcs'),
|
||||
arcs = {
|
||||
data1: chartArc.select('.c3-chart-arc.c3-target.c3-target-data1')
|
||||
.select('g.c3-shapes.c3-shapes-data1.c3-arcs.c3-arcs-data1')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data1'),
|
||||
data2: chartArc.select('.c3-chart-arc.c3-target.c3-target-data2')
|
||||
.select('g.c3-shapes.c3-shapes-data2.c3-arcs.c3-arcs-data2')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data2'),
|
||||
data3: chartArc.select('.c3-chart-arc.c3-target.c3-target-data3')
|
||||
.select('g.c3-shapes.c3-shapes-data3.c3-arcs.c3-arcs-data3')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data3')
|
||||
};
|
||||
expect(arcs.data1.size()).toBe(1);
|
||||
expect(arcs.data2.size()).toBe(1);
|
||||
expect(arcs.data3.size()).toBe(1);
|
||||
});
|
||||
|
||||
it('should have correct d', function () {
|
||||
expect(d3.select('.c3-arc-data1').attr('d')).toMatch(/M-124\..+,-171\..+A211\..+,211\..+ 0 0,1 -3\..+,-211\..+L0,0Z/);
|
||||
expect(d3.select('.c3-arc-data2').attr('d')).toMatch(/M1\..+,-211\..+A211\..+,211\..+ 0 0,1 1\..+,211\..+L0,0Z/);
|
||||
expect(d3.select('.c3-arc-data3').attr('d')).toMatch(/M1\..+,211\..+A211\..+,211\..+ 0 0,1 -124\..+,-171\..+L0,0Z/);
|
||||
});
|
||||
|
||||
it('should set args with data id that can be converted to a color', function () {
|
||||
args.data.columns = [
|
||||
['black', 30],
|
||||
['data2', 150],
|
||||
['data3', 120]
|
||||
];
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have correct d even if data id can be converted to a color', function (done) {
|
||||
setTimeout(function () {
|
||||
expect(d3.select('.c3-arc-black').attr('d')).toMatch(/M-124\..+,-171\..+A211\..+,211\..+ 0 0,1 -3\..+,-211\..+L0,0Z/);
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('should update args to have empty pie chart', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', null],
|
||||
['data2', null],
|
||||
['data3', null]
|
||||
],
|
||||
type: 'pie'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have correct d attribute', function () {
|
||||
var chartArc = d3.select('.c3-chart-arcs'),
|
||||
arcs = {
|
||||
data1: chartArc.select('.c3-chart-arc.c3-target.c3-target-data1')
|
||||
.select('g.c3-shapes.c3-shapes-data1.c3-arcs.c3-arcs-data1')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data1'),
|
||||
data2: chartArc.select('.c3-chart-arc.c3-target.c3-target-data2')
|
||||
.select('g.c3-shapes.c3-shapes-data2.c3-arcs.c3-arcs-data2')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data2'),
|
||||
data3: chartArc.select('.c3-chart-arc.c3-target.c3-target-data3')
|
||||
.select('g.c3-shapes.c3-shapes-data3.c3-arcs.c3-arcs-data3')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data3')
|
||||
};
|
||||
expect(arcs.data1.attr('d').indexOf('NaN')).toBe(-1);
|
||||
expect(arcs.data2.attr('d').indexOf('NaN')).toBe(-1);
|
||||
expect(arcs.data3.attr('d').indexOf('NaN')).toBe(-1);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('show gauge', function () {
|
||||
|
||||
it('should update args to have a 180 degree gauge', function () {
|
||||
args = {
|
||||
gauge: {
|
||||
width: 10,
|
||||
max: 10,
|
||||
expand: true
|
||||
},
|
||||
data: {
|
||||
columns: [
|
||||
['data', 8]
|
||||
],
|
||||
type: 'gauge'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have correct d for Pi radian gauge', function () {
|
||||
var chartArc = d3.select('.c3-chart-arcs'),
|
||||
data = chartArc.select('.c3-chart-arc.c3-target.c3-target-data')
|
||||
.select('g.c3-shapes.c3-shapes-data.c3-arcs.c3-arcs-data')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data');
|
||||
|
||||
expect(data.attr('d')).toMatch(/M-304,-3\..+A304,304 0 0,1 245\..+,-178\..+L237\..+,-172\..+A294,294 0 0,0 -294,-3\..+Z/);
|
||||
});
|
||||
|
||||
it('should update args to have a 2 Pi radian gauge that starts at Pi/2', function() {
|
||||
args = {
|
||||
gauge: {
|
||||
width: 10,
|
||||
max: 10,
|
||||
expand: true,
|
||||
fullCircle: true
|
||||
},
|
||||
data: {
|
||||
columns: [
|
||||
['data', 8]
|
||||
],
|
||||
type: 'gauge',
|
||||
fullCircle: true,
|
||||
startingAngle: Math.PI/2
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have correct d for 2 Pi radian gauge starting at Pi/2', function() {
|
||||
var chartArc = d3.select('.c3-chart-arcs'),
|
||||
data = chartArc.select('.c3-chart-arc.c3-target.c3-target-data')
|
||||
.select('g.c3-shapes.c3-shapes-data.c3-arcs.c3-arcs-data')
|
||||
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data');
|
||||
|
||||
// This test has bee updated to make tests pass. @TODO double-check this test is accurate.
|
||||
expect(data.attr('d')).toMatch(/M-221.*?,-2\..+A221.*?,221.*? 0 1,1 -68.*?,210.*?L-65.*?,201.*?A211.*?,211.*? 0 1,0 -211.*?,-2.*?Z/);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
840
node_modules/c3/spec/axis-spec.js
generated
vendored
Normal file
840
node_modules/c3/spec/axis-spec.js
generated
vendored
Normal file
@@ -0,0 +1,840 @@
|
||||
describe('c3 chart axis', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
|
||||
var args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y: {
|
||||
tick: {
|
||||
values: null,
|
||||
count: undefined
|
||||
}
|
||||
},
|
||||
y2: {
|
||||
tick: {
|
||||
values: null,
|
||||
count: undefined
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('axis.y.tick.count', function () {
|
||||
|
||||
it('should update args to have only 1 tick on y axis', function () {
|
||||
args.axis.y.tick.count = 1;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have only 1 tick on y axis', function () {
|
||||
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
|
||||
expect(ticksSize).toBe(1);
|
||||
});
|
||||
|
||||
it('should update args to have 2 ticks on y axis', function () {
|
||||
args.axis.y.tick.count = 2;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 2 ticks on y axis', function () {
|
||||
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
|
||||
expect(ticksSize).toBe(2);
|
||||
});
|
||||
|
||||
it('should update args to have 3 ticks on y axis', function () {
|
||||
args.axis.y.tick.count = 3;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 3 ticks on y axis', function () {
|
||||
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
|
||||
expect(ticksSize).toBe(3);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('axis.y.tick.values', function () {
|
||||
|
||||
var values = [100, 500];
|
||||
|
||||
it('should update args to have only 2 ticks on y axis', function () {
|
||||
args.axis.y.tick.values = values;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have only 2 tick on y axis', function () {
|
||||
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
|
||||
expect(ticksSize).toBe(2);
|
||||
});
|
||||
|
||||
it('should have specified tick texts', function () {
|
||||
d3.select('.c3-axis-y').selectAll('g.tick').each(function (d, i) {
|
||||
var text = d3.select(this).select('text').text();
|
||||
expect(+text).toBe(values[i]);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('axis y timeseries', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
["times", 60000, 120000, 180000, 240000]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y: {
|
||||
type : 'timeseries',
|
||||
tick: {
|
||||
time: {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 7 ticks on y axis', function () {
|
||||
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
|
||||
expect(ticksSize).toBe(7); // the count starts at initial value and increments by the set interval
|
||||
});
|
||||
|
||||
it('should have specified 30 second intervals', function () {
|
||||
var prevValue;
|
||||
d3.select('.c3-axis-y').selectAll('g.tick').each(function (d, i) {
|
||||
if (i !== 0) {
|
||||
var result = d - prevValue;
|
||||
expect(result).toEqual(30000); // expressed in milliseconds
|
||||
}
|
||||
prevValue = d;
|
||||
});
|
||||
});
|
||||
|
||||
it('should update args to set axis.y.time', function () {
|
||||
args.axis.y.tick.time = {
|
||||
value : 'seconds',
|
||||
interval : 60
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 4 ticks on y axis', function () {
|
||||
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
|
||||
expect(ticksSize).toBe(4); // the count starts at initial value and increments by the set interval
|
||||
});
|
||||
|
||||
it('should have specified 60 second intervals', function () {
|
||||
var prevValue;
|
||||
d3.select('.c3-axis-y').selectAll('g.tick').each(function (d, i) {
|
||||
if (i !== 0) {
|
||||
var result = d - prevValue;
|
||||
expect(result).toEqual(60000); // expressed in milliseconds
|
||||
}
|
||||
prevValue = d;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('axis.x.tick.values', function () {
|
||||
describe('function is provided', function () {
|
||||
var tickGenerator = function () {
|
||||
var values = [];
|
||||
for (var i = 0; i <= 300; i += 50) {
|
||||
values.push(i);
|
||||
}
|
||||
return values;
|
||||
};
|
||||
beforeEach(function () {
|
||||
args.axis.x = {
|
||||
tick: {
|
||||
values: tickGenerator
|
||||
}
|
||||
};
|
||||
chart = window.c3.generate(args);
|
||||
window.generatedTicks = tickGenerator();
|
||||
});
|
||||
|
||||
it('should use function to generate ticks', function () {
|
||||
d3.select('.c3-axis-x').selectAll('g.tick').each(function (d, i) {
|
||||
var tick = d3.select(this).select('text').text();
|
||||
expect(+tick).toBe(window.generatedTicks[i]);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('axis.x.tick.width', function () {
|
||||
|
||||
describe('indexed x axis and y/y2 axis', function () {
|
||||
|
||||
describe('not rotated', function () {
|
||||
|
||||
it('should update args successfully', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
],
|
||||
axes: {
|
||||
data2: 'y2'
|
||||
}
|
||||
},
|
||||
axis: {
|
||||
y2: {
|
||||
show: true
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should construct indexed x axis properly', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'),
|
||||
expectedX = '0',
|
||||
expectedDy = '.71em';
|
||||
expect(ticks.size()).toBe(6);
|
||||
ticks.each(function (d, i) {
|
||||
var tspans = d3.select(this).selectAll('tspan');
|
||||
expect(tspans.size()).toBe(1);
|
||||
tspans.each(function () {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(i + '');
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
expect(tspan.attr('dy')).toBe(expectedDy);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should set axis.x.tick.format', function () {
|
||||
args.axis.x = {
|
||||
tick: {
|
||||
format: function () {
|
||||
return 'very long tick text on x axis';
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should split x axis tick text to multiple lines', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'),
|
||||
expectedTexts = ['very long tick text', 'on x axis'],
|
||||
expectedX = '0';
|
||||
expect(ticks.size()).toBe(6);
|
||||
ticks.each(function () {
|
||||
var tspans = d3.select(this).selectAll('tspan');
|
||||
expect(tspans.size()).toBe(2);
|
||||
tspans.each(function (d, i) {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(expectedTexts[i]);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
if (i === 0) {
|
||||
expect(tspan.attr('dy')).toBe('.71em');
|
||||
} else {
|
||||
expect(tspan.attr('dy')).toBeGreaterThan(8);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should construct y axis properly', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-y').selectAll('g.tick'),
|
||||
expectedX = '-9',
|
||||
expectedDy = '3';
|
||||
expect(ticks.size()).toBe(9);
|
||||
ticks.each(function (d) {
|
||||
var tspans = d3.select(this).selectAll('tspan');
|
||||
expect(tspans.size()).toBe(1);
|
||||
tspans.each(function () {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(d + '');
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
expect(tspan.attr('dy')).toBe(expectedDy);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should construct y2 axis properly', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick'),
|
||||
expectedX = '9',
|
||||
expectedDy = '3';
|
||||
expect(ticks.size()).toBe(9);
|
||||
ticks.each(function (d) {
|
||||
var tspans = d3.select(this).selectAll('tspan');
|
||||
expect(tspans.size()).toBe(1);
|
||||
tspans.each(function () {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(d + '');
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
expect(tspan.attr('dy')).toBe(expectedDy);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should set big values in y', function () {
|
||||
args.data.columns = [
|
||||
['data1', 3000000000000000, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
];
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not split y axis tick text to multiple lines', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick');
|
||||
ticks.each(function () {
|
||||
var tspans = d3.select(this).selectAll('tspan');
|
||||
expect(tspans.size()).toBe(1);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('rotated', function () {
|
||||
|
||||
it('should update args to rotate axis', function () {
|
||||
args.axis.rotated = true;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should split x axis tick text to multiple lines', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'),
|
||||
expectedTexts = ['very long tick', 'text on x axis'],
|
||||
expectedX = '-9';
|
||||
expect(ticks.size()).toBe(6);
|
||||
ticks.each(function () {
|
||||
var tspans = d3.select(this).selectAll('tspan');
|
||||
expect(tspans.size()).toBe(2);
|
||||
tspans.each(function (d, i) {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(expectedTexts[i]);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
if (i === 0) {
|
||||
expect(tspan.attr('dy')).toBeLessThan(0);
|
||||
} else {
|
||||
expect(tspan.attr('dy')).toBeGreaterThan(9);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should not split y axis tick text to multiple lines', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-y').selectAll('g.tick'),
|
||||
expectedTexts = [
|
||||
'0',
|
||||
'500000000000000',
|
||||
'1000000000000000',
|
||||
'1500000000000000',
|
||||
'2000000000000000',
|
||||
'2500000000000000',
|
||||
'3000000000000000'
|
||||
],
|
||||
expectedX = '0',
|
||||
expectedDy = '.71em';
|
||||
expect(ticks.size()).toBe(7);
|
||||
ticks.each(function (d, i) {
|
||||
var tspans = d3.select(this).selectAll('tspan');
|
||||
expect(tspans.size()).toBe(1);
|
||||
tspans.each(function () {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(expectedTexts[i]);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
expect(tspan.attr('dy')).toBe(expectedDy);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
describe('category axis', function () {
|
||||
|
||||
describe('not rotated', function () {
|
||||
|
||||
it('should update args successfully', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 'this is a very long tick text on category axis', 'cat1', 'cat2', 'cat3', 'cat4', 'cat5'],
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'category'
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should locate ticks properly', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick');
|
||||
ticks.each(function (d, i) {
|
||||
var tspans = d3.select(this).selectAll('tspan'),
|
||||
expectedX = '0',
|
||||
expectedDy = '.71em';
|
||||
if (i > 0) { // i === 0 should be checked in next test
|
||||
expect(tspans.size()).toBe(1);
|
||||
tspans.each(function () {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
expect(tspan.attr('dy')).toBe(expectedDy);
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('should split tick text properly', function () {
|
||||
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
|
||||
tspans = tick.selectAll('tspan'),
|
||||
expectedTickTexts = [
|
||||
'this is a very',
|
||||
'long tick text',
|
||||
'on category axis'
|
||||
],
|
||||
expectedX = '0';
|
||||
expect(tspans.size()).toBe(3);
|
||||
tspans.each(function (d, i) {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(expectedTickTexts[i]);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
// unable to define pricise number because it differs depends on environment..
|
||||
if (i === 0) {
|
||||
expect(tspan.attr('dy')).toBe('.71em');
|
||||
} else {
|
||||
expect(tspan.attr('dy')).toBeGreaterThan(8);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('rotated', function () {
|
||||
|
||||
it('should update args to rotate axis', function () {
|
||||
args.axis.rotated = true;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should locate ticks on rotated axis properly', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick');
|
||||
ticks.each(function (d, i) {
|
||||
var tspans = d3.select(this).selectAll('tspan'),
|
||||
expectedX = '-9',
|
||||
expectedDy = '3';
|
||||
if (i > 0) { // i === 0 should be checked in next test
|
||||
expect(tspans.size()).toBe(1);
|
||||
tspans.each(function () {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
expect(tspan.attr('dy')).toBe(expectedDy);
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('should split tick text on rotated axis properly', function () {
|
||||
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
|
||||
tspans = tick.selectAll('tspan'),
|
||||
expectedTickTexts = [
|
||||
'this is a very',
|
||||
'long tick text on',
|
||||
'category axis'
|
||||
],
|
||||
expectedX = '-9';
|
||||
expect(tspans.size()).toBe(3);
|
||||
tspans.each(function (d, i) {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(expectedTickTexts[i]);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
// unable to define pricise number because it differs depends on environment..
|
||||
if (i === 0) {
|
||||
expect(tspan.attr('dy')).toBeLessThan(0);
|
||||
} else {
|
||||
expect(tspan.attr('dy')).toBeGreaterThan(8);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('option used', function () {
|
||||
|
||||
describe('as null', function () {
|
||||
|
||||
it('should update args not to split ticks', function () {
|
||||
args.axis.x.tick = {
|
||||
multiline: false
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should split x tick', function () {
|
||||
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
|
||||
tspans = tick.selectAll('tspan');
|
||||
expect(tspans.size()).toBe(1);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('as value', function () {
|
||||
|
||||
it('should update args not to split ticks', function () {
|
||||
args.axis.x.tick = {
|
||||
width: 150
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should split x tick to 2 lines properly', function () {
|
||||
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
|
||||
tspans = tick.selectAll('tspan'),
|
||||
expectedTickTexts = [
|
||||
'this is a very long tick',
|
||||
'text on category axis'
|
||||
],
|
||||
expectedX = '-9';
|
||||
expect(tspans.size()).toBe(2);
|
||||
tspans.each(function (d, i) {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(expectedTickTexts[i]);
|
||||
expect(tspan.attr('x')).toBe(expectedX);
|
||||
// unable to define pricise number because it differs depends on environment..
|
||||
if (i === 0) {
|
||||
expect(tspan.attr('dy')).toBeLessThan(0);
|
||||
} else {
|
||||
expect(tspan.attr('dy')).toBeGreaterThan(8);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('with axis.x.tick.format', function () {
|
||||
|
||||
it('should update args to use axis.x.tick.format', function () {
|
||||
args.axis.x.tick.format = function () {
|
||||
return ['this is a very long tick text', 'on category axis'];
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have multiline tick text', function () {
|
||||
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
|
||||
tspans = tick.selectAll('tspan'),
|
||||
expectedTickTexts = ['this is a very long tick text', 'on category axis'];
|
||||
expect(tspans.size()).toBe(2);
|
||||
tspans.each(function (d, i) {
|
||||
var tspan = d3.select(this);
|
||||
expect(tspan.text()).toBe(expectedTickTexts[i]);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
describe('axis.x.tick.rotate', function () {
|
||||
|
||||
describe('not rotated', function () {
|
||||
|
||||
it('should update args successfully', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 'category 1', 'category 2', 'category 3', 'category 4', 'category 5', 'category 6'],
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'category',
|
||||
tick: {
|
||||
rotate: 60
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should rotate tick texts', function () {
|
||||
chart.internal.main.selectAll('.c3-axis-x g.tick').each(function () {
|
||||
var tick = d3.select(this),
|
||||
text = tick.select('text'),
|
||||
tspan = text.select('tspan');
|
||||
expect(text.attr('transform')).toBe('rotate(60)');
|
||||
expect(text.attr('y')).toBe('1.5');
|
||||
expect(tspan.attr('dx')).toBe('6.928203230275509');
|
||||
});
|
||||
});
|
||||
|
||||
it('should have automatically calculated x axis height', function () {
|
||||
var box = chart.internal.main.select('.c3-axis-x').node().getBoundingClientRect(),
|
||||
height = chart.internal.getHorizontalAxisHeight('x');
|
||||
expect(box.height).toBeGreaterThan(50);
|
||||
expect(height).toBeCloseTo(70, -1);
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
describe('axis.y.tick.rotate', function () {
|
||||
|
||||
describe('not rotated', function () {
|
||||
|
||||
it('should update args successfully', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250, 100, 600],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
rotated: true,
|
||||
y: {
|
||||
tick: {
|
||||
rotate: 45
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should rotate tick texts', function () {
|
||||
chart.internal.main.selectAll('.c3-axis-y g.tick').each(function () {
|
||||
var tick = d3.select(this),
|
||||
text = tick.select('text'),
|
||||
tspan = text.select('tspan');
|
||||
expect(text.attr('transform')).toBe('rotate(45)');
|
||||
expect(text.attr('y')).toBe('4');
|
||||
expect(tspan.attr('dx')).toBeCloseTo('5.6', 0);
|
||||
});
|
||||
});
|
||||
|
||||
it('should have automatically calculated y axis width', function () {
|
||||
var box = chart.internal.main.select('.c3-axis-y').node().getBoundingClientRect();
|
||||
expect(box.width).toBeCloseTo(590, 1);
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
describe('axis.x.tick.fit', function () {
|
||||
|
||||
describe('axis.x.tick.fit = true', function () {
|
||||
|
||||
it('should set args for indexed data', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show fitted ticks on indexed data', function () {
|
||||
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
|
||||
expect(ticks.size()).toBe(6);
|
||||
});
|
||||
|
||||
it('should set args for x-based data', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 10, 20, 100, 110, 200, 1000],
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show fitted ticks on indexed data', function () {
|
||||
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
|
||||
expect(ticks.size()).toBe(6);
|
||||
});
|
||||
|
||||
it('should show fitted ticks after hide and show', function () {
|
||||
chart.hide();
|
||||
chart.show();
|
||||
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
|
||||
expect(ticks.size()).toBe(6);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('axis.x.tick.fit = false', function () {
|
||||
|
||||
it('should set args for indexed data', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
tick: {
|
||||
fit: false
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show fitted ticks on indexed data', function () {
|
||||
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
|
||||
expect(ticks.size()).toBe(11);
|
||||
});
|
||||
|
||||
it('should set args for x-based data', function () {
|
||||
args.data = {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 10, 20, 100, 110, 200, 1000],
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show fitted ticks on indexed data', function () {
|
||||
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
|
||||
expect(ticks.size()).toBe(10);
|
||||
});
|
||||
|
||||
it('should show fitted ticks after hide and show', function () {
|
||||
chart.hide();
|
||||
chart.show();
|
||||
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
|
||||
expect(ticks.size()).toBe(10);
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
describe('axis.y.inner', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y: {
|
||||
inner: false
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not have inner y axis', function () {
|
||||
var paddingLeft = chart.internal.getCurrentPaddingLeft(),
|
||||
tickTexts = chart.internal.main.selectAll('.c3-axis-y g.tick text');
|
||||
expect(paddingLeft).toBeGreaterThan(19);
|
||||
tickTexts.each(function () {
|
||||
expect(+d3.select(this).attr('x')).toBeLessThan(0);
|
||||
});
|
||||
});
|
||||
|
||||
it('should update args to have inner y axis', function () {
|
||||
args.axis.y.inner = true;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have inner y axis', function () {
|
||||
var paddingLeft = chart.internal.getCurrentPaddingLeft(),
|
||||
tickTexts = chart.internal.main.selectAll('.c3-axis-y g.tick text');
|
||||
expect(paddingLeft).toBe(1);
|
||||
tickTexts.each(function () {
|
||||
expect(+d3.select(this).attr('x')).toBeGreaterThan(0);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('axis.y2.inner', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y2: {
|
||||
show: true,
|
||||
inner: false
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not have inner y axis', function () {
|
||||
var paddingRight = chart.internal.getCurrentPaddingRight(),
|
||||
tickTexts = chart.internal.main.selectAll('.c3-axis-2y g.tick text');
|
||||
expect(paddingRight).toBeGreaterThan(19);
|
||||
tickTexts.each(function () {
|
||||
expect(+d3.select(this).attr('x')).toBeGreaterThan(0);
|
||||
});
|
||||
});
|
||||
|
||||
it('should update args to have inner y axis', function () {
|
||||
args.axis.y2.inner = true;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have inner y axis', function () {
|
||||
var paddingRight = chart.internal.getCurrentPaddingRight(),
|
||||
tickTexts = chart.internal.main.selectAll('.c3-axis-2y g.tick text');
|
||||
expect(paddingRight).toBe(2);
|
||||
tickTexts.each(function () {
|
||||
expect(+d3.select(this).attr('x')).toBeLessThan(0);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
47
node_modules/c3/spec/c3-helper.js
generated
vendored
Normal file
47
node_modules/c3/spec/c3-helper.js
generated
vendored
Normal file
@@ -0,0 +1,47 @@
|
||||
function initDom() {
|
||||
'use strict';
|
||||
|
||||
var div = document.createElement('div');
|
||||
div.id = 'chart';
|
||||
div.style.width = '640px';
|
||||
div.style.height = '480px';
|
||||
document.body.appendChild(div);
|
||||
document.body.style.margin = '0px';
|
||||
}
|
||||
typeof initDom !== 'undefined';
|
||||
|
||||
function setMouseEvent(chart, name, x, y, element) {
|
||||
'use strict';
|
||||
|
||||
var paddingLeft = chart.internal.main.node().transform.baseVal.getItem(0).matrix.e,
|
||||
event = document.createEvent("MouseEvents");
|
||||
event.initMouseEvent(name, true, true, window,
|
||||
0, 0, 0, x + paddingLeft, y + 5,
|
||||
false, false, false, false, 0, null);
|
||||
chart.internal.d3.event = event;
|
||||
if (element) { element.dispatchEvent(event); }
|
||||
}
|
||||
typeof setMouseEvent !== 'undefined';
|
||||
|
||||
function initChart(chart, args, done) {
|
||||
'use strict';
|
||||
|
||||
if (typeof chart === 'undefined') {
|
||||
window.initDom();
|
||||
}
|
||||
if (args) {
|
||||
chart = window.c3.generate(args);
|
||||
window.d3 = chart.internal.d3;
|
||||
window.d3.select('.jasmine_html-reporter')
|
||||
.style('position', 'absolute')
|
||||
.style('width', '640px')
|
||||
.style('right', 0);
|
||||
}
|
||||
|
||||
window.setTimeout(function () {
|
||||
done();
|
||||
}, 10);
|
||||
|
||||
return chart;
|
||||
}
|
||||
typeof initChart !== 'undefined';
|
||||
10
node_modules/c3/spec/c3-spec.js
generated
vendored
Normal file
10
node_modules/c3/spec/c3-spec.js
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
describe('c3', function () {
|
||||
'use strict';
|
||||
|
||||
var c3 = window.c3;
|
||||
|
||||
it('exists', function () {
|
||||
expect(c3).not.toBeNull();
|
||||
expect(typeof c3).toBe('object');
|
||||
});
|
||||
});
|
||||
61
node_modules/c3/spec/class-spec.js
generated
vendored
Normal file
61
node_modules/c3/spec/class-spec.js
generated
vendored
Normal file
@@ -0,0 +1,61 @@
|
||||
describe('c3 chart class', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
|
||||
var args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2 prefix', 50, 20, 10, 40, 15, 25],
|
||||
['data3 мужчины', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
}
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('internal.getTargetSelectorSuffix', function () {
|
||||
|
||||
it('should not replace any characters', function () {
|
||||
var input = 'data1',
|
||||
expected = '-' + input,
|
||||
suffix = chart.internal.getTargetSelectorSuffix(input);
|
||||
expect(suffix).toBe(expected);
|
||||
});
|
||||
|
||||
it('should replace space to "-"', function () {
|
||||
var input = 'data1 suffix',
|
||||
expected = '-data1-suffix',
|
||||
suffix = chart.internal.getTargetSelectorSuffix(input);
|
||||
expect(suffix).toBe(expected);
|
||||
});
|
||||
|
||||
it('should replace space to "-" with multibyte characters', function () {
|
||||
var input = 'data1 suffix 日本語',
|
||||
expected = '-data1-suffix-日本語',
|
||||
suffix = chart.internal.getTargetSelectorSuffix(input);
|
||||
expect(suffix).toBe(expected);
|
||||
});
|
||||
|
||||
it('should replace special charactors to "-"', function () {
|
||||
var input = 'data1 !@#$%^&*()_=+,.<>"\':;[]/|?~`{}\\',
|
||||
expected = '-data1--------------------------------',
|
||||
suffix = chart.internal.getTargetSelectorSuffix(input);
|
||||
expect(suffix).toBe(expected);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('multibyte characters on chart', function () {
|
||||
|
||||
it('should replace space to "-" with multibyte characters', function () {
|
||||
var selector = '.c3-target-data3-мужчины';
|
||||
expect(chart.internal.main.select(selector).size()).toBe(1);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
158
node_modules/c3/spec/core-spec.js
generated
vendored
Normal file
158
node_modules/c3/spec/core-spec.js
generated
vendored
Normal file
@@ -0,0 +1,158 @@
|
||||
describe('c3 chart', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
|
||||
var args = {
|
||||
svg: {
|
||||
classname: 'customclass'
|
||||
},
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
]
|
||||
}
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('init', function () {
|
||||
|
||||
it('should be created', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(svg).not.toBeNull();
|
||||
});
|
||||
|
||||
it('should set 3rd party property to Function', function () {
|
||||
Function.prototype.$extIsFunction = true;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be created even if 3rd party property has been set', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(svg).not.toBeNull();
|
||||
});
|
||||
|
||||
it('should be created with a custom class', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(svg.attr('class')).not.toBeNull();
|
||||
expect(svg.attr('class')).toBe('customclass');
|
||||
});
|
||||
});
|
||||
|
||||
describe('size', function () {
|
||||
|
||||
it('should have same width', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(+svg.attr('width')).toBe(640);
|
||||
});
|
||||
|
||||
it('should have same height', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(+svg.attr('height')).toBe(480);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('bindto', function () {
|
||||
|
||||
describe('selector', function () {
|
||||
it('update args', function () {
|
||||
d3.select('#chart').html('');
|
||||
args.bindto = '#chart';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
it('should be created', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(svg.size()).toBe(1);
|
||||
});
|
||||
});
|
||||
|
||||
describe('d3.selection object', function () {
|
||||
it('update args', function () {
|
||||
d3.select('#chart').html('');
|
||||
args.bindto = d3.select('#chart');
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
it('should be created', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(svg.size()).toBe(1);
|
||||
});
|
||||
});
|
||||
|
||||
describe('null', function () {
|
||||
it('update args', function () {
|
||||
d3.select('#chart').html('');
|
||||
args.bindto = null;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
it('should not be created', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(svg.size()).toBe(0);
|
||||
});
|
||||
});
|
||||
|
||||
describe('empty string', function () {
|
||||
it('update args', function () {
|
||||
d3.select('#chart').html('');
|
||||
args.bindto = '';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
it('should not be created', function () {
|
||||
var svg = d3.select('#chart svg');
|
||||
expect(svg.size()).toBe(0);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('empty data', function () {
|
||||
|
||||
it('should upaate args for empty data', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1'],
|
||||
['data2']
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should generate a chart', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick');
|
||||
expect(ticks.size()).toBe(0);
|
||||
});
|
||||
|
||||
it('should upaate args for empty data', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x'],
|
||||
['data1'],
|
||||
['data2']
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'timeseries'
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should generate a chart', function () {
|
||||
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick');
|
||||
expect(ticks.size()).toBe(0);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
1308
node_modules/c3/spec/data-spec.js
generated
vendored
Normal file
1308
node_modules/c3/spec/data-spec.js
generated
vendored
Normal file
File diff suppressed because it is too large
Load Diff
133
node_modules/c3/spec/domain-spec.js
generated
vendored
Normal file
133
node_modules/c3/spec/domain-spec.js
generated
vendored
Normal file
@@ -0,0 +1,133 @@
|
||||
describe('c3 chart domain', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
|
||||
var args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y: {},
|
||||
y2: {}
|
||||
}
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('axis.y.min', function () {
|
||||
|
||||
it('should change axis.y.min to -100', function () {
|
||||
args.axis.y.min = -100;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be set properly when smaller than max of data', function () {
|
||||
var domain = chart.internal.y.domain();
|
||||
expect(domain[0]).toBe(-150);
|
||||
expect(domain[1]).toBe(450);
|
||||
});
|
||||
|
||||
it('should change axis.y.min to 500', function () {
|
||||
args.axis.y.min = 500;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be set properly when bigger than max of data', function () {
|
||||
var domain = chart.internal.y.domain();
|
||||
expect(domain[0]).toBe(499);
|
||||
expect(domain[1]).toBe(511);
|
||||
});
|
||||
|
||||
it('should change axis.y.min to undefined', function () {
|
||||
args.axis.y.min = undefined;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('axis.y.max', function () {
|
||||
|
||||
it('should change axis.y.max to 1000', function () {
|
||||
args.axis.y.max = 1000;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be set properly when bigger than min of data', function () {
|
||||
var domain = chart.internal.y.domain();
|
||||
expect(domain[0]).toBe(-89);
|
||||
expect(domain[1]).toBe(1099);
|
||||
});
|
||||
|
||||
it('should change axis.y.max to 0', function () {
|
||||
args.axis.y.max = 0;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be set properly when smaller than min of data', function () {
|
||||
var domain = chart.internal.y.domain();
|
||||
expect(domain[0]).toBe(-11);
|
||||
expect(domain[1]).toBe(1);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('axis.y.padding', function () {
|
||||
|
||||
it('should change axis.y.max to 1000', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 10, 20, 10, 40, 15, 25],
|
||||
['data2', 50, 40, 30, 45, 25, 45]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y: {
|
||||
padding: 200,
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be set properly when bigger than min of data', function () {
|
||||
var domain = chart.internal.y.domain();
|
||||
expect(domain[0]).toBeCloseTo(-9, -1);
|
||||
expect(domain[1]).toBeCloseTo(69, -1);
|
||||
});
|
||||
|
||||
it('should change axis.y.max to 1000 with top/bottom padding', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 10, 20, 10, 40, 15, 25],
|
||||
['data2', 50, 40, 30, 45, 25, 45]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y: {
|
||||
padding: {
|
||||
top: 200,
|
||||
bottom: 200
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be set properly when bigger than min of data', function () {
|
||||
var domain = chart.internal.y.domain();
|
||||
expect(domain[0]).toBeCloseTo(-9, -1);
|
||||
expect(domain[1]).toBeCloseTo(69, -1);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
365
node_modules/c3/spec/grid-spec.js
generated
vendored
Normal file
365
node_modules/c3/spec/grid-spec.js
generated
vendored
Normal file
@@ -0,0 +1,365 @@
|
||||
describe('c3 chart grid', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('y grid show', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
y: {
|
||||
tick: {
|
||||
}
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
y: {
|
||||
show: false
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not show y grids', function () {
|
||||
expect(chart.internal.main.select('.c3-ygrids').size()).toBe(0);
|
||||
});
|
||||
|
||||
it('should update args to show y grids', function () {
|
||||
args.grid.y.show = true;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show y grids', function () {
|
||||
var ygrids = chart.internal.main.select('.c3-ygrids');
|
||||
expect(ygrids.size()).toBe(1);
|
||||
expect(ygrids.selectAll('.c3-ygrid').size()).toBe(9);
|
||||
});
|
||||
|
||||
it('should update args to show only 3 y grids', function () {
|
||||
args.grid.y.ticks = 3;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show only 3 y grids', function () {
|
||||
var ygrids = chart.internal.main.select('.c3-ygrids');
|
||||
expect(ygrids.size()).toBe(1);
|
||||
expect(ygrids.selectAll('.c3-ygrid').size()).toBe(3);
|
||||
});
|
||||
|
||||
it('should update args to show y grids depending on y axis ticks', function () {
|
||||
args.axis.y.tick.count = 5;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show grids depending on y axis ticks', function () {
|
||||
var ygrids = chart.internal.main.select('.c3-ygrids'),
|
||||
expectedYs = [];
|
||||
ygrids.selectAll('.c3-ygrid').each(function (d, i) {
|
||||
expectedYs[i] = +d3.select(this).attr('y1');
|
||||
});
|
||||
expect(ygrids.size()).toBe(1);
|
||||
expect(ygrids.selectAll('.c3-ygrid').size()).toBe(5);
|
||||
chart.internal.main.select('.c3-axis-y').selectAll('.tick').each(function (d, i) {
|
||||
var t = d3.transform(d3.select(this).attr('transform'));
|
||||
expect(t.translate[1]).toBe(expectedYs[i]);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('y grid lines', function () {
|
||||
|
||||
describe('position', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 10, 200, 100, 400, 150, 250]
|
||||
]
|
||||
},
|
||||
grid: {
|
||||
y: {
|
||||
lines: [
|
||||
{value: 30, text: 'Label 30', position: 'start'},
|
||||
{value: 145, text: 'Label 145', position: 'middle'},
|
||||
{value: 225, text: 'Label 225'}
|
||||
]
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show 3 grid lines', function () {
|
||||
expect(chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line').size()).toBe(3);
|
||||
});
|
||||
|
||||
it('should locate grid lines properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'),
|
||||
expectedY1s = [373, 268, 196];
|
||||
lines.each(function (d, i) {
|
||||
var y1 = d3.select(this).select('line').attr('y1');
|
||||
expect(y1).toBeCloseTo(expectedY1s[i], -2);
|
||||
});
|
||||
});
|
||||
|
||||
it('should locate grid texts properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'),
|
||||
expectedPositions = ['start', 'middle', 'end'],
|
||||
expectedDxs = [4, 0, -4];
|
||||
lines.each(function (d, i) {
|
||||
var text = d3.select(this).select('text'),
|
||||
textAnchor = text.attr('text-anchor'),
|
||||
dx = text.attr('dx');
|
||||
expect(textAnchor).toBe(expectedPositions[i]);
|
||||
expect(+dx).toBe(expectedDxs[i]);
|
||||
});
|
||||
});
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 10, 200, 100, 400, 150, 250]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
rotated: true
|
||||
},
|
||||
grid: {
|
||||
y: {
|
||||
lines: [
|
||||
{value: 30, text: 'Label 30', position: 'start'},
|
||||
{value: 145, text: 'Label 145', position: 'middle'},
|
||||
{value: 225, text: 'Label 225'}
|
||||
]
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show 3 grid lines', function () {
|
||||
expect(chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line').size()).toBe(3);
|
||||
});
|
||||
|
||||
it('should locate grid lines properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'),
|
||||
expectedX1s = [75, 220, 321];
|
||||
lines.each(function (d, i) {
|
||||
var x1 = d3.select(this).select('line').attr('x1');
|
||||
expect(x1).toBeCloseTo(expectedX1s[i], -2);
|
||||
});
|
||||
});
|
||||
|
||||
it('should locate grid texts properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'),
|
||||
expectedPositions = ['start', 'middle', 'end'],
|
||||
expectedDxs = [4, 0, -4];
|
||||
lines.each(function (d, i) {
|
||||
var text = d3.select(this).select('text'),
|
||||
textAnchor = text.attr('text-anchor'),
|
||||
dx = text.attr('dx');
|
||||
expect(textAnchor).toBe(expectedPositions[i]);
|
||||
expect(+dx).toBe(expectedDxs[i]);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
describe('x grid lines', function () {
|
||||
|
||||
describe('position', function () {
|
||||
|
||||
it('should have correct height', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400],
|
||||
]
|
||||
},
|
||||
grid: {
|
||||
x: {
|
||||
lines: [
|
||||
{value: 1, text: 'Label 1', position: 'start'},
|
||||
{value: 2, text: 'Label 2', position: 'middle'},
|
||||
{value: 3, text: 'Label 3'},
|
||||
]
|
||||
}
|
||||
},
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show 3 grid lines', function () {
|
||||
expect(chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line').size()).toBe(3);
|
||||
});
|
||||
|
||||
it('should locate grid lines properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'),
|
||||
expectedX1s = [202, 397, 593];
|
||||
lines.each(function (d, i) {
|
||||
var x1 = d3.select(this).select('line').attr('x1');
|
||||
expect(x1).toBeCloseTo(expectedX1s[i], -2);
|
||||
});
|
||||
});
|
||||
|
||||
it('should locate grid texts properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'),
|
||||
expectedPositions = ['start', 'middle', 'end'],
|
||||
expectedDxs = [4, 0, -4];
|
||||
lines.each(function (d, i) {
|
||||
var text = d3.select(this).select('text'),
|
||||
textAnchor = text.attr('text-anchor'),
|
||||
dx = text.attr('dx');
|
||||
expect(textAnchor).toBe(expectedPositions[i]);
|
||||
expect(+dx).toBe(expectedDxs[i]);
|
||||
});
|
||||
});
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400],
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
rotated: true
|
||||
},
|
||||
grid: {
|
||||
x: {
|
||||
lines: [
|
||||
{value: 1, text: 'Label 1', position: 'start'},
|
||||
{value: 2, text: 'Label 2', position: 'middle'},
|
||||
{value: 3, text: 'Label 3'},
|
||||
]
|
||||
}
|
||||
},
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show 3 grid lines', function () {
|
||||
expect(chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line').size()).toBe(3);
|
||||
});
|
||||
|
||||
it('should locate grid lines properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'),
|
||||
expectedY1s = [144, 283, 421];
|
||||
lines.each(function (d, i) {
|
||||
var y1 = d3.select(this).select('line').attr('y1');
|
||||
expect(y1).toBeCloseTo(expectedY1s[i], -2);
|
||||
});
|
||||
});
|
||||
|
||||
it('should locate grid texts properly', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'),
|
||||
expectedPositions = ['start', 'middle', 'end'],
|
||||
expectedDxs = [4, 0, -4];
|
||||
lines.each(function (d, i) {
|
||||
var text = d3.select(this).select('text'),
|
||||
textAnchor = text.attr('text-anchor'),
|
||||
dx = text.attr('dx');
|
||||
expect(textAnchor).toBe(expectedPositions[i]);
|
||||
expect(+dx).toBe(expectedDxs[i]);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('with padding.top', function () {
|
||||
|
||||
it('should have correct height', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400],
|
||||
]
|
||||
},
|
||||
grid: {
|
||||
x: {
|
||||
lines: [
|
||||
{value: 3, text: 'Label 3'}
|
||||
]
|
||||
}
|
||||
},
|
||||
padding: {
|
||||
top: 50
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show x grid lines', function () {
|
||||
var lines = chart.internal.main.select('.c3-xgrid-lines .c3-xgrid-line'),
|
||||
expectedX1 = 593,
|
||||
expectedText = ['Label 3'];
|
||||
lines.each(function (id, i) {
|
||||
var line = d3.select(this),
|
||||
l = line.select('line'),
|
||||
t = line.select('text');
|
||||
expect(+l.attr('x1')).toBeCloseTo(expectedX1, -2);
|
||||
expect(t.text()).toBe(expectedText[i]);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('on category axis', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 'a', 'b', 'c', 'd'],
|
||||
['data1', 30, 200, 100, 400],
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'category'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
x: {
|
||||
lines: [
|
||||
{value: 3, text: 'Label 3'},
|
||||
{value: 'a', text: 'Label a'}
|
||||
]
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show x grid lines', function () {
|
||||
var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'),
|
||||
expectedX1 = [515, 74],
|
||||
expectedText = ['Label 3', 'Label a'];
|
||||
lines.each(function (id, i) {
|
||||
var line = d3.select(this),
|
||||
l = line.select('line'),
|
||||
t = line.select('text');
|
||||
expect(+l.attr('x1')).toBeCloseTo(expectedX1[i], -2);
|
||||
expect(t.text()).toBe(expectedText[i]);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
116
node_modules/c3/spec/interaction-spec.js
generated
vendored
Normal file
116
node_modules/c3/spec/interaction-spec.js
generated
vendored
Normal file
@@ -0,0 +1,116 @@
|
||||
describe('c3 chart interaction', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('generate event rects', function () {
|
||||
|
||||
describe('custom x', function () {
|
||||
|
||||
it('should generate bar chart', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 0, 1000, 3000, 10000],
|
||||
['data', 10, 10, 10, 10]
|
||||
],
|
||||
type: 'bar'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 4 event rects properly', function () {
|
||||
var lefts = [78, 138, 205.5, 407.5],
|
||||
widths = [60, 67.5, 202, 194];
|
||||
d3.selectAll('.c3-event-rect').each(function (d, i) {
|
||||
var box = d3.select(this).node().getBoundingClientRect();
|
||||
expect(box.left).toBeCloseTo(lefts[i], -2);
|
||||
expect(box.width).toBeCloseTo(widths[i], -2);
|
||||
});
|
||||
});
|
||||
|
||||
it('should generate bar chart with only one data', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', 0],
|
||||
['data', 10]
|
||||
],
|
||||
type: 'bar'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 1 event rects properly', function () {
|
||||
var eventRects = d3.selectAll('.c3-event-rect');
|
||||
expect(eventRects.size()).toBe(1);
|
||||
eventRects.each(function () {
|
||||
var box = d3.select(this).node().getBoundingClientRect();
|
||||
expect(box.left).toBeCloseTo(40.5, -2);
|
||||
expect(box.width).toBeCloseTo(598, -2);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('timeseries', function () {
|
||||
|
||||
it('should generate line chart with timeseries', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', '20140101', '20140201', '20140210', '20140301'],
|
||||
['data', 10, 10, 10, 10]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 4 event rects properly', function () {
|
||||
var lefts = [43.5, 193, 353, 500],
|
||||
widths = [149.5, 160, 147, 136];
|
||||
d3.selectAll('.c3-event-rect').each(function (d, i) {
|
||||
var box = d3.select(this).node().getBoundingClientRect();
|
||||
expect(box.left).toBeCloseTo(lefts[i], -2);
|
||||
expect(box.width).toBeCloseTo(widths[i], -2);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
it('should generate line chart with only 1 data timeseries', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'x',
|
||||
columns: [
|
||||
['x', '20140101'],
|
||||
['data', 10]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have 1 event rects properly', function () {
|
||||
var eventRects = d3.selectAll('.c3-event-rect');
|
||||
expect(eventRects.size()).toBe(1);
|
||||
eventRects.each(function () {
|
||||
var box = d3.select(this).node().getBoundingClientRect();
|
||||
expect(box.left).toBeCloseTo(40.5, -2);
|
||||
expect(box.width).toBeCloseTo(598, -2);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
278
node_modules/c3/spec/legend-spec.js
generated
vendored
Normal file
278
node_modules/c3/spec/legend-spec.js
generated
vendored
Normal file
@@ -0,0 +1,278 @@
|
||||
describe('c3 chart legend', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('legend when multiple charts rendered', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30],
|
||||
['data2', 50],
|
||||
['data3', 100]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should update args with long data names', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['long data name 1', 30],
|
||||
['long data name 2', 50],
|
||||
['long data name 3', 50],
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have properly computed legend width', function () {
|
||||
var expectedLeft = [148, 226, 384],
|
||||
expectedWidth = [118, 118, 108];
|
||||
d3.selectAll('.c3-legend-item').each(function (d, i) {
|
||||
var rect = d3.select(this).node().getBoundingClientRect();
|
||||
expect(rect.left).toBeCloseTo(expectedLeft[i], -2);
|
||||
expect(rect.width).toBeCloseTo(expectedWidth[i], -2);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('legend position', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
]
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be located on the center of chart', function () {
|
||||
var box = chart.internal.legend.node().getBoundingClientRect();
|
||||
expect(box.left + box.right).toBe(640);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('legend as inset', function () {
|
||||
|
||||
it('should change the legend to "inset" successfully', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25]
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
position: 'inset',
|
||||
inset: {
|
||||
step: null
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be positioned properly', function () {
|
||||
var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
|
||||
expect(box.top).toBe(5.5);
|
||||
expect(box.left).toBeGreaterThan(30);
|
||||
});
|
||||
|
||||
it('should have automatically calculated height', function () {
|
||||
var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
|
||||
expect(box.height).toBe(48);
|
||||
});
|
||||
|
||||
it('should change the legend step to 1 successfully', function () {
|
||||
args.legend.inset.step = 1;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have automatically calculated height', function () {
|
||||
var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
|
||||
expect(box.height).toBe(28);
|
||||
});
|
||||
|
||||
it('should change the legend step to 2 successfully', function () {
|
||||
args.legend.inset.step = 2;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should have automatically calculated height', function () {
|
||||
var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
|
||||
expect(box.height).toBe(48);
|
||||
});
|
||||
|
||||
it('should update args to have only one series', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
position: 'inset'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should locate legend properly', function () {
|
||||
var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
|
||||
expect(box.height).toBe(28);
|
||||
expect(box.width).toBeGreaterThan(64);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('legend.hide', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 130, 100, 200, 100, 250, 150]
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
hide: true
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not show legends', function () {
|
||||
d3.selectAll('.c3-legend-item').each(function () {
|
||||
expect(d3.select(this).style('visibility')).toBe('hidden');
|
||||
});
|
||||
});
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 130, 100, 200, 100, 250, 150]
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
hide: 'data2'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not show legends', function () {
|
||||
expect(d3.select('.c3-legend-item-data1').style('visibility')).toBe('visible');
|
||||
expect(d3.select('.c3-legend-item-data2').style('visibility')).toBe('hidden');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('legend.show', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 130, 100, 200, 100, 250, 150]
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
show: false
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not initially have rendered any legend items', function () {
|
||||
expect(d3.selectAll('.c3-legend-item').empty()).toBe(true);
|
||||
});
|
||||
|
||||
it('allows us to show the legend on showLegend call', function () {
|
||||
chart.legend.show();
|
||||
d3.selectAll('.c3-legend-item').each(function () {
|
||||
expect(d3.select(this).style('visibility')).toBe('visible');
|
||||
// This selects all the children, but we expect it to be empty
|
||||
expect(d3.select(this).selectAll("*").length).not.toEqual(0);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('custom legend size', function() {
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 130, 100, 200, 100, 250, 150]
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
item: {
|
||||
tile: {
|
||||
width: 15,
|
||||
height: 2
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('renders the legend item with the correct width and height', function () {
|
||||
d3.selectAll('.c3-legend-item-tile').each(function () {
|
||||
expect(d3.select(this).style('stroke-width')).toBe(args.legend.item.tile.height + 'px');
|
||||
var tileWidth = d3.select(this).attr('x2') - d3.select(this).attr('x1');
|
||||
expect(tileWidth).toBe(args.legend.item.tile.width);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('custom legend padding', function() {
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['padded1', 30, 200, 100, 400, 150, 250],
|
||||
['padded2', 130, 100, 200, 100, 250, 150]
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
padding: 10
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('renders the correct amount of padding on the legend element', function () {
|
||||
d3.selectAll('.c3-legend-item-padded1 .c3-legend-item-tile, .c3-legend-item-padded2 .c3-legend-item-tile').each(function (el, index) {
|
||||
var itemWidth = d3.select(this).node().parentNode.getBBox().width,
|
||||
textBoxWidth = d3.select(d3.select(this).node().parentNode).select('text').node().getBBox().width,
|
||||
tileWidth = 15, // default value is 10, plus 5 more for padding
|
||||
expectedWidth = textBoxWidth + tileWidth + (index ? 0 : 10) + args.legend.padding;
|
||||
|
||||
expect(itemWidth).toBe(expectedWidth);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
181
node_modules/c3/spec/shape.bar-spec.js
generated
vendored
Normal file
181
node_modules/c3/spec/shape.bar-spec.js
generated
vendored
Normal file
@@ -0,0 +1,181 @@
|
||||
var setMouseEvent = window.setMouseEvent;
|
||||
|
||||
describe('c3 chart shape bar', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('with groups', function () {
|
||||
|
||||
describe('with indexed data', function () {
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, -100, 400, -150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
],
|
||||
groups: [
|
||||
['data1', 'data2'],
|
||||
],
|
||||
type: 'bar'
|
||||
},
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
it('should be stacked', function () {
|
||||
var expectedBottom = [275, 293, 365, 281, 395, 290];
|
||||
chart.internal.main.selectAll('.c3-bars-data1 .c3-bar').each(function (d, i) {
|
||||
var rect = d3.select(this).node().getBoundingClientRect();
|
||||
expect(rect.bottom).toBeCloseTo(expectedBottom[i], -1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('with timeseries data', function () {
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'date',
|
||||
columns: [
|
||||
['date', '2012-12-24', '2012-12-25', '2012-12-26', '2012-12-27', '2012-12-28', '2012-12-29'],
|
||||
['data1', 30, 200, -100, 400, -150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
],
|
||||
groups: [
|
||||
['data1', 'data2'],
|
||||
],
|
||||
type: 'bar'
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'timeseries',
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
it('should be stacked', function () {
|
||||
var expectedBottom = [275, 293, 365, 281, 395, 290];
|
||||
chart.internal.main.selectAll('.c3-bars-data1 .c3-bar').each(function (d, i) {
|
||||
var rect = d3.select(this).node().getBoundingClientRect();
|
||||
expect(rect.bottom).toBeCloseTo(expectedBottom[i], -1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('with category data', function () {
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
x: 'date',
|
||||
columns: [
|
||||
['date', '2012-12-24', '2012-12-25', '2012-12-26', '2012-12-27', '2012-12-28', '2012-12-29'],
|
||||
['data1', 30, 200, -100, 400, -150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
],
|
||||
groups: [
|
||||
['data1', 'data2'],
|
||||
],
|
||||
type: 'bar'
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'category',
|
||||
}
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
it('should be stacked', function () {
|
||||
var expectedBottom = [275, 293, 365, 281, 395, 290];
|
||||
chart.internal.main.selectAll('.c3-bars-data1 .c3-bar').each(function (d, i) {
|
||||
var rect = d3.select(this).node().getBoundingClientRect();
|
||||
expect(rect.bottom).toBeCloseTo(expectedBottom[i], -1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('internal.isWithinBar', function () {
|
||||
|
||||
describe('with normal axis', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, -150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', -150, 120, 110, 140, 115, 125]
|
||||
],
|
||||
type: 'bar'
|
||||
},
|
||||
axis: {
|
||||
rotated: false
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not be within bar', function () {
|
||||
var bar = d3.select('.c3-target-data1 .c3-bar-0').node();
|
||||
setMouseEvent(chart, 'click', 0, 0);
|
||||
expect(chart.internal.isWithinBar(bar)).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should be within bar', function () {
|
||||
var bar = d3.select('.c3-target-data1 .c3-bar-0').node();
|
||||
setMouseEvent(chart, 'click', 31, 280);
|
||||
expect(chart.internal.isWithinBar(bar)).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not be within bar of negative value', function () {
|
||||
var bar = d3.select('.c3-target-data3 .c3-bar-0').node();
|
||||
setMouseEvent(chart, 'click', 68, 280);
|
||||
expect(chart.internal.isWithinBar(bar)).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should be within bar of negative value', function () {
|
||||
var bar = d3.select('.c3-target-data3 .c3-bar-0').node();
|
||||
setMouseEvent(chart, 'click', 68, 350);
|
||||
expect(chart.internal.isWithinBar(bar)).toBeTruthy();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('with rotated axis', function () {
|
||||
|
||||
it('should change the chart as axis rotated', function () {
|
||||
args.axis.rotated = true;
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not be within bar', function () {
|
||||
var bar = d3.select('.c3-target-data1 .c3-bar-0').node();
|
||||
setMouseEvent(chart, 'click', 0, 0);
|
||||
expect(chart.internal.isWithinBar(bar)).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should be within bar', function () {
|
||||
var bar = d3.select('.c3-target-data1 .c3-bar-0').node();
|
||||
setMouseEvent(chart, 'click', 190, 20);
|
||||
expect(chart.internal.isWithinBar(bar)).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should be within bar of negative value', function () {
|
||||
var bar = d3.select('.c3-target-data3 .c3-bar-0').node();
|
||||
setMouseEvent(chart, 'click', 68, 50);
|
||||
expect(chart.internal.isWithinBar(bar)).toBeTruthy();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
170
node_modules/c3/spec/shape.line-spec.js
generated
vendored
Normal file
170
node_modules/c3/spec/shape.line-spec.js
generated
vendored
Normal file
@@ -0,0 +1,170 @@
|
||||
describe('c3 chart shape line', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
var parseSvgPath = window.parseSvgPath;
|
||||
|
||||
describe('shape-rendering for line chart', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, -150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', -150, 120, 110, 140, 115, 125]
|
||||
],
|
||||
type: 'line'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
|
||||
});
|
||||
|
||||
it("Should render the lines correctly", function(done) {
|
||||
setTimeout(function () {
|
||||
var target = chart.internal.main.select('.c3-chart-line.c3-target-data1');
|
||||
var commands = parseSvgPath( target.select('.c3-line-data1').attr('d'));
|
||||
expect(commands.length).toBe(6);
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it("should not have shape-rendering when it's line chart", function () {
|
||||
d3.selectAll('.c3-line').each(function () {
|
||||
var style = d3.select(this).style('shape-rendering');
|
||||
expect(style).toBe('auto');
|
||||
});
|
||||
});
|
||||
|
||||
it('should change to step chart', function () {
|
||||
args.data.type = 'step';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it("should have shape-rendering = crispedges when it's step chart", function () {
|
||||
d3.selectAll('.c3-line').each(function () {
|
||||
var style = d3.select(this).style('shape-rendering').toLowerCase();
|
||||
expect(style).toBe('crispedges');
|
||||
});
|
||||
});
|
||||
|
||||
it('should change to spline chart', function () {
|
||||
args.data.type = 'spline';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should use cardinal interpolation by default', function () {
|
||||
expect(chart.internal.config.spline_interpolation_type).toBe('cardinal');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('point.show option', function () {
|
||||
|
||||
it('should change args to include null data', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, null, 100, 400, -150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', -150, 120, 110, 140, 115, 125]
|
||||
],
|
||||
type: 'line'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should not show the circle for null', function (done) {
|
||||
setTimeout(function () {
|
||||
var target = chart.internal.main.select('.c3-chart-line.c3-target-data1');
|
||||
expect(+target.select('.c3-circle-0').style('opacity')).toBe(1);
|
||||
expect(+target.select('.c3-circle-1').style('opacity')).toBe(0);
|
||||
expect(+target.select('.c3-circle-2').style('opacity')).toBe(1);
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
it('should not draw a line segment for null data', function(done) {
|
||||
setTimeout(function () {
|
||||
var target = chart.internal.main.select('.c3-chart-line.c3-target-data1');
|
||||
var commands = parseSvgPath( target.select('.c3-line-data1').attr('d'));
|
||||
var segments = 0;
|
||||
for(var i = 0; i < commands.length; i++) {
|
||||
(commands[i].command === 'L') ? segments++ : null;
|
||||
}
|
||||
expect(segments).toBe(3);
|
||||
done();
|
||||
}, 500);
|
||||
});
|
||||
|
||||
// it('should change args to include null data on scatter plot', function () {
|
||||
// args = {
|
||||
// data: {
|
||||
// columns: [
|
||||
// ['data1', 30, null, 100, 400, -150, 250],
|
||||
// ['data2', 50, 20, 10, 40, 15, 25],
|
||||
// ['data3', -150, 120, 110, 140, 115, 125]
|
||||
// ],
|
||||
// type: 'scatter'
|
||||
// }
|
||||
// };
|
||||
// expect(true).toBeTruthy();
|
||||
// });
|
||||
|
||||
// it('should not show the circle for null', function (done) {
|
||||
// setTimeout(function () {
|
||||
// var target = chart.internal.main.select('.c3-chart-line.c3-target-data1');
|
||||
// expect(+target.select('.c3-circle-0').style('opacity')).toBe(0.5);
|
||||
// expect(+target.select('.c3-circle-1').style('opacity')).toBe(0);
|
||||
// expect(+target.select('.c3-circle-2').style('opacity')).toBe(0.5);
|
||||
// done();
|
||||
// }, 500);
|
||||
// });
|
||||
|
||||
});
|
||||
|
||||
describe('spline.interpolation option', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, -150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', -150, 120, 110, 140, 115, 125]
|
||||
],
|
||||
type: 'spline'
|
||||
},
|
||||
spline: {
|
||||
interpolation: {
|
||||
type: 'monotone'
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should update interpolation function', function() {
|
||||
expect(chart.internal.getInterpolate(chart.data()[0])).toBe('monotone');
|
||||
});
|
||||
|
||||
it('should not use a non-valid interpolation', function () {
|
||||
args.spline.interpolation.type = 'foo';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should use cardinal interpolation when given option is not valid', function() {
|
||||
expect(chart.internal.getInterpolate(chart.data()[0])).toBe('cardinal');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
50
node_modules/c3/spec/svg-helper.js
generated
vendored
Normal file
50
node_modules/c3/spec/svg-helper.js
generated
vendored
Normal file
@@ -0,0 +1,50 @@
|
||||
/**
|
||||
* Parse the d property of an SVG path into an array of drawing commands.
|
||||
* @param {String} d SvgPath d attribute.]
|
||||
* @return {Array} an array of drawing commands.
|
||||
*/
|
||||
|
||||
function parseSvgPath(d) { //jshint ignore:line
|
||||
'use strict';
|
||||
|
||||
var commands = [];
|
||||
var commandTokens = ['M','L','I','H','V','C','S','Q','T','A'];
|
||||
var command;
|
||||
var in_x = false;
|
||||
var in_y = false;
|
||||
var x = '';
|
||||
var y = '';
|
||||
for(var i = 0; i <= d.length; i++) {
|
||||
if (commandTokens.indexOf(d[i]) !== -1) {
|
||||
if (in_x || in_y) {
|
||||
commands.push({command: command, x: x, y: y});
|
||||
x = '';
|
||||
y = '';
|
||||
}
|
||||
command = d[i];
|
||||
in_x = true;
|
||||
in_y = false;
|
||||
}
|
||||
else {
|
||||
if (d[i] === ',') {
|
||||
if (in_y) {
|
||||
commands.push({command: command, x: x, y: y});
|
||||
x = '';
|
||||
y = '';
|
||||
}
|
||||
in_x = !in_x;
|
||||
in_y = !in_y;
|
||||
}
|
||||
else if (in_x) {
|
||||
x += d[i];
|
||||
}
|
||||
else if (in_y) {
|
||||
y += d[i];
|
||||
}
|
||||
}
|
||||
}
|
||||
if (d[i] !== ',' && in_y) {
|
||||
commands.push({command: command, x: x, y: y});
|
||||
}
|
||||
return commands;
|
||||
}
|
||||
98
node_modules/c3/spec/title-spec.js
generated
vendored
Normal file
98
node_modules/c3/spec/title-spec.js
generated
vendored
Normal file
@@ -0,0 +1,98 @@
|
||||
describe('c3 chart title', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, config;
|
||||
|
||||
describe('when given a title config option', function () {
|
||||
describe('with no padding and no position', function () {
|
||||
beforeEach(function(done) {
|
||||
config = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250]
|
||||
]
|
||||
},
|
||||
title: {
|
||||
text: 'new title'
|
||||
}
|
||||
};
|
||||
chart = window.initChart(chart, config, done);
|
||||
});
|
||||
|
||||
it('renders the title at the default config position', function () {
|
||||
var titleEl = d3.select(".c3-title");
|
||||
expect(+titleEl.attr("x")).toBeCloseTo(294, -2);
|
||||
expect(+titleEl.attr("y")).toEqual(titleEl.node().getBBox().height);
|
||||
});
|
||||
|
||||
it('renders the title text', function () {
|
||||
var titleEl = d3.select(".c3-title");
|
||||
expect(titleEl.node().textContent).toEqual('new title');
|
||||
});
|
||||
});
|
||||
|
||||
describe('with padding', function () {
|
||||
var config, getConfig = function (titlePosition) {
|
||||
return {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250]
|
||||
]
|
||||
},
|
||||
title: {
|
||||
text: 'positioned title',
|
||||
padding: {
|
||||
top: 20,
|
||||
right: 30,
|
||||
bottom: 40,
|
||||
left: 50
|
||||
},
|
||||
position: titlePosition
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
describe('and position center', function () {
|
||||
beforeEach(function(done) {
|
||||
config = getConfig('top-center');
|
||||
chart = window.initChart(chart, config, done);
|
||||
});
|
||||
it('renders the title at the default config position', function () {
|
||||
var titleEl = d3.select(".c3-title");
|
||||
expect(+titleEl.attr("x")).toBeCloseTo(275, -2);
|
||||
expect(+titleEl.attr("y")).toBeCloseTo(34, -1);
|
||||
});
|
||||
it('adds the correct amount of padding to fit the title', function() {
|
||||
expect(chart.internal.getCurrentPaddingTop()).toEqual(
|
||||
config.title.padding.top + d3.select('.c3-title').node().getBBox().height + config.title.padding.bottom
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe('and position left', function () {
|
||||
beforeEach(function(done) {
|
||||
config = getConfig('top-left');
|
||||
chart = window.initChart(chart, config, done);
|
||||
});
|
||||
it('renders the title at the default config position', function () {
|
||||
var titleEl = d3.select(".c3-title");
|
||||
expect(+titleEl.attr("x")).toBeCloseTo(50, -1);
|
||||
expect(+titleEl.attr("y")).toBeCloseTo(34, -1);
|
||||
});
|
||||
});
|
||||
|
||||
describe('and position right', function () {
|
||||
beforeEach(function(done) {
|
||||
config = getConfig('top-right');
|
||||
chart = window.initChart(chart, config, done);
|
||||
});
|
||||
it('renders the title at the default config position', function () {
|
||||
var titleEl = d3.select(".c3-title");
|
||||
expect(+titleEl.attr("x")).toBeCloseTo(520, -2);
|
||||
expect(+titleEl.attr("y")).toBeCloseTo(34, -1);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
});
|
||||
122
node_modules/c3/spec/tooltip-spec.js
generated
vendored
Normal file
122
node_modules/c3/spec/tooltip-spec.js
generated
vendored
Normal file
@@ -0,0 +1,122 @@
|
||||
describe('c3 chart tooltip', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
var tooltipConfiguration;
|
||||
|
||||
var args = function () {
|
||||
return {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
],
|
||||
},
|
||||
tooltip: tooltipConfiguration
|
||||
};
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args(), done);
|
||||
});
|
||||
|
||||
describe('tooltip position', function () {
|
||||
beforeAll(function () {
|
||||
tooltipConfiguration = {};
|
||||
});
|
||||
|
||||
describe('without left margin', function () {
|
||||
|
||||
it('should show tooltip on proper position', function () {
|
||||
var eventRect = d3.select('.c3-event-rect-2').node();
|
||||
window.setMouseEvent(chart, 'mousemove', 100, 100, eventRect);
|
||||
|
||||
var tooltipContainer = d3.select('.c3-tooltip-container'),
|
||||
top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')),
|
||||
left = Math.floor(+tooltipContainer.style('left').replace(/px/, '')),
|
||||
topExpected = 115,
|
||||
leftExpected = 280;
|
||||
expect(top).toBe(topExpected);
|
||||
expect(left).toBeGreaterThan(leftExpected);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('with left margin', function () {
|
||||
|
||||
it('should set left margin', function () {
|
||||
d3.select('#chart').style('margin-left', '300px');
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should show tooltip on proper position', function () {
|
||||
var eventRect = d3.select('.c3-event-rect-2').node();
|
||||
window.setMouseEvent(chart, 'mousemove', 100, 100, eventRect);
|
||||
|
||||
var tooltipContainer = d3.select('.c3-tooltip-container'),
|
||||
top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')),
|
||||
left = Math.floor(+tooltipContainer.style('left').replace(/px/, '')),
|
||||
topExpected = 115,
|
||||
leftExpected = 280;
|
||||
expect(top).toBe(topExpected);
|
||||
expect(left).toBeGreaterThan(leftExpected);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('tooltip positionFunction', function () {
|
||||
var topExpected = 37, leftExpected = 79;
|
||||
|
||||
beforeAll(function () {
|
||||
tooltipConfiguration = {
|
||||
position: function (data, width, height, element) {
|
||||
expect(data.length).toBe(args().data.columns.length);
|
||||
expect(data[0]).toEqual(jasmine.objectContaining({
|
||||
index: 2,
|
||||
value: 100,
|
||||
id: 'data1'
|
||||
}));
|
||||
expect(width).toBeGreaterThan(0);
|
||||
expect(height).toBeGreaterThan(0);
|
||||
expect(element).toBe(d3.select('.c3-event-rect-2').node());
|
||||
return {top: topExpected, left: leftExpected};
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
it('should be set to the coordinate where the function returned', function () {
|
||||
var eventRect = d3.select('.c3-event-rect-2').node();
|
||||
window.setMouseEvent(chart, 'mousemove', 100, 100, eventRect);
|
||||
|
||||
var tooltipContainer = d3.select('.c3-tooltip-container'),
|
||||
top = Math.floor(+tooltipContainer.style('top').replace(/px/, '')),
|
||||
left = Math.floor(+tooltipContainer.style('left').replace(/px/, ''));
|
||||
expect(top).toBe(topExpected);
|
||||
expect(left).toBe(leftExpected);
|
||||
});
|
||||
});
|
||||
|
||||
describe('tooltip getTooltipContent', function () {
|
||||
beforeAll(function () {
|
||||
tooltipConfiguration = {
|
||||
data_order: 'desc'
|
||||
};
|
||||
});
|
||||
|
||||
it('should sort values desc', function () {
|
||||
var eventRect = d3.select('.c3-event-rect-2').node();
|
||||
window.setMouseEvent(chart, 'mousemove', 100, 100, eventRect);
|
||||
|
||||
var tooltipTable = d3.select('.c3-tooltip')[0];
|
||||
var expected = ["", "c3-tooltip-name--data3",
|
||||
"c3-tooltip-name--data1", "c3-tooltip-name--data2"];
|
||||
var i;
|
||||
for (i = 0; i < tooltipTable[0].rows.length; i++) {
|
||||
expect(tooltipTable[0].rows[i].className).toBe(expected[i]);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
137
node_modules/c3/spec/type-spec.js
generated
vendored
Normal file
137
node_modules/c3/spec/type-spec.js
generated
vendored
Normal file
@@ -0,0 +1,137 @@
|
||||
describe('c3 chart types', function () {
|
||||
'use strict';
|
||||
|
||||
var chart, args;
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('internal.hasArcType', function () {
|
||||
|
||||
describe('with data', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
],
|
||||
type: 'pie'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return true', function () {
|
||||
expect(chart.internal.hasArcType()).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should change chart type to "bar"', function () {
|
||||
args.data.type = 'bar';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return false', function () {
|
||||
expect(chart.internal.hasArcType()).toBeFalsy();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('with empty data', function () {
|
||||
|
||||
it('should update args to have empty data', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [],
|
||||
type: 'pie'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return true', function () {
|
||||
expect(chart.internal.hasArcType()).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should change chart type to "bar"', function () {
|
||||
args.data.type = 'bar';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return false', function () {
|
||||
expect(chart.internal.hasArcType()).toBeFalsy();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('internal.hasType', function () {
|
||||
|
||||
it('should update args', function () {
|
||||
args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 25],
|
||||
['data3', 150, 120, 110, 140, 115, 125]
|
||||
],
|
||||
type: 'pie'
|
||||
}
|
||||
};
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return true for "pie" type', function () {
|
||||
expect(chart.internal.hasType('pie')).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return false for "line" type', function () {
|
||||
expect(chart.internal.hasType('line')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should return false for "bar" type', function () {
|
||||
expect(chart.internal.hasType('bar')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should unload successfully', function () {
|
||||
chart.unload([]);
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return true for "pie" type even if no data', function () {
|
||||
expect(chart.internal.hasType('pie')).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return false for "line" type even if no data', function () {
|
||||
expect(chart.internal.hasType('line')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should return false for "bar" type even if no data', function () {
|
||||
expect(chart.internal.hasType('bar')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should change chart type to "bar" successfully', function () {
|
||||
args.data.type = 'bar';
|
||||
expect(true).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return false for "pie" type even if no data', function () {
|
||||
expect(chart.internal.hasType('pie')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should return false for "line" type even if no data', function () {
|
||||
expect(chart.internal.hasType('line')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should return true for "bar" type even if no data', function () {
|
||||
expect(chart.internal.hasType('bar')).toBeTruthy();
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
67
node_modules/c3/spec/zoom-spec.js
generated
vendored
Normal file
67
node_modules/c3/spec/zoom-spec.js
generated
vendored
Normal file
@@ -0,0 +1,67 @@
|
||||
describe('c3 chart zoom', function () {
|
||||
'use strict';
|
||||
|
||||
var chart;
|
||||
|
||||
var args = {
|
||||
data: {
|
||||
columns: [
|
||||
['data1', 30, 200, 100, 400, 3150, 250],
|
||||
['data2', 50, 20, 10, 40, 15, 6025]
|
||||
]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
extent: [1, 2]
|
||||
}
|
||||
},
|
||||
zoom: {
|
||||
enable: true
|
||||
},
|
||||
subchart: {
|
||||
show: true
|
||||
}
|
||||
};
|
||||
|
||||
beforeEach(function (done) {
|
||||
chart = window.initChart(chart, args, done);
|
||||
});
|
||||
|
||||
describe('default extent', function () {
|
||||
|
||||
describe('main chart domain', function () {
|
||||
|
||||
it('should have original y domain', function () {
|
||||
var yDomain = chart.internal.y.domain(),
|
||||
expectedYDomain = [-591.5, 6626.5];
|
||||
expect(yDomain[0]).toBe(expectedYDomain[0]);
|
||||
expect(yDomain[1]).toBe(expectedYDomain[1]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('main chart domain', function () {
|
||||
|
||||
it('should have original y domain in subchart', function () {
|
||||
var yDomain = chart.internal.y.domain(),
|
||||
subYDomain = chart.internal.subY.domain();
|
||||
expect(subYDomain[0]).toBe(yDomain[0]);
|
||||
expect(subYDomain[1]).toBe(yDomain[1]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('main chart domain', function () {
|
||||
|
||||
it('should have specified brush extent', function () {
|
||||
var brushExtent = chart.internal.brush.extent(),
|
||||
expectedBrushExtent = [1, 2];
|
||||
expect(brushExtent[0]).toBe(expectedBrushExtent[0]);
|
||||
expect(brushExtent[1]).toBe(expectedBrushExtent[1]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
Reference in New Issue
Block a user