playground
/
c3
mirror of https://github.com/masayuki0812/c3.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

🎉 All non-asserting specs removed. Fixes #2047. (#2050) 

* 🎉 All non-asserting specs removed. Fixes #2047.

* Removing 'should update' strings

* Further text tweaks
pull/1576/merge
Ændrew Rininsland 8 years ago committed by Yoshiya Hinosawa
parent
f3a0cf8bc3
commit
d8b82c3429
18 changed files with 1659 additions and 1681 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      spec/api.axis-spec.js
  2. 3
      spec/api.focus-spec.js
  3. 7
      spec/api.grid-spec.js
  4. 6
      spec/api.load-spec.js
  5. 11
      spec/api.region-spec.js
  6. 76
      spec/api.zoom-spec.js
  7. 270
      spec/arc-spec.js
  8. 466
      spec/axis-spec.js
  9. 88
      spec/core-spec.js
  10. 1364
      spec/data-spec.js
  11. 164
      spec/domain-spec.js
  12. 301
      spec/grid-spec.js
  13. 90
      spec/interaction-spec.js
  14. 211
      spec/legend-spec.js
  15. 16
      spec/shape.bar-spec.js
  16. 169
      spec/shape.line-spec.js
  17. 3
      spec/tooltip-spec.js
  18. 88
      spec/type-spec.js

7
spec/api.axis-spec.js
Unescape View File

@ -9,7 +9,7 @@ describe('c3 api axis', function () {
describe('axis.labels', function () { describe('axis.labels', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -31,10 +31,9 @@ describe('c3 api axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should update y axis label', function () { it('updates y axis label', function () {
chart.axis.labels({y: 'New Y Axis Label'}); chart.axis.labels({y: 'New Y Axis Label'});
var label = d3.select('.c3-axis-y-label'); var label = d3.select('.c3-axis-y-label');
expect(label.text()).toBe('New Y Axis Label'); expect(label.text()).toBe('New Y Axis Label');
@ -42,7 +41,7 @@ describe('c3 api axis', function () {
expect(label.attr('dy')).toBe('1.2em'); expect(label.attr('dy')).toBe('1.2em');
}); });
it('should update y axis label', function () { it('updates y axis label', function () {
chart.axis.labels({y2: 'New Y2 Axis Label'}); chart.axis.labels({y2: 'New Y2 Axis Label'});
var label = d3.select('.c3-axis-y2-label'); var label = d3.select('.c3-axis-y2-label');
expect(label.text()).toBe('New Y2 Axis Label'); expect(label.text()).toBe('New Y2 Axis Label');

3
spec/api.focus-spec.js
Unescape View File

@ -378,11 +378,10 @@ describe('c3 api focus', function () {
describe('when legend.show = false', function () { describe('when legend.show = false', function () {
it('should update args to hide legend', function () { beforeAll(function () {
args.legend = { args.legend = {
show: false show: false
}; };
expect(true).toBeTruthy();
}); });
it('should focus all targets without showing legend', function (done) { it('should focus all targets without showing legend', function (done) {

7
spec/api.grid-spec.js
Unescape View File

@ -9,7 +9,7 @@ describe('c3 api grid', function () {
describe('ygrid.add and ygrid.remove', function () { describe('ygrid.add and ygrid.remove', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -17,10 +17,9 @@ describe('c3 api grid', function () {
] ]
} }
}; };
expect(true).toBeTruthy();
}); });
it('should update y grids', function (done) { it('updates y grids', function (done) {
var main = chart.internal.main, var main = chart.internal.main,
expectedGrids = [ expectedGrids = [
{ {
@ -62,7 +61,7 @@ describe('c3 api grid', function () {
}, 1200); }, 1200);
}); });
it("should update x ygrids even if it's zoomed", function (done) { it('updates x ygrids even if zoomed', function (done) {
var main = chart.internal.main, var main = chart.internal.main,
expectedGrids = [ expectedGrids = [
{ {

6
spec/api.load-spec.js
Unescape View File

@ -11,7 +11,7 @@ describe('c3 api load', function () {
describe('as column', function () { describe('as column', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -20,7 +20,6 @@ describe('c3 api load', function () {
] ]
} }
}; };
expect(true).toBeTruthy();
}); });
it('should load additional data', function (done) { it('should load additional data', function (done) {
@ -46,7 +45,7 @@ describe('c3 api load', function () {
describe('category data', function () { describe('category data', function () {
it('should update arg to category data', function () { beforeAll(function () {
args = { args = {
data: { data: {
x: 'x', x: 'x',
@ -62,7 +61,6 @@ describe('c3 api load', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
describe('as column', function () { describe('as column', function () {

11
spec/api.region-spec.js
Unescape View File

@ -9,7 +9,7 @@ describe('c3 api region', function () {
describe('api.region', function () { describe('api.region', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -31,10 +31,9 @@ describe('c3 api region', function () {
} }
] ]
}; };
expect(true).toBeTruthy();
}); });
it('should update regions', function (done) { it('updates regions', function (done) {
var main = chart.internal.main, var main = chart.internal.main,
expectedRegions = [ expectedRegions = [
{ {
@ -84,7 +83,7 @@ describe('c3 api region', function () {
describe('api.region.add', function () { describe('api.region.add', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -106,7 +105,6 @@ describe('c3 api region', function () {
} }
] ]
}; };
expect(true).toBeTruthy();
}); });
it('should add regions', function (done) { it('should add regions', function (done) {
@ -175,7 +173,7 @@ describe('c3 api region', function () {
describe('api.region.remove', function () { describe('api.region.remove', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -203,7 +201,6 @@ describe('c3 api region', function () {
}, },
] ]
}; };
expect(true).toBeTruthy();
}); });
it('should remove regions', function (done) { it('should remove regions', function (done) {

76
spec/api.zoom-spec.js
Unescape View File

@ -9,7 +9,7 @@ describe('c3 api zoom', function () {
describe('zoom', function () { describe('zoom', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -22,7 +22,6 @@ describe('c3 api zoom', function () {
enabled: true enabled: true
} }
}; };
expect(true).toBeTruthy();
}); });
it('should be zoomed properly', function () { it('should be zoomed properly', function () {
@ -41,48 +40,48 @@ describe('c3 api zoom', function () {
expect(domain[1]).toBe(target[1]); expect(domain[1]).toBe(target[1]);
}); });
it('should load timeseries data', function () { describe('with timeseries data', function () {
args = { beforeAll(function(){
data: { args = {
x: 'date', data: {
columns: [ x: 'date',
['date', '2014-01-01', '2014-01-02', '2014-08-01', '2014-10-19'], columns: [
['data1', 30, 200, 100, 400] ['date', '2014-01-01', '2014-01-02', '2014-08-01', '2014-10-19'],
] ['data1', 30, 200, 100, 400]
}, ]
axis: { },
x: { axis: {
type: 'timeseries' x: {
type: 'timeseries'
}
},
zoom: {
enabled: true
} }
}, };
zoom: { });
enabled: true
} it('should be zoomed properly', function () {
}; var target = [new Date(2014, 7, 1), new Date(2014, 8, 1)], domain;
expect(true).toBeTruthy(); 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]));
});
}); });
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 () { describe('unzoom', function () {
it('should load indexed data', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -93,7 +92,6 @@ describe('c3 api zoom', function () {
enabled: true enabled: true
} }
}; };
expect(true).toBeTruthy();
}); });
it('should be unzoomed properly', function () { it('should be unzoomed properly', function () {

270
spec/arc-spec.js
Unescape View File

@ -9,7 +9,7 @@ describe('c3 chart arc', function () {
describe('show pie chart', function () { describe('show pie chart', function () {
it('should update args to have pie chart', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -20,7 +20,6 @@ describe('c3 chart arc', function () {
type: 'pie' type: 'pie'
} }
}; };
expect(true).toBeTruthy();
}); });
it('should have correct classes', function () { it('should have correct classes', function () {
@ -47,149 +46,152 @@ describe('c3 chart arc', function () {
expect(d3.select('.c3-arc-data3').attr('d')).toMatch(/M1\..+,211\..+A211\..+,211\..+ 0 0,1 -124\..+,-171\..+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 () { describe('with data id that can be converted to a color', function () {
args.data.columns = [ beforeAll(function(){
['black', 30], args.data.columns = [
['data2', 150], ['black', 30],
['data3', 120] ['data2', 150],
]; ['data3', 120]
expect(true).toBeTruthy(); ];
}); });
it('should have correct d even if data id can be converted to a color', function (done) { it('should have correct d even if data id can be converted to a color', function (done) {
setTimeout(function () { setTimeout(function () {
expect(d3.select('.c3-arc-black').attr('d')).toMatch(/M-124\..+,-171\..+A211\..+,211\..+ 0 0,1 -3\..+,-211\..+L0,0Z/); expect(d3.select('.c3-arc-black').attr('d')).toMatch(/M-124\..+,-171\..+A211\..+,211\..+ 0 0,1 -3\..+,-211\..+L0,0Z/);
done(); done();
}, 500); }, 500);
}); });
it('should update args to have empty pie chart', function () { describe('with empty pie chart', function(){
args = { beforeAll(function () {
data: { args = {
columns: [ data: {
['data1', null], columns: [
['data2', null], ['data1', null],
['data3', null] ['data2', null],
], ['data3', null]
type: 'pie' ],
} type: 'pie'
}; }
expect(true).toBeTruthy(); };
}); });
it('should have correct d attribute', function () { it('should have correct d attribute', function () {
var chartArc = d3.select('.c3-chart-arcs'), var chartArc = d3.select('.c3-chart-arcs'),
arcs = { arcs = {
data1: chartArc.select('.c3-chart-arc.c3-target.c3-target-data1') data1: chartArc.select('.c3-chart-arc.c3-target.c3-target-data1')
.select('g.c3-shapes.c3-shapes-data1.c3-arcs.c3-arcs-data1') .select('g.c3-shapes.c3-shapes-data1.c3-arcs.c3-arcs-data1')
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data1'), .select('path.c3-shape.c3-shape.c3-arc.c3-arc-data1'),
data2: chartArc.select('.c3-chart-arc.c3-target.c3-target-data2') data2: chartArc.select('.c3-chart-arc.c3-target.c3-target-data2')
.select('g.c3-shapes.c3-shapes-data2.c3-arcs.c3-arcs-data2') .select('g.c3-shapes.c3-shapes-data2.c3-arcs.c3-arcs-data2')
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data2'), .select('path.c3-shape.c3-shape.c3-arc.c3-arc-data2'),
data3: chartArc.select('.c3-chart-arc.c3-target.c3-target-data3') data3: chartArc.select('.c3-chart-arc.c3-target.c3-target-data3')
.select('g.c3-shapes.c3-shapes-data3.c3-arcs.c3-arcs-data3') .select('g.c3-shapes.c3-shapes-data3.c3-arcs.c3-arcs-data3')
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-data3') .select('path.c3-shape.c3-shape.c3-arc.c3-arc-data3')
}; };
expect(arcs.data1.attr('d').indexOf('NaN')).toBe(-1); expect(arcs.data1.attr('d').indexOf('NaN')).toBe(-1);
expect(arcs.data2.attr('d').indexOf('NaN')).toBe(-1); expect(arcs.data2.attr('d').indexOf('NaN')).toBe(-1);
expect(arcs.data3.attr('d').indexOf('NaN')).toBe(-1); expect(arcs.data3.attr('d').indexOf('NaN')).toBe(-1);
});
});
}); });
}); });
describe('show gauge', function () { describe('show gauge', function () {
it('should update args to have a 180 degree gauge', function () { describe('with a 180 degree gauge', function(){
args = { beforeAll(function () {
gauge: { args = {
width: 10, gauge: {
max: 10, width: 10,
expand: true max: 10,
}, expand: true
data: { },
columns: [ data: {
['data', 8] columns: [
], ['data', 8]
type: 'gauge' ],
} 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() { it('should have correct d for Pi radian gauge', function () {
var chartArc = d3.select('.c3-chart-arcs'), var chartArc = d3.select('.c3-chart-arcs'),
data = chartArc.select('.c3-chart-arc.c3-target.c3-target-data') data = chartArc.select('.c3-chart-arc.c3-target.c3-target-data')
.select('g.c3-shapes.c3-shapes-data.c3-arcs.c3-arcs-data') .select('g.c3-shapes.c3-shapes-data.c3-arcs.c3-arcs-data')
.select('path.c3-shape.c3-shape.c3-arc.c3-arc-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-304,-3\..+A304,304 0 0,1 245\..+,-178\..+L237\..+,-172\..+A294,294 0 0,0 -294,-3\..+Z/);
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/); });
}); });
it('should update labels use custom text', function() { describe('with a 2 Pi radian gauge that starts at Pi/2', function() {
args = { beforeAll(function(){
gauge: { args = {
width: 10, gauge: {
max: 100, width: 10,
expand: true, max: 10,
label: { expand: true,
extents: function (value, isMax) { fullCircle: true
if (isMax) { },
return 'Max: ' + value + '%'; data: {
columns: [
['data', 8]
],
type: 'gauge',
fullCircle: true,
startingAngle: Math.PI/2
}
};
});
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/);
});
describe('with labels use custom text', function() {
beforeAll(function(){
args = {
gauge: {
width: 10,
max: 100,
expand: true,
label: {
extents: function (value, isMax) {
if (isMax) {
return 'Max: ' + value + '%';
}
return 'Min: ' + value + '%';
}
} }
},
return 'Min: ' + value + '%'; data: {
columns: [
['data', 8]
],
type: 'gauge',
fullCircle: true,
startingAngle: Math.PI/2
} }
} };
}, });
data: { it('should show custom min/max guage labels', function () {
columns: [ var chartArc = d3.select('.c3-chart-arcs'),
['data', 8] min = chartArc.select('.c3-chart-arcs-gauge-min'),
], max = chartArc.select('.c3-chart-arcs-gauge-max');
type: 'gauge',
fullCircle: true, expect(min.text()).toMatch('Min: 0%');
startingAngle: Math.PI/2 expect(max.text()).toMatch('Max: 100%');
} });
}; });
expect(true).toBeTruthy();
});
it('should show custom min/max guage labels', function () {
var chartArc = d3.select('.c3-chart-arcs'),
min = chartArc.select('.c3-chart-arcs-gauge-min'),
max = chartArc.select('.c3-chart-arcs-gauge-max');
expect(min.text()).toMatch('Min: 0%');
expect(max.text()).toMatch('Max: 100%');
}); });
}); });

466
spec/axis-spec.js
Unescape View File

@ -33,64 +33,65 @@ describe('c3 chart axis', function () {
describe('axis.y.tick.count', function () { describe('axis.y.tick.count', function () {
it('should update args to have only 1 tick on y axis', function () { describe('with only 1 tick on y axis', function () {
args.axis.y.tick.count = 1; beforeAll(function(){
expect(true).toBeTruthy(); args.axis.y.tick.count = 1;
}); });
it('should have only 1 tick on y axis', function () { it('should have only 1 tick on y axis', function () {
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size(); var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
expect(ticksSize).toBe(1); expect(ticksSize).toBe(1);
});
}); });
it('should update args to have 2 ticks on y axis', function () { describe('with 2 ticks on y axis', function () {
args.axis.y.tick.count = 2; beforeAll(function(){
expect(true).toBeTruthy(); args.axis.y.tick.count = 2;
}); });
it('should have 2 ticks on y axis', function () { it('should have 2 ticks on y axis', function () {
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size(); var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
expect(ticksSize).toBe(2); expect(ticksSize).toBe(2);
});
}); });
it('should update args to have 3 ticks on y axis', function () { describe('with 3 ticks on y axis', function () {
args.axis.y.tick.count = 3; beforeAll(function(){
expect(true).toBeTruthy(); args.axis.y.tick.count = 3;
}); });
it('should have 3 ticks on y axis', function () { it('should have 3 ticks on y axis', function () {
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size(); var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
expect(ticksSize).toBe(3); expect(ticksSize).toBe(3);
});
}); });
}); });
describe('axis.y.tick.values', function () { describe('axis.y.tick.values', function () {
var values = [100, 500]; var values = [100, 500];
it('should update args to have only 2 ticks on y axis', function () { describe('with only 2 ticks on y axis', function () {
args.axis.y.tick.values = values; beforeAll(function(){
expect(true).toBeTruthy(); args.axis.y.tick.values = values;
}); });
it('should have only 2 tick on y axis', function () { it('should have only 2 tick on y axis', function () {
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size(); var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size();
expect(ticksSize).toBe(2); expect(ticksSize).toBe(2);
}); });
it('should have specified tick texts', function () { it('should have specified tick texts', function () {
d3.select('.c3-axis-y').selectAll('g.tick').each(function (d, i) { d3.select('.c3-axis-y').selectAll('g.tick').each(function (d, i) {
var text = d3.select(this).select('text').text(); var text = d3.select(this).select('text').text();
expect(+text).toBe(values[i]); expect(+text).toBe(values[i]);
});
}); });
}); });
}); });
describe('axis y timeseries', function () { describe('axis y timeseries', function () {
beforeAll(function () {
it('should update args', function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -107,7 +108,6 @@ describe('c3 chart axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should have 7 ticks on y axis', function () { it('should have 7 ticks on y axis', function () {
@ -126,27 +126,28 @@ describe('c3 chart axis', function () {
}); });
}); });
it('should update args to set axis.y.time', function () { describe('with axis.y.time', function () {
args.axis.y.tick.time = { beforeAll(function(){
value : 'seconds', args.axis.y.tick.time = {
interval : 60 value : 'seconds',
}; interval : 60
expect(true).toBeTruthy(); };
}); });
it('should have 4 ticks on y axis', function () { it('should have 4 ticks on y axis', function () {
var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size(); 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 expect(ticksSize).toBe(4); // the count starts at initial value and increments by the set interval
}); });
it('should have specified 60 second intervals', function () { it('should have specified 60 second intervals', function () {
var prevValue; var prevValue;
d3.select('.c3-axis-y').selectAll('g.tick').each(function (d, i) { d3.select('.c3-axis-y').selectAll('g.tick').each(function (d, i) {
if (i !== 0) { if (i !== 0) {
var result = d - prevValue; var result = d - prevValue;
expect(result).toEqual(60000); // expressed in milliseconds expect(result).toEqual(60000); // expressed in milliseconds
} }
prevValue = d; prevValue = d;
});
}); });
}); });
}); });
@ -167,7 +168,7 @@ describe('c3 chart axis', function () {
} }
}; };
chart = window.c3.generate(args); chart = window.c3.generate(args);
window.generatedTicks = tickGenerator(); window.generatedTicks = tickGenerator(); // This should be removed from window
}); });
it('should use function to generate ticks', function () { it('should use function to generate ticks', function () {
@ -185,7 +186,7 @@ describe('c3 chart axis', function () {
describe('not rotated', function () { describe('not rotated', function () {
it('should update args successfully', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -202,7 +203,6 @@ describe('c3 chart axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should construct indexed x axis properly', function () { it('should construct indexed x axis properly', function () {
@ -222,95 +222,95 @@ describe('c3 chart axis', function () {
}); });
}); });
it('should set axis.x.tick.format', function () { describe('should set axis.x.tick.format', function () {
args.axis.x = { beforeAll(function(){
tick: { args.axis.x = {
format: function () { tick: {
return 'very long tick text on x axis'; format: function () {
return 'very long tick text on x axis';
}
} }
} };
}; });
expect(true).toBeTruthy();
});
it('should split x axis tick text to multiple lines', function () { it('should split x axis tick text to multiple lines', function () {
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'), var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'),
expectedTexts = ['very long tick text', 'on x axis'], expectedTexts = ['very long tick text', 'on x axis'],
expectedX = '0'; expectedX = '0';
expect(ticks.size()).toBe(6); expect(ticks.size()).toBe(6);
ticks.each(function () { ticks.each(function () {
var tspans = d3.select(this).selectAll('tspan'); var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(2); expect(tspans.size()).toBe(2);
tspans.each(function (d, i) { tspans.each(function (d, i) {
var tspan = d3.select(this); var tspan = d3.select(this);
expect(tspan.text()).toBe(expectedTexts[i]); expect(tspan.text()).toBe(expectedTexts[i]);
expect(tspan.attr('x')).toBe(expectedX); expect(tspan.attr('x')).toBe(expectedX);
if (i === 0) { if (i === 0) {
expect(tspan.attr('dy')).toBe('.71em'); expect(tspan.attr('dy')).toBe('.71em');
} else { } else {
expect(tspan.attr('dy')).toBeGreaterThan(8); expect(tspan.attr('dy')).toBeGreaterThan(8);
} }
});
}); });
}); });
});
it('should construct y axis properly', function () { it('should construct y axis properly', function () {
var ticks = chart.internal.main.select('.c3-axis-y').selectAll('g.tick'), var ticks = chart.internal.main.select('.c3-axis-y').selectAll('g.tick'),
expectedX = '-9', expectedX = '-9',
expectedDy = '3'; expectedDy = '3';
expect(ticks.size()).toBe(9); expect(ticks.size()).toBe(9);
ticks.each(function (d) { ticks.each(function (d) {
var tspans = d3.select(this).selectAll('tspan'); var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1); expect(tspans.size()).toBe(1);
tspans.each(function () { tspans.each(function () {
var tspan = d3.select(this); var tspan = d3.select(this);
expect(tspan.text()).toBe(d + ''); expect(tspan.text()).toBe(d + '');
expect(tspan.attr('x')).toBe(expectedX); expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy); expect(tspan.attr('dy')).toBe(expectedDy);
});
}); });
}); });
});
it('should construct y2 axis properly', function () { it('should construct y2 axis properly', function () {
var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick'), var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick'),
expectedX = '9', expectedX = '9',
expectedDy = '3'; expectedDy = '3';
expect(ticks.size()).toBe(9); expect(ticks.size()).toBe(9);
ticks.each(function (d) { ticks.each(function (d) {
var tspans = d3.select(this).selectAll('tspan'); var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1); expect(tspans.size()).toBe(1);
tspans.each(function () { tspans.each(function () {
var tspan = d3.select(this); var tspan = d3.select(this);
expect(tspan.text()).toBe(d + ''); expect(tspan.text()).toBe(d + '');
expect(tspan.attr('x')).toBe(expectedX); expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy); expect(tspan.attr('dy')).toBe(expectedDy);
});
}); });
}); });
}); });
it('should set big values in y', function () { describe('should set big values in y', function () {
args.data.columns = [ beforeAll(function(){
['data1', 3000000000000000, 200, 100, 400, 150, 250], args.data.columns = [
['data2', 50, 20, 10, 40, 15, 25] ['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 () { it('should not split y axis tick text to multiple lines', function () {
var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick'); var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick');
ticks.each(function () { ticks.each(function () {
var tspans = d3.select(this).selectAll('tspan'); var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1); expect(tspans.size()).toBe(1);
});
}); });
}); });
}); });
describe('rotated', function () { describe('rotated', function () {
it('should update args to rotate axis', function () { beforeAll(function () {
args.axis.rotated = true; args.axis.rotated = true;
expect(true).toBeTruthy();
}); });
it('should split x axis tick text to multiple lines', function () { it('should split x axis tick text to multiple lines', function () {
@ -367,7 +367,7 @@ describe('c3 chart axis', function () {
describe('not rotated', function () { describe('not rotated', function () {
it('should update args successfully', function () { beforeAll(function () {
args = { args = {
data: { data: {
x: 'x', x: 'x',
@ -383,7 +383,6 @@ describe('c3 chart axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should locate ticks properly', function () { it('should locate ticks properly', function () {
@ -429,9 +428,8 @@ describe('c3 chart axis', function () {
describe('rotated', function () { describe('rotated', function () {
it('should update args to rotate axis', function () { beforeAll(function () {
args.axis.rotated = true; args.axis.rotated = true;
expect(true).toBeTruthy();
}); });
it('should locate ticks on rotated axis properly', function () { it('should locate ticks on rotated axis properly', function () {
@ -480,11 +478,10 @@ describe('c3 chart axis', function () {
describe('as null', function () { describe('as null', function () {
it('should update args not to split ticks', function () { beforeAll(function () { //'without split ticks',
args.axis.x.tick = { args.axis.x.tick = {
multiline: false multiline: false
}; };
expect(true).toBeTruthy();
}); });
it('should split x tick', function () { it('should split x tick', function () {
@ -497,11 +494,10 @@ describe('c3 chart axis', function () {
describe('as value', function () { describe('as value', function () {
it('should update args not to split ticks', function () { beforeAll(function () { // 'without split ticks',
args.axis.x.tick = { args.axis.x.tick = {
width: 150 width: 150
}; };
expect(true).toBeTruthy();
}); });
it('should split x tick to 2 lines properly', function () { it('should split x tick to 2 lines properly', function () {
@ -531,11 +527,10 @@ describe('c3 chart axis', function () {
describe('with axis.x.tick.format', function () { describe('with axis.x.tick.format', function () {
it('should update args to use axis.x.tick.format', function () { beforeAll(function () { // 'with axis.x.tick.format',
args.axis.x.tick.format = function () { args.axis.x.tick.format = function () {
return ['this is a very long tick text', 'on category axis']; return ['this is a very long tick text', 'on category axis'];
}; };
expect(true).toBeTruthy();
}); });
it('should have multiline tick text', function () { it('should have multiline tick text', function () {
@ -556,7 +551,7 @@ describe('c3 chart axis', function () {
describe('not rotated', function () { describe('not rotated', function () {
it('should update args successfully', function () { beforeAll(function () {
args = { args = {
data: { data: {
x: 'x', x: 'x',
@ -575,7 +570,6 @@ describe('c3 chart axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should rotate tick texts', function () { it('should rotate tick texts', function () {
@ -603,7 +597,7 @@ describe('c3 chart axis', function () {
describe('not rotated', function () { describe('not rotated', function () {
it('should update args successfully', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -620,7 +614,6 @@ describe('c3 chart axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should rotate tick texts', function () { it('should rotate tick texts', function () {
@ -646,7 +639,7 @@ describe('c3 chart axis', function () {
describe('axis.x.tick.fit = true', function () { describe('axis.x.tick.fit = true', function () {
it('should set args for indexed data', function () { beforeAll(function () { // 'should set args for indexed data',
args = { args = {
data: { data: {
columns: [ columns: [
@ -656,7 +649,6 @@ describe('c3 chart axis', function () {
] ]
} }
}; };
expect(true).toBeTruthy();
}); });
it('should show fitted ticks on indexed data', function () { it('should show fitted ticks on indexed data', function () {
@ -664,93 +656,95 @@ describe('c3 chart axis', function () {
expect(ticks.size()).toBe(6); expect(ticks.size()).toBe(6);
}); });
it('should set args for x-based data', function () { describe('should set args for x-based data', function () {
args = { beforeAll(function(){
data: { args = {
x: 'x', data: {
columns: [ x: 'x',
['x', 10, 20, 100, 110, 200, 1000], columns: [
['data1', 30, 200, 100, 400, 150, 250], ['x', 10, 20, 100, 110, 200, 1000],
['data2', 50, 20, 10, 40, 15, 25], ['data1', 30, 200, 100, 400, 150, 250],
['data3', 150, 120, 110, 140, 115, 125] ['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 () { it('should show fitted ticks on indexed data', function () {
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick'); var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
expect(ticks.size()).toBe(6); expect(ticks.size()).toBe(6);
}); });
it('should show fitted ticks after hide and show', function () { it('should show fitted ticks after hide and show', function () {
chart.hide(); chart.hide();
chart.show(); chart.show();
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick'); var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
expect(ticks.size()).toBe(6); expect(ticks.size()).toBe(6);
});
}); });
}); });
describe('axis.x.tick.fit = false', function () { describe('axis.x.tick.fit = false', function () {
it('should set args for indexed data', function () { describe('should set args for indexed data', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 30, 200, 100, 400, 150, 250], columns: [
['data2', 50, 20, 10, 40, 15, 25], ['data1', 30, 200, 100, 400, 150, 250],
['data3', 150, 120, 110, 140, 115, 125] ['data2', 50, 20, 10, 40, 15, 25],
] ['data3', 150, 120, 110, 140, 115, 125]
}, ]
axis: { },
x: { axis: {
tick: { x: {
fit: false tick: {
fit: false
}
} }
} }
} };
}; });
expect(true).toBeTruthy();
});
it('should show fitted ticks on indexed data', function () { it('should show fitted ticks on indexed data', function () {
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick'); var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
expect(ticks.size()).toBe(11); 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 () { describe('should set args for x-based data', function () {
var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick'); beforeAll(function(){
expect(ticks.size()).toBe(10); 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]
]
};
});
it('should show fitted ticks after hide and show', function () { it('should show fitted ticks on indexed data', function () {
chart.hide(); var ticks = chart.internal.main.selectAll('.c3-axis-x g.tick');
chart.show(); expect(ticks.size()).toBe(10);
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 () { describe('axis.y.inner', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -764,7 +758,6 @@ describe('c3 chart axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should not have inner y axis', function () { it('should not have inner y axis', function () {
@ -776,25 +769,25 @@ describe('c3 chart axis', function () {
}); });
}); });
it('should update args to have inner y axis', function () { describe('with inner y axis', function () {
args.axis.y.inner = true; beforeAll(function(){
expect(true).toBeTruthy(); args.axis.y.inner = true;
}); });
it('should have inner y axis', function () { it('should have inner y axis', function () {
var paddingLeft = chart.internal.getCurrentPaddingLeft(), var paddingLeft = chart.internal.getCurrentPaddingLeft(),
tickTexts = chart.internal.main.selectAll('.c3-axis-y g.tick text'); tickTexts = chart.internal.main.selectAll('.c3-axis-y g.tick text');
expect(paddingLeft).toBe(1); expect(paddingLeft).toBe(1);
tickTexts.each(function () { tickTexts.each(function () {
expect(+d3.select(this).attr('x')).toBeGreaterThan(0); expect(+d3.select(this).attr('x')).toBeGreaterThan(0);
});
}); });
}); });
}); });
describe('axis.y2.inner', function () { describe('axis.y2.inner', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -809,7 +802,6 @@ describe('c3 chart axis', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should not have inner y axis', function () { it('should not have inner y axis', function () {
@ -821,20 +813,20 @@ describe('c3 chart axis', function () {
}); });
}); });
it('should update args to have inner y axis', function () { describe('with inner y axis', function () {
args.axis.y2.inner = true; beforeAll(function(){
expect(true).toBeTruthy(); args.axis.y2.inner = true;
}); });
it('should have inner y axis', function () { it('should have inner y axis', function () {
var paddingRight = chart.internal.getCurrentPaddingRight(), var paddingRight = chart.internal.getCurrentPaddingRight(),
tickTexts = chart.internal.main.selectAll('.c3-axis-2y g.tick text'); tickTexts = chart.internal.main.selectAll('.c3-axis-2y g.tick text');
expect(paddingRight).toBe(2); expect(paddingRight).toBe(2);
tickTexts.each(function () { tickTexts.each(function () {
expect(+d3.select(this).attr('x')).toBeLessThan(0); expect(+d3.select(this).attr('x')).toBeLessThan(0);
});
}); });
}); });
}); });
}); });

88
spec/core-spec.js
Unescape View File

@ -27,20 +27,22 @@ describe('c3 chart', function () {
expect(svg).not.toBeNull(); expect(svg).not.toBeNull();
}); });
it('should set 3rd party property to Function', function () { describe('should set 3rd party property to Function', function () {
Function.prototype.$extIsFunction = true; beforeAll(function(){
expect(true).toBeTruthy(); Function.prototype.$extIsFunction = true;
}); });
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 () { it('should be created even if 3rd party property has been set', function () {
var svg = d3.select('#chart svg'); var svg = d3.select('#chart svg');
expect(svg.attr('class')).not.toBeNull(); expect(svg).not.toBeNull();
expect(svg.attr('class')).toBe('customclass'); });
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');
});
}); });
}); });
@ -61,11 +63,11 @@ describe('c3 chart', function () {
describe('bindto', function () { describe('bindto', function () {
describe('selector', function () { describe('selector', function () {
it('update args', function () { beforeAll(function(){
d3.select('#chart').html(''); d3.select('#chart').html('');
args.bindto = '#chart'; args.bindto = '#chart';
expect(true).toBeTruthy();
}); });
it('should be created', function () { it('should be created', function () {
var svg = d3.select('#chart svg'); var svg = d3.select('#chart svg');
expect(svg.size()).toBe(1); expect(svg.size()).toBe(1);
@ -73,10 +75,9 @@ describe('c3 chart', function () {
}); });
describe('d3.selection object', function () { describe('d3.selection object', function () {
it('update args', function () { beforeAll(function () {
d3.select('#chart').html(''); d3.select('#chart').html('');
args.bindto = d3.select('#chart'); args.bindto = d3.select('#chart');
expect(true).toBeTruthy();
}); });
it('should be created', function () { it('should be created', function () {
var svg = d3.select('#chart svg'); var svg = d3.select('#chart svg');
@ -85,11 +86,11 @@ describe('c3 chart', function () {
}); });
describe('null', function () { describe('null', function () {
it('update args', function () { beforeAll(function () {
d3.select('#chart').html(''); d3.select('#chart').html('');
args.bindto = null; args.bindto = null;
expect(true).toBeTruthy();
}); });
it('should not be created', function () { it('should not be created', function () {
var svg = d3.select('#chart svg'); var svg = d3.select('#chart svg');
expect(svg.size()).toBe(0); expect(svg.size()).toBe(0);
@ -97,22 +98,20 @@ describe('c3 chart', function () {
}); });
describe('empty string', function () { describe('empty string', function () {
it('update args', function () { beforeAll(function () {
d3.select('#chart').html(''); d3.select('#chart').html('');
args.bindto = ''; args.bindto = '';
expect(true).toBeTruthy();
}); });
it('should not be created', function () { it('should not be created', function () {
var svg = d3.select('#chart svg'); var svg = d3.select('#chart svg');
expect(svg.size()).toBe(0); expect(svg.size()).toBe(0);
}); });
}); });
}); });
describe('empty data', function () { describe('empty data', function () {
beforeAll(function () {
it('should upaate args for empty data', function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -121,7 +120,6 @@ describe('c3 chart', function () {
] ]
} }
}; };
expect(true).toBeTruthy();
}); });
it('should generate a chart', function () { it('should generate a chart', function () {
@ -129,30 +127,30 @@ describe('c3 chart', function () {
expect(ticks.size()).toBe(0); expect(ticks.size()).toBe(0);
}); });
it('should upaate args for empty data', function () { describe('more empty data', function () {
args = { beforeAll(function(){
data: { args = {
x: 'x', data: {
columns: [ x: 'x',
['x'], columns: [
['data1'], ['x'],
['data2'] ['data1'],
] ['data2']
}, ]
axis: { },
x: { axis: {
type: 'timeseries' x: {
type: 'timeseries'
}
} }
} };
}; });
expect(true).toBeTruthy();
});
it('should generate a chart', function () { it('should generate a chart', function () {
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'); var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick');
expect(ticks.size()).toBe(0); expect(ticks.size()).toBe(0);
});
}); });
}); });
}); });

1364
spec/data-spec.js
View File

File diff suppressed because it is too large Load Diff

164
spec/domain-spec.js
Unescape View File

@ -22,112 +22,114 @@ describe('c3 chart domain', function () {
describe('axis.y.min', function () { describe('axis.y.min', function () {
it('should change axis.y.min to -100', function () { describe('should change axis.y.min to -100', function () {
args.axis.y.min = -100; beforeAll(function(){
expect(true).toBeTruthy(); args.axis.y.min = -100;
});
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 be set properly when smaller than max of data', function () { describe('should change axis.y.min to 500', function () {
var domain = chart.internal.y.domain(); beforeAll(function(){
expect(domain[0]).toBe(-150); args.axis.y.min = 500;
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 () { it('should be set properly when bigger than max of data', function () {
var domain = chart.internal.y.domain(); var domain = chart.internal.y.domain();
expect(domain[0]).toBe(499); expect(domain[0]).toBe(499);
expect(domain[1]).toBe(511); expect(domain[1]).toBe(511);
});
}); });
it('should change axis.y.min to undefined', function () { afterAll(function(){
args.axis.y.min = undefined; args.axis.y.min = undefined;
expect(true).toBeTruthy();
}); });
}); });
describe('axis.y.max', function () { describe('axis.y.max', function () {
describe('should change axis.y.max to 1000', function () {
it('should change axis.y.max to 1000', function () { beforeAll(function(){
args.axis.y.max = 1000; 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 be set properly when bigger than min of data', function () { describe('should change axis.y.max to 0', function () {
var domain = chart.internal.y.domain(); beforeAll(function(){
expect(domain[0]).toBe(-89); args.axis.y.max = 0;
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 () { it('should be set properly when smaller than min of data', function () {
var domain = chart.internal.y.domain(); var domain = chart.internal.y.domain();
expect(domain[0]).toBe(-11); expect(domain[0]).toBe(-11);
expect(domain[1]).toBe(1); expect(domain[1]).toBe(1);
});
}); });
}); });
describe('axis.y.padding', function () { describe('axis.y.padding', function () {
it('should change axis.y.max to 1000', function () { describe('should change axis.y.max to 1000', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 10, 20, 10, 40, 15, 25], columns: [
['data2', 50, 40, 30, 45, 25, 45] ['data1', 10, 20, 10, 40, 15, 25],
] ['data2', 50, 40, 30, 45, 25, 45]
}, ]
axis: { },
y: { axis: {
padding: 200, 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 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 () { describe('should change axis.y.max to 1000 with top/bottom padding', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 10, 20, 10, 40, 15, 25], columns: [
['data2', 50, 40, 30, 45, 25, 45] ['data1', 10, 20, 10, 40, 15, 25],
] ['data2', 50, 40, 30, 45, 25, 45]
}, ]
axis: { },
y: { axis: {
padding: { y: {
top: 200, padding: {
bottom: 200 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);
});
}); });
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);
});
}); });
}); });

301
spec/grid-spec.js
Unescape View File

@ -9,7 +9,7 @@ describe('c3 chart grid', function () {
describe('y grid show', function () { describe('y grid show', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -28,51 +28,53 @@ describe('c3 chart grid', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should not show y grids', function () { it('should not show y grids', function () {
expect(chart.internal.main.select('.c3-ygrids').size()).toBe(0); expect(chart.internal.main.select('.c3-ygrids').size()).toBe(0);
}); });
it('should update args to show y grids', function () { describe('with y grids', function () {
args.grid.y.show = true; beforeAll(function(){
expect(true).toBeTruthy(); args.grid.y.show = true;
}); });
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 () { it('should show y grids', function () {
args.grid.y.ticks = 3; var ygrids = chart.internal.main.select('.c3-ygrids');
expect(true).toBeTruthy(); expect(ygrids.size()).toBe(1);
expect(ygrids.selectAll('.c3-ygrid').size()).toBe(9);
});
}); });
it('should show only 3 y grids', function () { describe('with only 3 y grids', function () {
var ygrids = chart.internal.main.select('.c3-ygrids'); beforeAll(function(){
expect(ygrids.size()).toBe(1); args.grid.y.ticks = 3;
expect(ygrids.selectAll('.c3-ygrid').size()).toBe(3); });
});
it('should update args to show y grids depending on y axis ticks', function () { it('should show only 3 y grids', function () {
args.axis.y.tick.count = 5; var ygrids = chart.internal.main.select('.c3-ygrids');
expect(true).toBeTruthy(); expect(ygrids.size()).toBe(1);
expect(ygrids.selectAll('.c3-ygrid').size()).toBe(3);
});
}); });
it('should show grids depending on y axis ticks', function () { describe('with y grids depending on y axis ticks', function () {
var ygrids = chart.internal.main.select('.c3-ygrids'), beforeAll(function(){
expectedYs = []; args.axis.y.tick.count = 5;
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); it('should show grids depending on y axis ticks', function () {
chart.internal.main.select('.c3-axis-y').selectAll('.tick').each(function (d, i) { var ygrids = chart.internal.main.select('.c3-ygrids'),
var t = d3.transform(d3.select(this).attr('transform')); expectedYs = [];
expect(t.translate[1]).toBe(expectedYs[i]); 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]);
});
}); });
}); });
}); });
@ -81,7 +83,7 @@ describe('c3 chart grid', function () {
describe('position', function () { describe('position', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -98,7 +100,6 @@ describe('c3 chart grid', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should show 3 grid lines', function () { it('should show 3 grid lines', function () {
@ -127,55 +128,55 @@ describe('c3 chart grid', function () {
}); });
}); });
it('should update args', function () { describe('three gridlines', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 10, 200, 100, 400, 150, 250] 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'}
] ]
},
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 () { it('should show 3 grid lines', function () {
expect(chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line').size()).toBe(3); expect(chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line').size()).toBe(3);
}); });
it('should locate grid lines properly', function () { it('should locate grid lines properly', function () {
var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'), var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'),
expectedX1s = [75, 220, 321]; expectedX1s = [75, 220, 321];
lines.each(function (d, i) { lines.each(function (d, i) {
var x1 = d3.select(this).select('line').attr('x1'); var x1 = d3.select(this).select('line').attr('x1');
expect(x1).toBeCloseTo(expectedX1s[i], -2); expect(x1).toBeCloseTo(expectedX1s[i], -2);
});
}); });
});
it('should locate grid texts properly', function () { it('should locate grid texts properly', function () {
var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'), var lines = chart.internal.main.selectAll('.c3-ygrid-lines .c3-ygrid-line'),
expectedPositions = ['start', 'middle', 'end'], expectedPositions = ['start', 'middle', 'end'],
expectedDxs = [4, 0, -4]; expectedDxs = [4, 0, -4];
lines.each(function (d, i) { lines.each(function (d, i) {
var text = d3.select(this).select('text'), var text = d3.select(this).select('text'),
textAnchor = text.attr('text-anchor'), textAnchor = text.attr('text-anchor'),
dx = text.attr('dx'); dx = text.attr('dx');
expect(textAnchor).toBe(expectedPositions[i]); expect(textAnchor).toBe(expectedPositions[i]);
expect(+dx).toBe(expectedDxs[i]); expect(+dx).toBe(expectedDxs[i]);
});
}); });
}); });
}); });
}); });
@ -183,7 +184,7 @@ describe('c3 chart grid', function () {
describe('position', function () { describe('position', function () {
it('should have correct height', function () { beforeAll(function () { // 'should have correct height',
args = { args = {
data: { data: {
columns: [ columns: [
@ -200,7 +201,6 @@ describe('c3 chart grid', function () {
} }
}, },
}; };
expect(true).toBeTruthy();
}); });
it('should show 3 grid lines', function () { it('should show 3 grid lines', function () {
@ -229,98 +229,98 @@ describe('c3 chart grid', function () {
}); });
}); });
it('should update args', function () { describe('three grid lines', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 30, 200, 100, 400], 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'},
] ]
} },
}, axis: {
}; rotated: true
expect(true).toBeTruthy(); },
}); grid: {
x: {
lines: [
{value: 1, text: 'Label 1', position: 'start'},
{value: 2, text: 'Label 2', position: 'middle'},
{value: 3, text: 'Label 3'},
]
}
},
};
});
it('should show 3 grid lines', function () { it('should show 3 grid lines', function () {
expect(chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line').size()).toBe(3); expect(chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line').size()).toBe(3);
}); });
it('should locate grid lines properly', function () { it('should locate grid lines properly', function () {
var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'), var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'),
expectedY1s = [144, 283, 421]; expectedY1s = [144, 283, 421];
lines.each(function (d, i) { lines.each(function (d, i) {
var y1 = d3.select(this).select('line').attr('y1'); var y1 = d3.select(this).select('line').attr('y1');
expect(y1).toBeCloseTo(expectedY1s[i], -2); expect(y1).toBeCloseTo(expectedY1s[i], -2);
});
}); });
});
it('should locate grid texts properly', function () { it('should locate grid texts properly', function () {
var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'), var lines = chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line'),
expectedPositions = ['start', 'middle', 'end'], expectedPositions = ['start', 'middle', 'end'],
expectedDxs = [4, 0, -4]; expectedDxs = [4, 0, -4];
lines.each(function (d, i) { lines.each(function (d, i) {
var text = d3.select(this).select('text'), var text = d3.select(this).select('text'),
textAnchor = text.attr('text-anchor'), textAnchor = text.attr('text-anchor'),
dx = text.attr('dx'); dx = text.attr('dx');
expect(textAnchor).toBe(expectedPositions[i]); expect(textAnchor).toBe(expectedPositions[i]);
expect(+dx).toBe(expectedDxs[i]); expect(+dx).toBe(expectedDxs[i]);
});
}); });
}); });
}); });
describe('with padding.top', function () { describe('with padding.top', function () {
it('should have correct height', function () { describe('should have correct height', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 30, 200, 100, 400], columns: [
] ['data1', 30, 200, 100, 400],
},
grid: {
x: {
lines: [
{value: 3, text: 'Label 3'}
] ]
},
grid: {
x: {
lines: [
{value: 3, text: 'Label 3'}
]
}
},
padding: {
top: 50
} }
}, };
padding: { });
top: 50
}
};
expect(true).toBeTruthy();
});
it('should show x grid lines', function () { it('should show x grid lines', function () {
var lines = chart.internal.main.select('.c3-xgrid-lines .c3-xgrid-line'), var lines = chart.internal.main.select('.c3-xgrid-lines .c3-xgrid-line'),
expectedX1 = 593, expectedX1 = 593,
expectedText = ['Label 3']; expectedText = ['Label 3'];
lines.each(function (id, i) { lines.each(function (id, i) {
var line = d3.select(this), var line = d3.select(this),
l = line.select('line'), l = line.select('line'),
t = line.select('text'); t = line.select('text');
expect(+l.attr('x1')).toBeCloseTo(expectedX1, -2); expect(+l.attr('x1')).toBeCloseTo(expectedX1, -2);
expect(t.text()).toBe(expectedText[i]); expect(t.text()).toBe(expectedText[i]);
});
}); });
}); });
}); });
describe('on category axis', function () { describe('on category axis', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
x: 'x', x: 'x',
@ -343,7 +343,6 @@ describe('c3 chart grid', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should show x grid lines', function () { it('should show x grid lines', function () {

90
spec/interaction-spec.js
Unescape View File

@ -11,7 +11,7 @@ describe('c3 chart interaction', function () {
describe('custom x', function () { describe('custom x', function () {
it('should generate bar chart', function () { beforeAll(function () {
args = { args = {
data: { data: {
x: 'x', x: 'x',
@ -22,7 +22,6 @@ describe('c3 chart interaction', function () {
type: 'bar' type: 'bar'
} }
}; };
expect(true).toBeTruthy();
}); });
it('should have 4 event rects properly', function () { it('should have 4 event rects properly', function () {
@ -35,34 +34,34 @@ describe('c3 chart interaction', function () {
}); });
}); });
it('should generate bar chart with only one data', function () { describe('should generate bar chart with only one data', function () {
args = { beforeAll(function(){
data: { args = {
x: 'x', data: {
columns: [ x: 'x',
['x', 0], columns: [
['data', 10] ['x', 0],
], ['data', 10]
type: 'bar' ],
} type: 'bar'
}; }
expect(true).toBeTruthy(); };
}); });
it('should have 1 event rects properly', function () { it('should have 1 event rects properly', function () {
var eventRects = d3.selectAll('.c3-event-rect'); var eventRects = d3.selectAll('.c3-event-rect');
expect(eventRects.size()).toBe(1); expect(eventRects.size()).toBe(1);
eventRects.each(function () { eventRects.each(function () {
var box = d3.select(this).node().getBoundingClientRect(); var box = d3.select(this).node().getBoundingClientRect();
expect(box.left).toBeCloseTo(40.5, -2); expect(box.left).toBeCloseTo(40.5, -2);
expect(box.width).toBeCloseTo(598, -2); expect(box.width).toBeCloseTo(598, -2);
});
}); });
}); });
}); });
describe('timeseries', function () { describe('timeseries', function () {
beforeAll(function () {
it('should generate line chart with timeseries', function () {
args = { args = {
data: { data: {
x: 'x', x: 'x',
@ -72,7 +71,6 @@ describe('c3 chart interaction', function () {
] ]
} }
}; };
expect(true).toBeTruthy();
}); });
it('should have 4 event rects properly', function () { it('should have 4 event rects properly', function () {
@ -86,31 +84,29 @@ describe('c3 chart interaction', function () {
}); });
it('should generate line chart with only 1 data timeseries', function () { describe('should generate line chart with only 1 data timeseries', function () {
args = { beforeAll(function(){
data: { args = {
x: 'x', data: {
columns: [ x: 'x',
['x', '20140101'], columns: [
['data', 10] ['x', '20140101'],
] ['data', 10]
} ]
}; }
expect(true).toBeTruthy(); };
}); });
it('should have 1 event rects properly', function () { it('should have 1 event rects properly', function () {
var eventRects = d3.selectAll('.c3-event-rect'); var eventRects = d3.selectAll('.c3-event-rect');
expect(eventRects.size()).toBe(1); expect(eventRects.size()).toBe(1);
eventRects.each(function () { eventRects.each(function () {
var box = d3.select(this).node().getBoundingClientRect(); var box = d3.select(this).node().getBoundingClientRect();
expect(box.left).toBeCloseTo(40.5, -2); expect(box.left).toBeCloseTo(40.5, -2);
expect(box.width).toBeCloseTo(598, -2); expect(box.width).toBeCloseTo(598, -2);
});
}); });
}); });
}); });
}); });
}); });

211
spec/legend-spec.js
Unescape View File

@ -9,7 +9,7 @@ describe('c3 chart legend', function () {
describe('legend when multiple charts rendered', function () { describe('legend when multiple charts rendered', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -19,36 +19,36 @@ describe('c3 chart legend', function () {
] ]
} }
}; };
expect(true).toBeTruthy();
}); });
it('should update args with long data names', function () { describe('long data names', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['long data name 1', 30], columns: [
['long data name 2', 50], ['long data name 1', 30],
['long data name 3', 50], ['long data name 2', 50],
] ['long data name 3', 50],
} ]
}; }
expect(true).toBeTruthy(); };
}); });
it('should have properly computed legend width', function () { it('should have properly computed legend width', function () {
var expectedLeft = [148, 226, 384], var expectedLeft = [148, 226, 384],
expectedWidth = [118, 118, 108]; expectedWidth = [118, 118, 108];
d3.selectAll('.c3-legend-item').each(function (d, i) { d3.selectAll('.c3-legend-item').each(function (d, i) {
var rect = d3.select(this).node().getBoundingClientRect(); var rect = d3.select(this).node().getBoundingClientRect();
expect(rect.left).toBeCloseTo(expectedLeft[i], -2); expect(rect.left).toBeCloseTo(expectedLeft[i], -2);
expect(rect.width).toBeCloseTo(expectedWidth[i], -2); expect(rect.width).toBeCloseTo(expectedWidth[i], -2);
});
}); });
}); });
}); });
describe('legend position', function () { describe('legend position', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -57,7 +57,6 @@ describe('c3 chart legend', function () {
] ]
} }
}; };
expect(true).toBeTruthy();
}); });
it('should be located on the center of chart', function () { it('should be located on the center of chart', function () {
@ -69,80 +68,83 @@ describe('c3 chart legend', function () {
describe('legend as inset', function () { describe('legend as inset', function () {
it('should change the legend to "inset" successfully', function () { describe('should change the legend to "inset" successfully', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 30, 200, 100, 400, 150, 250], columns: [
['data2', 50, 20, 10, 40, 15, 25] ['data1', 30, 200, 100, 400, 150, 250],
] ['data2', 50, 20, 10, 40, 15, 25]
}, ]
legend: { },
position: 'inset', legend: {
inset: { position: 'inset',
step: null inset: {
step: null
}
} }
} };
}; });
expect(true).toBeTruthy();
});
it('should be positioned properly', function () { it('should be positioned properly', function () {
var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
expect(box.top).toBe(5.5); expect(box.top).toBe(5.5);
expect(box.left).toBeGreaterThan(30); expect(box.left).toBeGreaterThan(30);
}); });
it('should have automatically calculated height', function () { it('should have automatically calculated height', function () {
var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
expect(box.height).toBe(48); expect(box.height).toBe(48);
});
}); });
it('should change the legend step to 1 successfully', function () { describe('should change the legend step to 1 successfully', function () {
args.legend.inset.step = 1; beforeAll(function(){
expect(true).toBeTruthy(); args.legend.inset.step = 1;
}); });
it('should have automatically calculated height', function () { it('should have automatically calculated height', function () {
var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
expect(box.height).toBe(28); expect(box.height).toBe(28);
});
}); });
it('should change the legend step to 2 successfully', function () { describe('should change the legend step to 2 successfully', function () {
args.legend.inset.step = 2; beforeAll(function(){
expect(true).toBeTruthy(); args.legend.inset.step = 2;
}); });
it('should have automatically calculated height', function () { it('should have automatically calculated height', function () {
var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
expect(box.height).toBe(48); expect(box.height).toBe(48);
});
}); });
it('should update args to have only one series', function () { describe('with only one series', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 30, 200, 100, 400, 150, 250], columns: [
] ['data1', 30, 200, 100, 400, 150, 250],
}, ]
legend: { },
position: 'inset' legend: {
} position: 'inset'
}; }
expect(true).toBeTruthy(); };
}); });
it('should locate legend properly', function () { it('should locate legend properly', function () {
var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); var box = d3.select('.c3-legend-background').node().getBoundingClientRect();
expect(box.height).toBe(28); expect(box.height).toBe(28);
expect(box.width).toBeGreaterThan(64); expect(box.width).toBeGreaterThan(64);
});
}); });
}); });
describe('legend.hide', function () { describe('legend.hide', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -154,7 +156,6 @@ describe('c3 chart legend', function () {
hide: true hide: true
} }
}; };
expect(true).toBeTruthy();
}); });
it('should not show legends', function () { it('should not show legends', function () {
@ -163,31 +164,32 @@ describe('c3 chart legend', function () {
}); });
}); });
it('should update args', function () { describe('hidden legend', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 30, 200, 100, 400, 150, 250], columns: [
['data2', 130, 100, 200, 100, 250, 150] ['data1', 30, 200, 100, 400, 150, 250],
] ['data2', 130, 100, 200, 100, 250, 150]
}, ]
legend: { },
hide: 'data2' legend: {
} hide: 'data2'
}; }
expect(true).toBeTruthy(); };
}); });
it('should not show legends', function () { it('should not show legends', function () {
expect(d3.select('.c3-legend-item-data1').style('visibility')).toBe('visible'); expect(d3.select('.c3-legend-item-data1').style('visibility')).toBe('visible');
expect(d3.select('.c3-legend-item-data2').style('visibility')).toBe('hidden'); expect(d3.select('.c3-legend-item-data2').style('visibility')).toBe('hidden');
});
}); });
}); });
describe('legend.show', function () { describe('legend.show', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -199,7 +201,6 @@ describe('c3 chart legend', function () {
show: false show: false
} }
}; };
expect(true).toBeTruthy();
}); });
it('should not initially have rendered any legend items', function () { it('should not initially have rendered any legend items', function () {
@ -218,7 +219,7 @@ describe('c3 chart legend', function () {
}); });
describe('custom legend size', function() { describe('custom legend size', function() {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -235,20 +236,19 @@ describe('c3 chart legend', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('renders the legend item with the correct width and height', function () { it('renders the legend item with the correct width and height', function () {
d3.selectAll('.c3-legend-item-tile').each(function () { d3.selectAll('.c3-legend-item-tile').each(function () {
expect(d3.select(this).style('stroke-width')).toBe(args.legend.item.tile.height + 'px'); 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'); var tileWidth = d3.select(this).attr('x2') - d3.select(this).attr('x1');
expect(tileWidth).toBe(args.legend.item.tile.width); expect(tileWidth).toBe(args.legend.item.tile.width);
}); });
}); });
}); });
describe('custom legend padding', function() { describe('custom legend padding', function() {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -260,14 +260,13 @@ describe('c3 chart legend', function () {
padding: 10 padding: 10
} }
}; };
expect(true).toBeTruthy();
}); });
it('renders the correct amount of padding on the legend element', function () { 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) { 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, var itemWidth = d3.select(this).node().parentNode.getBBox().width,
textBoxWidth = d3.select(d3.select(this).node().parentNode).select('text').node().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 tileWidth = 15, // default value is 10, plus 5 more for padding
expectedWidth = textBoxWidth + tileWidth + (index ? 0 : 10) + args.legend.padding; expectedWidth = textBoxWidth + tileWidth + (index ? 0 : 10) + args.legend.padding;
expect(itemWidth).toBe(expectedWidth); expect(itemWidth).toBe(expectedWidth);

16
spec/shape.bar-spec.js
Unescape View File

@ -12,7 +12,7 @@ describe('c3 chart shape bar', function () {
describe('with groups', function () { describe('with groups', function () {
describe('with indexed data', function () { describe('with indexed data', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -25,7 +25,6 @@ describe('c3 chart shape bar', function () {
type: 'bar' type: 'bar'
}, },
}; };
expect(true).toBeTruthy();
}); });
it('should be stacked', function () { it('should be stacked', function () {
var expectedBottom = [275, 293, 365, 281, 395, 290]; var expectedBottom = [275, 293, 365, 281, 395, 290];
@ -37,7 +36,7 @@ describe('c3 chart shape bar', function () {
}); });
describe('with timeseries data', function () { describe('with timeseries data', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
x: 'date', x: 'date',
@ -57,7 +56,6 @@ describe('c3 chart shape bar', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should be stacked', function () { it('should be stacked', function () {
var expectedBottom = [275, 293, 365, 281, 395, 290]; var expectedBottom = [275, 293, 365, 281, 395, 290];
@ -69,7 +67,7 @@ describe('c3 chart shape bar', function () {
}); });
describe('with category data', function () { describe('with category data', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
x: 'date', x: 'date',
@ -89,8 +87,8 @@ describe('c3 chart shape bar', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should be stacked', function () { it('should be stacked', function () {
var expectedBottom = [275, 293, 365, 281, 395, 290]; var expectedBottom = [275, 293, 365, 281, 395, 290];
chart.internal.main.selectAll('.c3-bars-data1 .c3-bar').each(function (d, i) { chart.internal.main.selectAll('.c3-bars-data1 .c3-bar').each(function (d, i) {
@ -106,7 +104,7 @@ describe('c3 chart shape bar', function () {
describe('with normal axis', function () { describe('with normal axis', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -120,7 +118,6 @@ describe('c3 chart shape bar', function () {
rotated: false rotated: false
} }
}; };
expect(true).toBeTruthy();
}); });
it('should not be within bar', function () { it('should not be within bar', function () {
@ -151,9 +148,8 @@ describe('c3 chart shape bar', function () {
describe('with rotated axis', function () { describe('with rotated axis', function () {
it('should change the chart as axis rotated', function () { beforeAll(function () {
args.axis.rotated = true; args.axis.rotated = true;
expect(true).toBeTruthy();
}); });
it('should not be within bar', function () { it('should not be within bar', function () {

169
spec/shape.line-spec.js
Unescape View File

@ -11,7 +11,7 @@ describe('c3 chart shape line', function () {
describe('shape-rendering for line chart', function () { describe('shape-rendering for line chart', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -22,8 +22,6 @@ describe('c3 chart shape line', function () {
type: 'line' type: 'line'
} }
}; };
expect(true).toBeTruthy();
}); });
it("Should render the lines correctly", function(done) { it("Should render the lines correctly", function(done) {
@ -42,97 +40,100 @@ describe('c3 chart shape line', function () {
}); });
}); });
it('should change to step chart', function () { describe('should change to step chart', function () {
args.data.type = 'step'; beforeAll(function(){
expect(true).toBeTruthy(); args.data.type = 'step';
}); });
it("should have shape-rendering = crispedges when it's step chart", function () { it("should have shape-rendering = crispedges when it's step chart", function () {
d3.selectAll('.c3-line').each(function () { d3.selectAll('.c3-line').each(function () {
var style = d3.select(this).style('shape-rendering').toLowerCase(); var style = d3.select(this).style('shape-rendering').toLowerCase();
expect(style).toBe('crispedges'); expect(style).toBe('crispedges');
});
}); });
}); });
it('should change to spline chart', function () { describe('should change to spline chart', function () {
args.data.type = 'spline'; beforeAll(function(){
expect(true).toBeTruthy(); args.data.type = 'spline';
}); });
it('should use cardinal interpolation by default', function () { it('should use cardinal interpolation by default', function () {
expect(chart.internal.config.spline_interpolation_type).toBe('cardinal'); expect(chart.internal.config.spline_interpolation_type).toBe('cardinal');
});
}); });
}); });
describe('point.show option', function () { describe('point.show option', function () {
it('should change args to include null data', function () { describe('should change args to include null data', function () {
args = { beforeAll(function(){
data: { args = {
columns: [ data: {
['data1', 30, null, 100, 400, -150, 250], columns: [
['data2', 50, 20, 10, 40, 15, 25], ['data1', 30, null, 100, 400, -150, 250],
['data3', -150, 120, 110, 140, 115, 125] ['data2', 50, 20, 10, 40, 15, 25],
], ['data3', -150, 120, 110, 140, 115, 125]
type: 'line' ],
} type: 'line'
}; }
expect(true).toBeTruthy(); };
}); });
it('should not show the circle for null', function (done) { it('should not show the circle for null', function (done) {
setTimeout(function () { setTimeout(function () {
var target = chart.internal.main.select('.c3-chart-line.c3-target-data1'); 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-0').style('opacity')).toBe(1);
expect(+target.select('.c3-circle-1').style('opacity')).toBe(0); expect(+target.select('.c3-circle-1').style('opacity')).toBe(0);
expect(+target.select('.c3-circle-2').style('opacity')).toBe(1); expect(+target.select('.c3-circle-2').style('opacity')).toBe(1);
done(); done();
}, 500); }, 500);
}); });
it('should not draw a line segment for null data', function(done) { it('should not draw a line segment for null data', function(done) {
setTimeout(function () { setTimeout(function () {
var target = chart.internal.main.select('.c3-chart-line.c3-target-data1'); var target = chart.internal.main.select('.c3-chart-line.c3-target-data1');
var commands = parseSvgPath( target.select('.c3-line-data1').attr('d')); var commands = parseSvgPath( target.select('.c3-line-data1').attr('d'));
var segments = 0; var segments = 0;
for(var i = 0; i < commands.length; i++) { for(var i = 0; i < commands.length; i++) {
(commands[i].command === 'L') ? segments++ : null; (commands[i].command === 'L') ? segments++ : null;
} }
expect(segments).toBe(3); expect(segments).toBe(3);
done(); done();
}, 500); }, 500);
}); });
// it('should change args to include null data on scatter plot', function () { // it('should change args to include null data on scatter plot', function () {
// args = { // args = {
// data: { // data: {
// columns: [ // columns: [
// ['data1', 30, null, 100, 400, -150, 250], // ['data1', 30, null, 100, 400, -150, 250],
// ['data2', 50, 20, 10, 40, 15, 25], // ['data2', 50, 20, 10, 40, 15, 25],
// ['data3', -150, 120, 110, 140, 115, 125] // ['data3', -150, 120, 110, 140, 115, 125]
// ], // ],
// type: 'scatter' // type: 'scatter'
// } // }
// }; // };
// expect(true).toBeTruthy(); // expect(true).toBeTruthy();
// }); // });
// it('should not show the circle for null', function (done) { // it('should not show the circle for null', function (done) {
// setTimeout(function () { // setTimeout(function () {
// var target = chart.internal.main.select('.c3-chart-line.c3-target-data1'); // 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-0').style('opacity')).toBe(0.5);
// expect(+target.select('.c3-circle-1').style('opacity')).toBe(0); // expect(+target.select('.c3-circle-1').style('opacity')).toBe(0);
// expect(+target.select('.c3-circle-2').style('opacity')).toBe(0.5); // expect(+target.select('.c3-circle-2').style('opacity')).toBe(0.5);
// done(); // done();
// }, 500); // }, 500);
// }); // });
});
}); });
describe('spline.interpolation option', function () { describe('spline.interpolation option', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -148,23 +149,21 @@ describe('c3 chart shape line', function () {
} }
} }
}; };
expect(true).toBeTruthy();
}); });
it('should update interpolation function', function() { it('updates interpolation function', function() {
expect(chart.internal.getInterpolate(chart.data()[0])).toBe('monotone'); expect(chart.internal.getInterpolate(chart.data()[0])).toBe('monotone');
}); });
it('should not use a non-valid interpolation', function () { describe('should not use a non-valid interpolation', function () {
args.spline.interpolation.type = 'foo'; beforeAll(function(){
expect(true).toBeTruthy(); args.spline.interpolation.type = 'foo';
}); });
it('should use cardinal interpolation when given option is not valid', function() { it('should use cardinal interpolation when given option is not valid', function() {
expect(chart.internal.getInterpolate(chart.data()[0])).toBe('cardinal'); expect(chart.internal.getInterpolate(chart.data()[0])).toBe('cardinal');
});
}); });
}); });
}); });

3
spec/tooltip-spec.js
Unescape View File

@ -45,9 +45,8 @@ describe('c3 chart tooltip', function () {
describe('with left margin', function () { describe('with left margin', function () {
it('should set left margin', function () { beforeAll(function () {
d3.select('#chart').style('margin-left', '300px'); d3.select('#chart').style('margin-left', '300px');
expect(true).toBeTruthy();
}); });
it('should show tooltip on proper position', function () { it('should show tooltip on proper position', function () {

88
spec/type-spec.js
Unescape View File

@ -11,7 +11,7 @@ describe('c3 chart types', function () {
describe('with data', function () { describe('with data', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -22,47 +22,47 @@ describe('c3 chart types', function () {
type: 'pie' type: 'pie'
} }
}; };
expect(true).toBeTruthy();
}); });
it('should return true', function () { it('should return true', function () {
expect(chart.internal.hasArcType()).toBeTruthy(); expect(chart.internal.hasArcType()).toBeTruthy();
}); });
it('should change chart type to "bar"', function () { describe('should change chart type to "bar"', function () {
args.data.type = 'bar'; beforeAll(function(){
expect(true).toBeTruthy(); args.data.type = 'bar';
}); });
it('should return false', function () { it('should return false', function () {
expect(chart.internal.hasArcType()).toBeFalsy(); expect(chart.internal.hasArcType()).toBeFalsy();
});
}); });
}); });
describe('with empty data', function () { describe('with empty data', function () {
it('should update args to have empty data', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [], columns: [],
type: 'pie' type: 'pie'
} }
}; };
expect(true).toBeTruthy();
}); });
it('should return true', function () { it('should return true', function () {
expect(chart.internal.hasArcType()).toBeTruthy(); expect(chart.internal.hasArcType()).toBeTruthy();
}); });
it('should change chart type to "bar"', function () { describe('should change chart type to "bar"', function () {
args.data.type = 'bar'; beforeAll(function(){
expect(true).toBeTruthy(); args.data.type = 'bar';
}); });
it('should return false', function () { it('should return false', function () {
expect(chart.internal.hasArcType()).toBeFalsy(); expect(chart.internal.hasArcType()).toBeFalsy();
});
}); });
}); });
@ -71,7 +71,7 @@ describe('c3 chart types', function () {
describe('internal.hasType', function () { describe('internal.hasType', function () {
it('should update args', function () { beforeAll(function () {
args = { args = {
data: { data: {
columns: [ columns: [
@ -82,7 +82,6 @@ describe('c3 chart types', function () {
type: 'pie' type: 'pie'
} }
}; };
expect(true).toBeTruthy();
}); });
it('should return true for "pie" type', function () { it('should return true for "pie" type', function () {
@ -97,41 +96,42 @@ describe('c3 chart types', function () {
expect(chart.internal.hasType('bar')).toBeFalsy(); expect(chart.internal.hasType('bar')).toBeFalsy();
}); });
it('should unload successfully', function () { describe('should unload successfully', function () {
chart.unload([]); beforeAll(function(){
expect(true).toBeTruthy(); chart.unload([]);
}); });
it('should return true for "pie" type even if no data', function () { it('should return true for "pie" type even if no data', function () {
expect(chart.internal.hasType('pie')).toBeTruthy(); expect(chart.internal.hasType('pie')).toBeTruthy();
}); });
it('should return false for "line" type even if no data', function () { it('should return false for "line" type even if no data', function () {
expect(chart.internal.hasType('line')).toBeFalsy(); expect(chart.internal.hasType('line')).toBeFalsy();
}); });
it('should return false for "bar" type even if no data', function () { it('should return false for "bar" type even if no data', function () {
expect(chart.internal.hasType('bar')).toBeFalsy(); expect(chart.internal.hasType('bar')).toBeFalsy();
}); });
it('should change chart type to "bar" successfully', function () { describe('should change chart type to "bar" successfully', function () {
args.data.type = 'bar'; beforeAll(function(){
expect(true).toBeTruthy(); args.data.type = 'bar';
}); });
it('should return false for "pie" type even if no data', function () { it('should return false for "pie" type even if no data', function () {
expect(chart.internal.hasType('pie')).toBeFalsy(); expect(chart.internal.hasType('pie')).toBeFalsy();
}); });
it('should return false for "line" type even if no data', function () { it('should return false for "line" type even if no data', function () {
expect(chart.internal.hasType('line')).toBeFalsy(); expect(chart.internal.hasType('line')).toBeFalsy();
}); });
it('should return true for "bar" type even if no data', function () { it('should return true for "bar" type even if no data', function () {
expect(chart.internal.hasType('bar')).toBeTruthy(); expect(chart.internal.hasType('bar')).toBeTruthy();
});
});
}); });
}); });
}); });

Write Preview
Loading…
Cancel
Save