diff --git a/spec/api.axis-spec.js b/spec/api.axis-spec.js index 5764f73..6e45dc6 100644 --- a/spec/api.axis-spec.js +++ b/spec/api.axis-spec.js @@ -9,7 +9,7 @@ describe('c3 api axis', function () { describe('axis.labels', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { 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'}); var label = d3.select('.c3-axis-y-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'); }); - it('should update y axis label', function () { + it('updates 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'); diff --git a/spec/api.focus-spec.js b/spec/api.focus-spec.js index df64e80..6372111 100644 --- a/spec/api.focus-spec.js +++ b/spec/api.focus-spec.js @@ -378,11 +378,10 @@ describe('c3 api focus', function () { describe('when legend.show = false', function () { - it('should update args to hide legend', function () { + beforeAll(function () { args.legend = { show: false }; - expect(true).toBeTruthy(); }); it('should focus all targets without showing legend', function (done) { diff --git a/spec/api.grid-spec.js b/spec/api.grid-spec.js index ebaeee6..f0abf9f 100644 --- a/spec/api.grid-spec.js +++ b/spec/api.grid-spec.js @@ -9,7 +9,7 @@ describe('c3 api grid', function () { describe('ygrid.add and ygrid.remove', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { 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, expectedGrids = [ { @@ -62,7 +61,7 @@ describe('c3 api grid', function () { }, 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, expectedGrids = [ { diff --git a/spec/api.load-spec.js b/spec/api.load-spec.js index fbea981..cb2d7c9 100644 --- a/spec/api.load-spec.js +++ b/spec/api.load-spec.js @@ -11,7 +11,7 @@ describe('c3 api load', function () { describe('as column', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -20,7 +20,6 @@ describe('c3 api load', function () { ] } }; - expect(true).toBeTruthy(); }); it('should load additional data', function (done) { @@ -46,7 +45,7 @@ describe('c3 api load', function () { describe('category data', function () { - it('should update arg to category data', function () { + beforeAll(function () { args = { data: { x: 'x', @@ -62,7 +61,6 @@ describe('c3 api load', function () { } } }; - expect(true).toBeTruthy(); }); describe('as column', function () { diff --git a/spec/api.region-spec.js b/spec/api.region-spec.js index ebd3b43..915ad0d 100644 --- a/spec/api.region-spec.js +++ b/spec/api.region-spec.js @@ -9,7 +9,7 @@ describe('c3 api region', function () { describe('api.region', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { 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, expectedRegions = [ { @@ -84,7 +83,7 @@ describe('c3 api region', function () { describe('api.region.add', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -106,7 +105,6 @@ describe('c3 api region', function () { } ] }; - expect(true).toBeTruthy(); }); it('should add regions', function (done) { @@ -175,7 +173,7 @@ describe('c3 api region', function () { describe('api.region.remove', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -203,7 +201,6 @@ describe('c3 api region', function () { }, ] }; - expect(true).toBeTruthy(); }); it('should remove regions', function (done) { diff --git a/spec/api.zoom-spec.js b/spec/api.zoom-spec.js index 4a65927..adba585 100644 --- a/spec/api.zoom-spec.js +++ b/spec/api.zoom-spec.js @@ -9,7 +9,7 @@ describe('c3 api zoom', function () { describe('zoom', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -22,7 +22,6 @@ describe('c3 api zoom', function () { enabled: true } }; - expect(true).toBeTruthy(); }); it('should be zoomed properly', function () { @@ -41,48 +40,48 @@ describe('c3 api zoom', function () { 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' + describe('with timeseries data', function () { + beforeAll(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 } - }, - 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])); + }); }); - - 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -93,7 +92,6 @@ describe('c3 api zoom', function () { enabled: true } }; - expect(true).toBeTruthy(); }); it('should be unzoomed properly', function () { diff --git a/spec/arc-spec.js b/spec/arc-spec.js index 242a8fe..5a8038e 100644 --- a/spec/arc-spec.js +++ b/spec/arc-spec.js @@ -9,7 +9,7 @@ describe('c3 chart arc', function () { describe('show pie chart', function () { - it('should update args to have pie chart', function () { + beforeAll(function () { args = { data: { columns: [ @@ -20,7 +20,6 @@ describe('c3 chart arc', function () { type: 'pie' } }; - expect(true).toBeTruthy(); }); 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/); }); - 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('with data id that can be converted to a color', function () { + beforeAll(function(){ + args.data.columns = [ + ['black', 30], + ['data2', 150], + ['data3', 120] + ]; + }); + + 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); + }); + + describe('with empty pie chart', function(){ + beforeAll(function () { + args = { + data: { + columns: [ + ['data1', null], + ['data2', null], + ['data3', null] + ], + type: 'pie' + } + }; + }); + + 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(); - }); + describe('with a 180 degree gauge', function(){ + beforeAll(function () { + args = { + gauge: { + width: 10, + max: 10, + expand: true + }, + data: { + columns: [ + ['data', 8] + ], + type: 'gauge' + } + }; + }); - 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'); + 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'); - // 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/); + 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 labels use custom text', function() { - args = { - gauge: { - width: 10, - max: 100, - expand: true, - label: { - extents: function (value, isMax) { - if (isMax) { - return 'Max: ' + value + '%'; + describe('with a 2 Pi radian gauge that starts at Pi/2', function() { + beforeAll(function(){ + args = { + gauge: { + width: 10, + max: 10, + expand: true, + fullCircle: true + }, + 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: { - columns: [ - ['data', 8] - ], - type: 'gauge', - fullCircle: true, - startingAngle: Math.PI/2 - } - }; - 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%'); + }; + }); + 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%'); + }); + }); }); }); diff --git a/spec/axis-spec.js b/spec/axis-spec.js index 1e4d5be..6cfc038 100644 --- a/spec/axis-spec.js +++ b/spec/axis-spec.js @@ -33,64 +33,65 @@ describe('c3 chart axis', function () { 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(); - }); + describe('with only 1 tick on y axis', function () { + beforeAll(function(){ + args.axis.y.tick.count = 1; + }); - 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 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(); - }); + describe('with 2 ticks on y axis', function () { + beforeAll(function(){ + args.axis.y.tick.count = 2; + }); - 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 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(); - }); + describe('with 3 ticks on y axis', function () { + beforeAll(function(){ + args.axis.y.tick.count = 3; + }); - it('should have 3 ticks on y axis', function () { - var ticksSize = d3.select('.c3-axis-y').selectAll('g.tick').size(); - expect(ticksSize).toBe(3); + 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(); - }); + describe('with only 2 ticks on y axis', function () { + beforeAll(function(){ + args.axis.y.tick.values = values; + }); - 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 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]); + 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -107,7 +108,6 @@ describe('c3 chart axis', function () { } } }; - expect(true).toBeTruthy(); }); 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 () { - args.axis.y.tick.time = { - value : 'seconds', - interval : 60 - }; - expect(true).toBeTruthy(); - }); + describe('with axis.y.time', function () { + beforeAll(function(){ + args.axis.y.tick.time = { + value : 'seconds', + interval : 60 + }; + }); - 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 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; + 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; + }); }); }); }); @@ -167,7 +168,7 @@ describe('c3 chart axis', function () { } }; 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 () { @@ -185,7 +186,7 @@ describe('c3 chart axis', function () { describe('not rotated', function () { - it('should update args successfully', function () { + beforeAll(function () { args = { data: { columns: [ @@ -202,7 +203,6 @@ describe('c3 chart axis', function () { } } }; - expect(true).toBeTruthy(); }); 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 () { - args.axis.x = { - tick: { - format: function () { - return 'very long tick text on x axis'; + describe('should set axis.x.tick.format', function () { + beforeAll(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 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 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 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(); - }); + describe('should set big values in y', function () { + beforeAll(function(){ + args.data.columns = [ + ['data1', 3000000000000000, 200, 100, 400, 150, 250], + ['data2', 50, 20, 10, 40, 15, 25] + ]; + }); - 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); + 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 () { + beforeAll(function () { args.axis.rotated = true; - expect(true).toBeTruthy(); }); it('should split x axis tick text to multiple lines', function () { @@ -367,7 +367,7 @@ describe('c3 chart axis', function () { describe('not rotated', function () { - it('should update args successfully', function () { + beforeAll(function () { args = { data: { x: 'x', @@ -383,7 +383,6 @@ describe('c3 chart axis', function () { } } }; - expect(true).toBeTruthy(); }); it('should locate ticks properly', function () { @@ -429,9 +428,8 @@ describe('c3 chart axis', function () { describe('rotated', function () { - it('should update args to rotate axis', function () { + beforeAll(function () { args.axis.rotated = true; - expect(true).toBeTruthy(); }); it('should locate ticks on rotated axis properly', function () { @@ -480,11 +478,10 @@ describe('c3 chart axis', function () { describe('as null', function () { - it('should update args not to split ticks', function () { + beforeAll(function () { //'without split ticks', args.axis.x.tick = { multiline: false }; - expect(true).toBeTruthy(); }); it('should split x tick', function () { @@ -497,11 +494,10 @@ describe('c3 chart axis', function () { describe('as value', function () { - it('should update args not to split ticks', function () { + beforeAll(function () { // 'without split ticks', args.axis.x.tick = { width: 150 }; - expect(true).toBeTruthy(); }); 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 () { - it('should update args to use axis.x.tick.format', function () { + beforeAll(function () { // 'with axis.x.tick.format', 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 () { @@ -556,7 +551,7 @@ describe('c3 chart axis', function () { describe('not rotated', function () { - it('should update args successfully', function () { + beforeAll(function () { args = { data: { x: 'x', @@ -575,7 +570,6 @@ describe('c3 chart axis', function () { } } }; - expect(true).toBeTruthy(); }); it('should rotate tick texts', function () { @@ -603,7 +597,7 @@ describe('c3 chart axis', function () { describe('not rotated', function () { - it('should update args successfully', function () { + beforeAll(function () { args = { data: { columns: [ @@ -620,7 +614,6 @@ describe('c3 chart axis', function () { } } }; - expect(true).toBeTruthy(); }); it('should rotate tick texts', function () { @@ -646,7 +639,7 @@ describe('c3 chart axis', 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 = { data: { columns: [ @@ -656,7 +649,6 @@ describe('c3 chart axis', function () { ] } }; - expect(true).toBeTruthy(); }); it('should show fitted ticks on indexed data', function () { @@ -664,93 +656,95 @@ describe('c3 chart axis', function () { 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(); - }); + describe('should set args for x-based data', function () { + beforeAll(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] + ] + } + }; + }); - 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 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); + 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 + describe('should set args for indexed data', function () { + beforeAll(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 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); - }); + describe('should set args for x-based data', function () { + beforeAll(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] + ] + }; + }); - 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); - }); + 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -764,7 +758,6 @@ describe('c3 chart axis', function () { } } }; - expect(true).toBeTruthy(); }); 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 () { - args.axis.y.inner = true; - expect(true).toBeTruthy(); - }); + describe('with inner y axis', function () { + beforeAll(function(){ + args.axis.y.inner = true; + }); - 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); + 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -809,7 +802,6 @@ describe('c3 chart axis', function () { } } }; - expect(true).toBeTruthy(); }); 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 () { - args.axis.y2.inner = true; - expect(true).toBeTruthy(); - }); + describe('with inner y axis', function () { + beforeAll(function(){ + args.axis.y2.inner = true; + }); - 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); + 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); + }); }); }); - }); }); diff --git a/spec/core-spec.js b/spec/core-spec.js index 785c4ab..13b7347 100644 --- a/spec/core-spec.js +++ b/spec/core-spec.js @@ -27,20 +27,22 @@ describe('c3 chart', function () { expect(svg).not.toBeNull(); }); - it('should set 3rd party property to Function', function () { - Function.prototype.$extIsFunction = true; - expect(true).toBeTruthy(); - }); + describe('should set 3rd party property to Function', function () { + beforeAll(function(){ + 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 () { - var svg = d3.select('#chart svg'); - expect(svg.attr('class')).not.toBeNull(); - expect(svg.attr('class')).toBe('customclass'); + 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'); + }); }); }); @@ -61,11 +63,11 @@ describe('c3 chart', function () { describe('bindto', function () { describe('selector', function () { - it('update args', function () { + beforeAll(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); @@ -73,10 +75,9 @@ describe('c3 chart', function () { }); describe('d3.selection object', function () { - it('update args', function () { + beforeAll(function () { d3.select('#chart').html(''); args.bindto = d3.select('#chart'); - expect(true).toBeTruthy(); }); it('should be created', function () { var svg = d3.select('#chart svg'); @@ -85,11 +86,11 @@ describe('c3 chart', function () { }); describe('null', function () { - it('update args', function () { + beforeAll(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); @@ -97,22 +98,20 @@ describe('c3 chart', function () { }); describe('empty string', function () { - it('update args', function () { + beforeAll(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 () { + beforeAll(function () { args = { data: { columns: [ @@ -121,7 +120,6 @@ describe('c3 chart', function () { ] } }; - expect(true).toBeTruthy(); }); it('should generate a chart', function () { @@ -129,30 +127,30 @@ describe('c3 chart', function () { 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' + describe('more empty data', function () { + beforeAll(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); + it('should generate a chart', function () { + var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'); + expect(ticks.size()).toBe(0); + }); }); - }); }); diff --git a/spec/data-spec.js b/spec/data-spec.js index bcbb648..2fb4100 100644 --- a/spec/data-spec.js +++ b/spec/data-spec.js @@ -9,7 +9,7 @@ describe('c3 chart data', function () { describe('load json', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { json: { @@ -18,7 +18,6 @@ describe('c3 chart data', function () { } } }; - expect(true).toBeTruthy(); }); it('should draw correctly', function () { @@ -31,142 +30,143 @@ describe('c3 chart data', function () { }); }); - it('should update args', function () { - args = { - data: { - json: [{ - "date": "2014-06-03", - "443": "3000", - "995": "500" - }, { - "date": "2014-06-04", - "443": "1000" - }, { - "date": "2014-06-05", - "443": "5000", - "995": "1000" - }], - keys: { - x: 'date', - value: [ "443", "995" ] - } - }, - axis: { - x: { - type: "category" + describe('more data', function(){ + beforeAll(function () { + args = { + data: { + json: [{ + "date": "2014-06-03", + "443": "3000", + "995": "500" + }, { + "date": "2014-06-04", + "443": "1000" + }, { + "date": "2014-06-05", + "443": "5000", + "995": "1000" + }], + keys: { + x: 'date', + value: [ "443", "995" ] + } + }, + axis: { + x: { + type: "category" + } } - } - }; - expect(true).toBeTruthy(); - }); - - it('should draw correctly', function () { - var expectedCx = {443: [98, 294, 490], 995: [98, 294, 490]}, - expectedCy = {443: [194, 351, 36], 995: [391, 430, 351]}; - d3.selectAll('.c3-circles-443 .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[443][i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[443][i], 0); + }; }); - d3.selectAll('.c3-circles-995 .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[995][i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[995][i], 0); + + it('should draw correctly', function () { + var expectedCx = {443: [98, 294, 490], 995: [98, 294, 490]}, + expectedCy = {443: [194, 351, 36], 995: [391, 430, 351]}; + d3.selectAll('.c3-circles-443 .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[443][i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[443][i], 0); + }); + d3.selectAll('.c3-circles-995 .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[995][i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[995][i], 0); + }); }); }); - it('should update nested JSON args', function () { - args = { - data: { - json: [{ - "date": "2014-06-03", - "443": "3000", - "995": {"996": "500"}, - "112": ["600"], - "223": [{"224": "100"}], - "334": [[],[{"335": "300"}]], - "556": {"557" : {"558" : ["1000"]}} - }, { - "date": "2014-06-04", - "443": "1000", - "112": ["700"], - "223": [{"224": "200"}], - "556": {"557" : {"558" : ["2000"]}} - }, { - "date": "2014-06-05", - "995": {"996": "1000"}, - "112": ["800"], - "223": [{"224": "300"}], - "443": "5000", - "334": [[],[{"335": "500"}]], - "556": {"557" : {"558" : ["3000"]}} - }], - keys: { - x: 'date', - value: [ "443","995.996","112[0]","223[0].224","334[1][0].335","556.557.558[0]"] - } - }, - axis: { - x: { - type: "category" + describe('with nested JSON args', function () { + beforeAll(function(){ + args = { + data: { + json: [{ + "date": "2014-06-03", + "443": "3000", + "995": {"996": "500"}, + "112": ["600"], + "223": [{"224": "100"}], + "334": [[],[{"335": "300"}]], + "556": {"557" : {"558" : ["1000"]}} + }, { + "date": "2014-06-04", + "443": "1000", + "112": ["700"], + "223": [{"224": "200"}], + "556": {"557" : {"558" : ["2000"]}} + }, { + "date": "2014-06-05", + "995": {"996": "1000"}, + "112": ["800"], + "223": [{"224": "300"}], + "443": "5000", + "334": [[],[{"335": "500"}]], + "556": {"557" : {"558" : ["3000"]}} + }], + keys: { + x: 'date', + value: [ "443","995.996","112[0]","223[0].224","334[1][0].335","556.557.558[0]"] + } + }, + axis: { + x: { + type: "category" + } } - } - }; - expect(true).toBeTruthy(); - }); - - it('should draw nested JSON correctly', function () { - var expectedCx = [98, 294, 490], - expectedCy = { - 443: [181, 326, 36], - 995: [362, 398, 326], - 112: [354, 347, 340], - 223: [391, 383, 376], - 334: [376, 398, 362], - 556: [326, 253, 181] }; - - d3.selectAll('.c3-circles-443 .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[443][i], 0); }); - d3.selectAll('.c3-circles-995-996 .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[995][i], 0); - }); + it('should draw nested JSON correctly', function () { + var expectedCx = [98, 294, 490], + expectedCy = { + 443: [181, 326, 36], + 995: [362, 398, 326], + 112: [354, 347, 340], + 223: [391, 383, 376], + 334: [376, 398, 362], + 556: [326, 253, 181] + }; - d3.selectAll('.c3-circles-112-0- .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[112][i], 0); - }); + d3.selectAll('.c3-circles-443 .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[443][i], 0); + }); - d3.selectAll('.c3-circles-223-0--224 .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[223][i], 0); - }); + d3.selectAll('.c3-circles-995-996 .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[995][i], 0); + }); - d3.selectAll('.c3-circles-334-1--0--335 .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[334][i], 0); - }); + d3.selectAll('.c3-circles-112-0- .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[112][i], 0); + }); - d3.selectAll('.c3-circles-556-557-558-0- .c3-circle').each(function (d, i) { - var circle = d3.select(this); - expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); - expect(+circle.attr('cy')).toBeCloseTo(expectedCy[556][i], 0); + d3.selectAll('.c3-circles-223-0--224 .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[223][i], 0); + }); + + d3.selectAll('.c3-circles-334-1--0--335 .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[334][i], 0); + }); + + d3.selectAll('.c3-circles-556-557-558-0- .c3-circle').each(function (d, i) { + var circle = d3.select(this); + expect(+circle.attr('cx')).toBeCloseTo(expectedCx[i], 0); + expect(+circle.attr('cy')).toBeCloseTo(expectedCy[556][i], 0); + }); }); }); - }); describe('function in data.order', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -179,7 +179,6 @@ describe('c3 chart data', function () { } } }; - expect(true).toBeTruthy(); }); it('should return false in isOrderAsc and isOrderDesc functions', function () { @@ -189,7 +188,7 @@ describe('c3 chart data', function () { describe('data.xs', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -199,7 +198,6 @@ describe('c3 chart data', function () { ], } }; - expect(true).toBeTruthy(); }); describe('normal x', function () { @@ -224,7 +222,7 @@ describe('c3 chart data', function () { describe('timeseries x', function () { describe('without xFormat', function () { - it('should load timeseries data successfully', function () { + beforeAll(function () { args = { data: { x : 'date', @@ -240,7 +238,6 @@ describe('c3 chart data', function () { } } }; - expect(true).toBeTruthy(); }); it('should have correct number of xs', function () { @@ -262,7 +259,7 @@ describe('c3 chart data', function () { describe('with xFormat', function () { describe('timeseries x with xFormat', function () { - it('should load timeseries data successfully', function () { + beforeAll(function () { args = { data: { x : 'date', @@ -279,7 +276,6 @@ describe('c3 chart data', function () { } } }; - expect(true).toBeTruthy(); }); it('should have correct number of xs', function () { @@ -304,8 +300,7 @@ describe('c3 chart data', function () { describe('milliseconds timeseries x', function () { describe('as date string', function () { - - it('should update args', function () { + beforeAll(function () { args = { data: { x : 'date', @@ -326,7 +321,6 @@ describe('c3 chart data', function () { } } }; - expect(true).toBeTruthy(); }); it('should have correct number of xs', function () { @@ -354,7 +348,7 @@ describe('c3 chart data', function () { describe('as unixtime number', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { x : 'date', @@ -373,7 +367,6 @@ describe('c3 chart data', function () { } } }; - expect(true).toBeTruthy(); }); it('should have correct number of xs', function () { @@ -399,7 +392,7 @@ describe('c3 chart data', function () { describe('on line chart', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -412,7 +405,6 @@ describe('c3 chart data', function () { labels: true, } }; - expect(true).toBeTruthy(); }); it('should locate data labels in correct position', function () { @@ -437,38 +429,38 @@ describe('c3 chart data', function () { }); }); - it('should update args to be stacked', function () { - args.data.groups = [['data1', 'data2'], ['data3', 'data4']]; - expect(true).toBeTruthy(); - }); + describe('with stacked', function () { + beforeAll(function(){ + args.data.groups = [['data1', 'data2'], ['data3', 'data4']]; + }); - it('should locate data labels in correct position', function () { - var expectedTextY = { - data1: [120, 38, 75], - data2: [161, 127, 159], - data3: [269, 303, 271], - data4: [310, 392, 355], - }; - var expectedTextX = { - data1: [6, 294, 583], - data2: [6, 294, 583], - data3: [6, 294, 583], - data4: [6, 294, 583], - }; - Object.keys(expectedTextY).forEach(function (key) { - d3.selectAll('.c3-texts-' + key + ' text.c3-text').each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedTextY[key][i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedTextX[key][i], -2); + it('should locate data labels in correct position', function () { + var expectedTextY = { + data1: [120, 38, 75], + data2: [161, 127, 159], + data3: [269, 303, 271], + data4: [310, 392, 355], + }; + var expectedTextX = { + data1: [6, 294, 583], + data2: [6, 294, 583], + data3: [6, 294, 583], + data4: [6, 294, 583], + }; + Object.keys(expectedTextY).forEach(function (key) { + d3.selectAll('.c3-texts-' + key + ' text.c3-text').each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedTextY[key][i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedTextX[key][i], -2); + }); }); }); }); - }); describe('on area chart', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -481,7 +473,6 @@ describe('c3 chart data', function () { labels: true, } }; - expect(true).toBeTruthy(); }); it('should locate data labels in correct position', function () { @@ -506,29 +497,30 @@ describe('c3 chart data', function () { }); }); - it('should update args to be stacked', function () { - args.data.groups = [['data1', 'data2'], ['data3', 'data4']]; - expect(true).toBeTruthy(); - }); + describe('with stacked', function () { + beforeAll(function(){ + args.data.groups = [['data1', 'data2'], ['data3', 'data4']]; + }); - it('should locate data labels in correct position', function () { - var expectedTextY = { - data1: [120, 38, 75], - data2: [161, 127, 159], - data3: [269, 303, 271], - data4: [310, 392, 355], - }; - var expectedTextX = { - data1: [6, 294, 583], - data2: [6, 294, 583], - data3: [6, 294, 583], - data4: [6, 294, 583], - }; - Object.keys(expectedTextY).forEach(function (key) { - d3.selectAll('.c3-texts-' + key + ' text.c3-text').each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedTextY[key][i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedTextX[key][i], -2); + it('should locate data labels in correct position', function () { + var expectedTextY = { + data1: [120, 38, 75], + data2: [161, 127, 159], + data3: [269, 303, 271], + data4: [310, 392, 355], + }; + var expectedTextX = { + data1: [6, 294, 583], + data2: [6, 294, 583], + data3: [6, 294, 583], + data4: [6, 294, 583], + }; + Object.keys(expectedTextY).forEach(function (key) { + d3.selectAll('.c3-texts-' + key + ' text.c3-text').each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedTextY[key][i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedTextX[key][i], -2); + }); }); }); }); @@ -537,7 +529,7 @@ describe('c3 chart data', function () { describe('on bar chart', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -550,7 +542,6 @@ describe('c3 chart data', function () { labels: true, } }; - expect(true).toBeTruthy(); }); it('should locate data labels in correct position', function () { @@ -575,70 +566,39 @@ describe('c3 chart data', function () { }); }); - it('should update args to be stacked', function () { - args.data.groups = [['data1', 'data2'], ['data3', 'data4']]; - expect(true).toBeTruthy(); - }); + describe('with stacked', function () { + beforeAll(function(){ + args.data.groups = [['data1', 'data2'], ['data3', 'data4']]; + }); - it('should locate data labels in correct position', function () { - var expectedTextY = { - data1: [120, 38, 75], - data2: [161, 127, 159], - data3: [269, 303, 271], - data4: [310, 392, 355], - }; - var expectedTextX = { - data1: [68.6, 264, 460], - data2: [68.6, 264, 460], - data3: [127, 323, 519], - data4: [127, 323, 519], - }; - Object.keys(expectedTextY).forEach(function (key) { - d3.selectAll('.c3-texts-' + key + ' text.c3-text').each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedTextY[key][i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedTextX[key][i], -2); + it('should locate data labels in correct position', function () { + var expectedTextY = { + data1: [120, 38, 75], + data2: [161, 127, 159], + data3: [269, 303, 271], + data4: [310, 392, 355], + }; + var expectedTextX = { + data1: [68.6, 264, 460], + data2: [68.6, 264, 460], + data3: [127, 323, 519], + data4: [127, 323, 519], + }; + Object.keys(expectedTextY).forEach(function (key) { + d3.selectAll('.c3-texts-' + key + ' text.c3-text').each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedTextY[key][i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedTextX[key][i], -2); + }); }); }); }); - }); describe('for all targets', function () { - it('should update args to show data label for all data', function () { - args = { - data: { - columns: [ - ['data1', 100, 200, 100, 400, 150, 250], - ['data2', 10, 20, 10, 40, 15, 25], - ['data3', 1000, 2000, 1000, 4000, 1500, 2500] - ], - labels: true - } - }; - expect(true).toBeTruthy(); - }); - - it('should have data labels on all data', function () { - d3.selectAll('.c3-texts-data1 text').each(function (d, i) { - expect(d3.select(this).text()).toBe(args.data.columns[0][i + 1] + ''); - }); - d3.selectAll('.c3-texts-data2 text').each(function (d, i) { - expect(d3.select(this).text()).toBe(args.data.columns[1][i + 1] + ''); - }); - d3.selectAll('.c3-texts-data3 text').each(function (d, i) { - expect(d3.select(this).text()).toBe(args.data.columns[2][i + 1] + ''); - }); - }); - - }); - - describe('for each target', function () { - - describe('as true', function () { - - it('should update args to show data label for only data1', function () { + describe('with data label for all data', function () { + beforeAll(function(){ args = { data: { columns: [ @@ -646,58 +606,91 @@ describe('c3 chart data', function () { ['data2', 10, 20, 10, 40, 15, 25], ['data3', 1000, 2000, 1000, 4000, 1500, 2500] ], - labels: { - format: { - data1: true - } - } + labels: true } }; - expect(true).toBeTruthy(); }); it('should have data labels on all data', function () { d3.selectAll('.c3-texts-data1 text').each(function (d, i) { expect(d3.select(this).text()).toBe(args.data.columns[0][i + 1] + ''); }); - d3.selectAll('.c3-texts-data2 text').each(function () { - expect(d3.select(this).text()).toBe(''); + d3.selectAll('.c3-texts-data2 text').each(function (d, i) { + expect(d3.select(this).text()).toBe(args.data.columns[1][i + 1] + ''); }); - d3.selectAll('.c3-texts-data3 text').each(function () { - expect(d3.select(this).text()).toBe(''); + d3.selectAll('.c3-texts-data3 text').each(function (d, i) { + expect(d3.select(this).text()).toBe(args.data.columns[2][i + 1] + ''); }); }); }); + }); - describe('as function', function () { + describe('for each target', function () { - it('should update args to show data label for only data1', function () { - args = { - data: { - columns: [ - ['data1', 100, 200, 100, 400, 150, 250], - ['data2', 10, 20, 10, 40, 15, 25], - ['data3', 1000, 2000, 1000, 4000, 1500, 2500] - ], - labels: { - format: { - data1: d3.format('$') + describe('as true', function () { + + describe('with data label for only data1', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 100, 200, 100, 400, 150, 250], + ['data2', 10, 20, 10, 40, 15, 25], + ['data3', 1000, 2000, 1000, 4000, 1500, 2500] + ], + labels: { + format: { + data1: true + } } } - } - }; - expect(true).toBeTruthy(); - }); + }; + }); - it('should have data labels on all data', function () { - d3.selectAll('.c3-texts-data1 text').each(function (d, i) { - expect(d3.select(this).text()).toBe('$' + args.data.columns[0][i + 1]); + it('should have data labels on all data', function () { + d3.selectAll('.c3-texts-data1 text').each(function (d, i) { + expect(d3.select(this).text()).toBe(args.data.columns[0][i + 1] + ''); + }); + d3.selectAll('.c3-texts-data2 text').each(function () { + expect(d3.select(this).text()).toBe(''); + }); + d3.selectAll('.c3-texts-data3 text').each(function () { + expect(d3.select(this).text()).toBe(''); + }); }); - d3.selectAll('.c3-texts-data2 text').each(function () { - expect(d3.select(this).text()).toBe(''); + }); + }); + + describe('as function', function () { + + describe('with data label for only data1', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 100, 200, 100, 400, 150, 250], + ['data2', 10, 20, 10, 40, 15, 25], + ['data3', 1000, 2000, 1000, 4000, 1500, 2500] + ], + labels: { + format: { + data1: d3.format('$') + } + } + } + }; }); - d3.selectAll('.c3-texts-data3 text').each(function () { - expect(d3.select(this).text()).toBe(''); + + it('should have data labels on all data', function () { + d3.selectAll('.c3-texts-data1 text').each(function (d, i) { + expect(d3.select(this).text()).toBe('$' + args.data.columns[0][i + 1]); + }); + d3.selectAll('.c3-texts-data2 text').each(function () { + expect(d3.select(this).text()).toBe(''); + }); + d3.selectAll('.c3-texts-data3 text').each(function () { + expect(d3.select(this).text()).toBe(''); + }); }); }); }); @@ -706,22 +699,23 @@ describe('c3 chart data', function () { describe('with small values', function () { - it('should update args to show data label', function () { - args = { - data: { - columns: [ - ['data1', 0.03, 0.2, 0.1, 0.4, 0.15, 0.250] - ], - labels: true - } - }; - expect(true).toBeTruthy(); - }); + describe('with data label', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 0.03, 0.2, 0.1, 0.4, 0.15, 0.250] + ], + labels: true + } + }; + }); - it('should have proper y domain', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-0.02); - expect(domain[1]).toBeCloseTo(0.45); + it('should have proper y domain', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-0.02); + expect(domain[1]).toBeCloseTo(0.45); + }); }); }); @@ -729,7 +723,7 @@ describe('c3 chart data', function () { describe('on not rotated axis', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -746,7 +740,6 @@ describe('c3 chart data', function () { } } }; - expect(true).toBeTruthy(); }); it('should have y domain with proper padding', function () { @@ -766,79 +759,80 @@ describe('c3 chart data', function () { }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(189, -1); - expect(domain[1]).toBeCloseTo(201, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(189, -1); + expect(domain[1]).toBeCloseTo(201, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [375, 40, 375, 422], - expectedXs = [6, 198, 391, 583]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [375, 40, 375, 422], + expectedXs = [6, 198, 391, 583]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - }); describe('on rotated axis', function () { - it('should update args', function () { - args.data.type = 'bar'; - args.axis = { - rotated: true - }; - expect(true).toBeTruthy(); - }); + describe('data type bar', function () { + beforeAll(function(){ + args.data.type = 'bar'; + args.axis = { + rotated: true + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(0, -1); - expect(domain[1]).toBeCloseTo(231, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(0, -1); + expect(domain[1]).toBeCloseTo(231, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [57, 163, 269, 375], - expectedXs = [490, 516, 490, 4]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [57, 163, 269, 375], + expectedXs = [490, 516, 490, 4]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(188, -1); - expect(domain[1]).toBeCloseTo(202, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(188, -1); + expect(domain[1]).toBeCloseTo(202, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [9, 147, 286, 424], - expectedXs = [76, 526, 76, 4]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [9, 147, 286, 424], + expectedXs = [76, 526, 76, 4]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - }); }); @@ -847,116 +841,118 @@ describe('c3 chart data', function () { describe('on not rotated axis', function () { - it('should update args', function () { - args = { - data: { - columns: [ - ['data1', -190, 0, -190, null], - ], - type: 'bar', - labels: { - format: function (v) { - if (v === null) { - return 'Not Applicable'; + describe('type bar', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', -190, 0, -190, null], + ], + type: 'bar', + labels: { + format: function (v) { + if (v === null) { + return 'Not Applicable'; + } + return d3.format('$')(v); } - return d3.format('$')(v); } } - } - }; - expect(true).toBeTruthy(); - }); + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-215, -1); - expect(domain[1]).toBeCloseTo(0, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-215, -1); + expect(domain[1]).toBeCloseTo(0, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [368, 12, 368, 12], - expectedXs = [74, 221, 368, 515]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [368, 12, 368, 12], + expectedXs = [74, 221, 368, 515]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-215, -1); - expect(domain[1]).toBeCloseTo(25, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-215, -1); + expect(domain[1]).toBeCloseTo(25, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [395, 60, 395, 12], - expectedXs = [6, 198, 391, 583]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [395, 60, 395, 12], + expectedXs = [6, 198, 391, 583]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - }); describe('on rotated axis', function () { - it('should update args', function () { - args.data.type = 'bar'; - args.axis = { - rotated: true - }; - expect(true).toBeTruthy(); - }); + describe('data type bar', function () { + beforeAll(function(){ + args.data.type = 'bar'; + args.axis = { + rotated: true + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-220, -1); - expect(domain[1]).toBeCloseTo(0, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-220, -1); + expect(domain[1]).toBeCloseTo(0, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [57, 163, 269, 375], - expectedXs = [103, 594, 103, 526]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [57, 163, 269, 375], + expectedXs = [103, 594, 103, 526]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-220, -1); - expect(domain[1]).toBeCloseTo(24, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-220, -1); + expect(domain[1]).toBeCloseTo(24, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [9, 147, 286, 424], - expectedXs = [67, 537, 67, 526]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [9, 147, 286, 424], + expectedXs = [67, 537, 67, 526]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - }); }); @@ -965,112 +961,116 @@ describe('c3 chart data', function () { describe('on non rotated axis', function () { - it('should update args', function () { - args = { - data: { - columns: [ - ['data1', -190, 200, 190, null], - ], - type: 'bar', - labels: { - format: function (v) { - if (v === null) { - return 'Not Applicable'; + describe('data type bar', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', -190, 200, 190, null], + ], + type: 'bar', + labels: { + format: function (v) { + if (v === null) { + return 'Not Applicable'; + } + return d3.format('$')(v); } - return d3.format('$')(v); } } - } - }; - expect(true).toBeTruthy(); - }); + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-243, -1); - expect(domain[1]).toBeCloseTo(253, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-243, -1); + expect(domain[1]).toBeCloseTo(253, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [392, 43, 52, 215], - expectedXs = [74, 221, 368, 515]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [392, 43, 52, 215], + expectedXs = [74, 221, 368, 515]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-243, -1); - expect(domain[1]).toBeCloseTo(253, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-243, -1); + expect(domain[1]).toBeCloseTo(253, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [392, 40, 49, 212], - expectedXs = [6, 198, 391, 583]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [392, 40, 49, 212], + expectedXs = [6, 198, 391, 583]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); }); describe('on rotated axis', function () { - it('should update args', function () { - args.data.type = 'bar'; - args.axis = { - rotated: true - }; - expect(true).toBeTruthy(); - }); + describe('data type bar', function () { + beforeAll(function(){ + args.data.type = 'bar'; + args.axis = { + rotated: true + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-254, -1); - expect(domain[1]).toBeCloseTo(260, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-254, -1); + expect(domain[1]).toBeCloseTo(260, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [57, 163, 269, 375], - expectedXs = [69, 525, 513, 295]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [57, 163, 269, 375], + expectedXs = [69, 525, 513, 295]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-254, -1); - expect(domain[1]).toBeCloseTo(260, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-254, -1); + expect(domain[1]).toBeCloseTo(260, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [9, 147, 286, 424], - expectedXs = [67, 527, 515, 297]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [9, 147, 286, 424], + expectedXs = [67, 527, 515, 297]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); }); @@ -1081,109 +1081,112 @@ describe('c3 chart data', function () { describe('on non rotated axis', function () { - it('should update args', function () { - args = { - data: { - columns: [ - ['data1', 30, 200, 100, 500], - ['data2', 50, 20, 10, 40], - ['data3', 250, 220, 210, 240], - ], - groups: [['data1', 'data2', 'data3']], - labels: true, - type: 'bar', - } - }; - expect(true).toBeTruthy(); - }); + describe('data type bar', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 30, 200, 100, 500], + ['data2', 50, 20, 10, 40], + ['data3', 250, 220, 210, 240], + ], + groups: [['data1', 'data2', 'data3']], + labels: true, + type: 'bar', + } + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(0, -1); - expect(domain[1]).toBeCloseTo(885, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(0, -1); + expect(domain[1]).toBeCloseTo(885, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [385, 317, 370, 164], - expectedXs = [74, 221, 368, 515]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [385, 317, 370, 164], + expectedXs = [74, 221, 368, 515]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-94, -1); - expect(domain[1]).toBeCloseTo(884, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-94, -1); + expect(domain[1]).toBeCloseTo(884, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [344, 284, 331, 144], - expectedXs = [6, 198, 391, 583]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [344, 284, 331, 144], + expectedXs = [6, 198, 391, 583]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - }); describe('on rotated axis', function () { - it('should update args', function () { - args.data.type = 'bar'; - args.axis = { - rotated: true - }; - expect(true).toBeTruthy(); - }); + describe('data type bar', function () { + beforeAll(function(){ + args.data.type = 'bar'; + args.axis = { + rotated: true + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(0, -1); - expect(domain[1]).toBeCloseTo(888, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(0, -1); + expect(domain[1]).toBeCloseTo(888, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [57, 163, 269, 375], - expectedXs = [57, 150, 77, 363]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [57, 163, 269, 375], + expectedXs = [57, 150, 77, 363]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-87, -1); - expect(domain[1]).toBeCloseTo(887, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-87, -1); + expect(domain[1]).toBeCloseTo(887, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [9, 147, 286, 424], - expectedXs = [107, 192, 125, 386]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [9, 147, 286, 424], + expectedXs = [107, 192, 125, 386]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); }); @@ -1194,109 +1197,112 @@ describe('c3 chart data', function () { describe('on non rotated axis', function () { - it('should update args', function () { - args = { - data: { - columns: [ - ['data1', -30, -200, -100, -500], - ['data2', -50, -20, -10, -40], - ['data3', -250, -220, -210, -240] - ], - groups: [['data1', 'data2', 'data3']], - labels: true, - type: 'bar', - } - }; - expect(true).toBeTruthy(); - }); + describe('data type bar', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', -30, -200, -100, -500], + ['data2', -50, -20, -10, -40], + ['data3', -250, -220, -210, -240] + ], + groups: [['data1', 'data2', 'data3']], + labels: true, + type: 'bar', + } + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-885, -1); - expect(domain[1]).toBeCloseTo(0, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-885, -1); + expect(domain[1]).toBeCloseTo(0, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [51, 118, 65, 272], - expectedXs = [74, 221, 368, 515]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [51, 118, 65, 272], + expectedXs = [74, 221, 368, 515]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-884, -1); - expect(domain[1]).toBeCloseTo(94, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-884, -1); + expect(domain[1]).toBeCloseTo(94, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [88, 149, 101, 288], - expectedXs = [6, 198, 391, 583]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [88, 149, 101, 288], + expectedXs = [6, 198, 391, 583]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - }); describe('on rotated axis', function () { - it('should update args', function () { - args.data.type = 'bar'; - args.axis = { - rotated: true - }; - expect(true).toBeTruthy(); - }); + describe('data type bar', function () { + beforeAll(function(){ + args.data.type = 'bar'; + args.axis = { + rotated: true + }; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-894, -1); - expect(domain[1]).toBeCloseTo(0, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-894, -1); + expect(domain[1]).toBeCloseTo(0, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [57, 163, 269, 375], - expectedXs = [533, 440, 513, 230]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [57, 163, 269, 375], + expectedXs = [533, 440, 513, 230]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); - it('should update args', function () { - args.data.type = 'line'; - expect(true).toBeTruthy(); - }); + describe('data type line', function () { + beforeAll(function(){ + args.data.type = 'line'; + }); - it('should have y domain with proper padding', function () { - var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-894, -1); - expect(domain[1]).toBeCloseTo(94, -1); - }); + it('should have y domain with proper padding', function () { + var domain = chart.internal.y.domain(); + expect(domain[0]).toBeCloseTo(-894, -1); + expect(domain[1]).toBeCloseTo(94, -1); + }); - it('should locate labels above each data point', function () { - var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), - expectedYs = [9, 147, 286, 424], - expectedXs = [480, 397, 462, 205]; - texts.each(function (d, i) { - var text = d3.select(this); - expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); - expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + it('should locate labels above each data point', function () { + var texts = chart.internal.main.selectAll('.c3-texts-data1 text'), + expectedYs = [9, 147, 286, 424], + expectedXs = [480, 397, 462, 205]; + texts.each(function (d, i) { + var text = d3.select(this); + expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -2); + expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -2); + }); }); }); }); diff --git a/spec/domain-spec.js b/spec/domain-spec.js index 936e206..b90508b 100644 --- a/spec/domain-spec.js +++ b/spec/domain-spec.js @@ -22,112 +22,114 @@ describe('c3 chart domain', function () { describe('axis.y.min', function () { - it('should change axis.y.min to -100', function () { - args.axis.y.min = -100; - expect(true).toBeTruthy(); + describe('should change axis.y.min to -100', function () { + beforeAll(function(){ + 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 () { - 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(); - }); + describe('should change axis.y.min to 500', function () { + beforeAll(function(){ + args.axis.y.min = 500; + }); - 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 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 () { + afterAll(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(); + describe('should change axis.y.max to 1000', function () { + beforeAll(function(){ + args.axis.y.max = 1000; + }); + + 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 () { - 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(); - }); + describe('should change axis.y.max to 0', function () { + beforeAll(function(){ + args.axis.y.max = 0; + }); - 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); + 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, + describe('should change axis.y.max to 1000', function () { + beforeAll(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 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 + describe('should change axis.y.max to 1000 with top/bottom padding', function () { + beforeAll(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); + }); }); - - 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); - }); - }); - }); diff --git a/spec/grid-spec.js b/spec/grid-spec.js index b5ef4c9..9f0422d 100644 --- a/spec/grid-spec.js +++ b/spec/grid-spec.js @@ -9,7 +9,7 @@ describe('c3 chart grid', function () { describe('y grid show', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -28,51 +28,53 @@ describe('c3 chart grid', function () { } } }; - 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); - }); + describe('with y grids', function () { + beforeAll(function(){ + args.grid.y.show = true; + }); - it('should update args to show only 3 y grids', function () { - args.grid.y.ticks = 3; - 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 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); - }); + describe('with only 3 y grids', function () { + beforeAll(function(){ + args.grid.y.ticks = 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 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 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'); + describe('with y grids depending on y axis ticks', function () { + beforeAll(function(){ + args.axis.y.tick.count = 5; }); - 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]); + + 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]); + }); }); }); }); @@ -81,7 +83,7 @@ describe('c3 chart grid', function () { describe('position', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -98,7 +100,6 @@ describe('c3 chart grid', function () { } } }; - expect(true).toBeTruthy(); }); it('should show 3 grid lines', function () { @@ -127,55 +128,55 @@ describe('c3 chart grid', function () { }); }); - 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'} + describe('three gridlines', function () { + beforeAll(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 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 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]); + 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]); + }); }); }); - }); }); @@ -183,7 +184,7 @@ describe('c3 chart grid', function () { describe('position', function () { - it('should have correct height', function () { + beforeAll(function () { // 'should have correct height', args = { data: { columns: [ @@ -200,7 +201,6 @@ describe('c3 chart grid', function () { } }, }; - expect(true).toBeTruthy(); }); it('should show 3 grid lines', function () { @@ -229,98 +229,98 @@ describe('c3 chart grid', function () { }); }); - 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'}, + describe('three grid lines', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 30, 200, 100, 400], ] - } - }, - }; - expect(true).toBeTruthy(); - }); + }, + 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'}, + ] + } + }, + }; + }); - it('should show 3 grid lines', function () { - expect(chart.internal.main.selectAll('.c3-xgrid-lines .c3-xgrid-line').size()).toBe(3); - }); + 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 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]); + 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'} + describe('should have correct height', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 30, 200, 100, 400], ] + }, + grid: { + x: { + lines: [ + {value: 3, text: 'Label 3'} + ] + } + }, + padding: { + top: 50 } - }, - 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]); + 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 () { + beforeAll(function () { args = { data: { x: 'x', @@ -343,7 +343,6 @@ describe('c3 chart grid', function () { } } }; - expect(true).toBeTruthy(); }); it('should show x grid lines', function () { diff --git a/spec/interaction-spec.js b/spec/interaction-spec.js index 4e62070..aec686a 100644 --- a/spec/interaction-spec.js +++ b/spec/interaction-spec.js @@ -11,7 +11,7 @@ describe('c3 chart interaction', function () { describe('custom x', function () { - it('should generate bar chart', function () { + beforeAll(function () { args = { data: { x: 'x', @@ -22,7 +22,6 @@ describe('c3 chart interaction', function () { type: 'bar' } }; - expect(true).toBeTruthy(); }); 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 () { - args = { - data: { - x: 'x', - columns: [ - ['x', 0], - ['data', 10] - ], - type: 'bar' - } - }; - expect(true).toBeTruthy(); - }); + describe('should generate bar chart with only one data', function () { + beforeAll(function(){ + args = { + data: { + x: 'x', + columns: [ + ['x', 0], + ['data', 10] + ], + type: 'bar' + } + }; + }); - 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); + 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 () { + beforeAll(function () { args = { data: { x: 'x', @@ -72,7 +71,6 @@ describe('c3 chart interaction', function () { ] } }; - expect(true).toBeTruthy(); }); 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 () { - args = { - data: { - x: 'x', - columns: [ - ['x', '20140101'], - ['data', 10] - ] - } - }; - expect(true).toBeTruthy(); - }); + describe('should generate line chart with only 1 data timeseries', function () { + beforeAll(function(){ + args = { + data: { + x: 'x', + columns: [ + ['x', '20140101'], + ['data', 10] + ] + } + }; + }); - 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); + 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); + }); }); }); - }); - }); - }); diff --git a/spec/legend-spec.js b/spec/legend-spec.js index 7fb9878..c56df89 100644 --- a/spec/legend-spec.js +++ b/spec/legend-spec.js @@ -9,7 +9,7 @@ describe('c3 chart legend', function () { describe('legend when multiple charts rendered', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -19,36 +19,36 @@ describe('c3 chart legend', function () { ] } }; - 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(); - }); + describe('long data names', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['long data name 1', 30], + ['long data name 2', 50], + ['long data name 3', 50], + ] + } + }; + }); - 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); + 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -57,7 +57,6 @@ describe('c3 chart legend', function () { ] } }; - expect(true).toBeTruthy(); }); it('should be located on the center of chart', function () { @@ -69,80 +68,83 @@ describe('c3 chart legend', function () { 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 + describe('should change the legend to "inset" successfully', function () { + beforeAll(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 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 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(); - }); + describe('should change the legend step to 1 successfully', function () { + beforeAll(function(){ + args.legend.inset.step = 1; + }); - it('should have automatically calculated height', function () { - var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); - expect(box.height).toBe(28); + 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(); - }); + describe('should change the legend step to 2 successfully', function () { + beforeAll(function(){ + args.legend.inset.step = 2; + }); - it('should have automatically calculated height', function () { - var box = d3.select('.c3-legend-background').node().getBoundingClientRect(); - expect(box.height).toBe(48); + 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(); - }); + describe('with only one series', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 30, 200, 100, 400, 150, 250], + ] + }, + legend: { + position: 'inset' + } + }; + }); - 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); + 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -154,7 +156,6 @@ describe('c3 chart legend', function () { hide: true } }; - expect(true).toBeTruthy(); }); it('should not show legends', function () { @@ -163,31 +164,32 @@ describe('c3 chart legend', 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: 'data2' - } - }; - expect(true).toBeTruthy(); - }); + describe('hidden legend', function () { + beforeAll(function(){ + args = { + data: { + columns: [ + ['data1', 30, 200, 100, 400, 150, 250], + ['data2', 130, 100, 200, 100, 250, 150] + ] + }, + legend: { + hide: 'data2' + } + }; + }); - 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'); + 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -199,7 +201,6 @@ describe('c3 chart legend', function () { show: false } }; - expect(true).toBeTruthy(); }); it('should not initially have rendered any legend items', function () { @@ -218,7 +219,7 @@ describe('c3 chart legend', function () { }); describe('custom legend size', function() { - it('should update args', function () { + beforeAll(function () { args = { data: { 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 () { 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'); + 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 () { + beforeAll(function () { args = { data: { columns: [ @@ -260,14 +260,13 @@ describe('c3 chart legend', function () { 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 + tileWidth = 15, // default value is 10, plus 5 more for padding expectedWidth = textBoxWidth + tileWidth + (index ? 0 : 10) + args.legend.padding; expect(itemWidth).toBe(expectedWidth); diff --git a/spec/shape.bar-spec.js b/spec/shape.bar-spec.js index fe94f10..838625c 100644 --- a/spec/shape.bar-spec.js +++ b/spec/shape.bar-spec.js @@ -12,7 +12,7 @@ describe('c3 chart shape bar', function () { describe('with groups', function () { describe('with indexed data', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -25,7 +25,6 @@ describe('c3 chart shape bar', function () { type: 'bar' }, }; - expect(true).toBeTruthy(); }); it('should be stacked', function () { var expectedBottom = [275, 293, 365, 281, 395, 290]; @@ -37,7 +36,7 @@ describe('c3 chart shape bar', function () { }); describe('with timeseries data', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { x: 'date', @@ -57,7 +56,6 @@ describe('c3 chart shape bar', function () { } } }; - expect(true).toBeTruthy(); }); it('should be stacked', function () { var expectedBottom = [275, 293, 365, 281, 395, 290]; @@ -69,7 +67,7 @@ describe('c3 chart shape bar', function () { }); describe('with category data', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { x: 'date', @@ -89,8 +87,8 @@ describe('c3 chart shape bar', function () { } } }; - 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) { @@ -106,7 +104,7 @@ describe('c3 chart shape bar', function () { describe('with normal axis', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -120,7 +118,6 @@ describe('c3 chart shape bar', function () { rotated: false } }; - expect(true).toBeTruthy(); }); it('should not be within bar', function () { @@ -151,9 +148,8 @@ describe('c3 chart shape bar', function () { describe('with rotated axis', function () { - it('should change the chart as axis rotated', function () { + beforeAll(function () { args.axis.rotated = true; - expect(true).toBeTruthy(); }); it('should not be within bar', function () { diff --git a/spec/shape.line-spec.js b/spec/shape.line-spec.js index c38ff3f..072210f 100644 --- a/spec/shape.line-spec.js +++ b/spec/shape.line-spec.js @@ -11,7 +11,7 @@ describe('c3 chart shape line', function () { describe('shape-rendering for line chart', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -22,8 +22,6 @@ describe('c3 chart shape line', function () { type: 'line' } }; - expect(true).toBeTruthy(); - }); 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 () { - args.data.type = 'step'; - expect(true).toBeTruthy(); - }); + describe('should change to step chart', function () { + beforeAll(function(){ + args.data.type = 'step'; + }); - 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 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(); - }); + describe('should change to spline chart', function () { + beforeAll(function(){ + args.data.type = 'spline'; + }); - it('should use cardinal interpolation by default', function () { - expect(chart.internal.config.spline_interpolation_type).toBe('cardinal'); + 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(); - }); + describe('should change args to include null data', function () { + beforeAll(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' + } + }; + }); - 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 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 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); - // }); + // 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 () { + beforeAll(function () { args = { data: { 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'); }); - it('should not use a non-valid interpolation', function () { - args.spline.interpolation.type = 'foo'; - expect(true).toBeTruthy(); - }); + describe('should not use a non-valid interpolation', function () { + beforeAll(function(){ + args.spline.interpolation.type = 'foo'; + }); - it('should use cardinal interpolation when given option is not valid', function() { - expect(chart.internal.getInterpolate(chart.data()[0])).toBe('cardinal'); + it('should use cardinal interpolation when given option is not valid', function() { + expect(chart.internal.getInterpolate(chart.data()[0])).toBe('cardinal'); + }); }); - }); }); diff --git a/spec/tooltip-spec.js b/spec/tooltip-spec.js index 15f2772..c6e25b6 100644 --- a/spec/tooltip-spec.js +++ b/spec/tooltip-spec.js @@ -45,9 +45,8 @@ describe('c3 chart tooltip', function () { describe('with left margin', function () { - it('should set left margin', function () { + beforeAll(function () { d3.select('#chart').style('margin-left', '300px'); - expect(true).toBeTruthy(); }); it('should show tooltip on proper position', function () { diff --git a/spec/type-spec.js b/spec/type-spec.js index 9210d50..cd5acd2 100644 --- a/spec/type-spec.js +++ b/spec/type-spec.js @@ -11,7 +11,7 @@ describe('c3 chart types', function () { describe('with data', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -22,47 +22,47 @@ describe('c3 chart types', function () { 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(); - }); + describe('should change chart type to "bar"', function () { + beforeAll(function(){ + args.data.type = 'bar'; + }); - it('should return false', function () { - expect(chart.internal.hasArcType()).toBeFalsy(); + it('should return false', function () { + expect(chart.internal.hasArcType()).toBeFalsy(); + }); }); }); describe('with empty data', function () { - it('should update args to have empty data', function () { + beforeAll(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(); - }); + describe('should change chart type to "bar"', function () { + beforeAll(function(){ + args.data.type = 'bar'; + }); - it('should return false', function () { - expect(chart.internal.hasArcType()).toBeFalsy(); + it('should return false', function () { + expect(chart.internal.hasArcType()).toBeFalsy(); + }); }); }); @@ -71,7 +71,7 @@ describe('c3 chart types', function () { describe('internal.hasType', function () { - it('should update args', function () { + beforeAll(function () { args = { data: { columns: [ @@ -82,7 +82,6 @@ describe('c3 chart types', function () { type: 'pie' } }; - expect(true).toBeTruthy(); }); it('should return true for "pie" type', function () { @@ -97,41 +96,42 @@ describe('c3 chart types', function () { expect(chart.internal.hasType('bar')).toBeFalsy(); }); - it('should unload successfully', function () { - chart.unload([]); - expect(true).toBeTruthy(); - }); + describe('should unload successfully', function () { + beforeAll(function(){ + chart.unload([]); + }); - it('should return true for "pie" type even if no data', function () { - expect(chart.internal.hasType('pie')).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 "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 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(); - }); + describe('should change chart type to "bar" successfully', function () { + beforeAll(function(){ + args.data.type = 'bar'; + }); - it('should return false for "pie" type even if no data', function () { - expect(chart.internal.hasType('pie')).toBeFalsy(); - }); + 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 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(); + it('should return true for "bar" type even if no data', function () { + expect(chart.internal.hasType('bar')).toBeTruthy(); + }); + }); }); - }); });