diff --git a/Gruntfile.coffee b/Gruntfile.coffee index 5591182..f6dc622 100644 --- a/Gruntfile.coffee +++ b/Gruntfile.coffee @@ -83,6 +83,7 @@ module.exports = (grunt) -> c3: 'c3.js' spec: 'spec/*.js' options: + reporter: require('jshint-stylish') jshintrc: '.jshintrc' karma: diff --git a/package.json b/package.json index 32c2cb8..a494518 100644 --- a/package.json +++ b/package.json @@ -29,12 +29,13 @@ "grunt": "^0.4.5", "grunt-contrib-concat": "~0.5.0", "grunt-contrib-cssmin": "^0.10.0", - "grunt-contrib-jshint": "~0.10.0", + "grunt-contrib-jshint": "^1.0.0", "grunt-contrib-uglify": "~0.4.0", "grunt-contrib-watch": "^0.6.1", "grunt-karma": "^0.12.1", "grunt-sass": "^1.0.0", "jasmine-core": "^2.3.4", + "jshint-stylish": "^2.1.0", "karma": "^0.13.10", "karma-coverage": "^0.5.2", "karma-jasmine": "^0.3.6", diff --git a/spec/api.data-spec.js b/spec/api.data-spec.js index 56f5fef..777b3cf 100644 --- a/spec/api.data-spec.js +++ b/spec/api.data-spec.js @@ -30,6 +30,7 @@ describe('c3 api data', function () { }; beforeEach(function (done) { + jasmine.addMatchers(customMatchers); chart = window.initChart(chart, args, done); }); @@ -116,8 +117,8 @@ describe('c3 api data', function () { it('should return data.colors specified as argument', function () { var results = chart.data.colors(); - expect(results.data1).toBe('#FF0000'); - expect(results.data2).toBe('#00FF00'); + expect(results.data1).toBeHexOrRGB('#FF0000'); + expect(results.data2).toBeHexOrRGB('#00FF00'); }); it('should return data.colors specified as api', function () { @@ -125,15 +126,15 @@ describe('c3 api data', function () { data1: '#00FF00', data2: '#FF0000' }); - expect(results.data1).toBe('#00FF00'); - expect(results.data2).toBe('#FF0000'); + expect(results.data1).toBeHexOrRGB('#00FF00'); + expect(results.data2).toBeHexOrRGB('#FF0000'); }); it('should set data.colors specified as api', function () { - expect(d3.select('.c3-line-data1').style('stroke')).toBe("#00ff00"); - expect(d3.select('.c3-line-data2').style('stroke')).toBe("#ff0000"); - expect(d3.select('.c3-legend-item-data1 .c3-legend-item-tile').style('stroke')).toBe("#00ff00"); - expect(d3.select('.c3-legend-item-data2 .c3-legend-item-tile').style('stroke')).toBe("#ff0000"); + expect(d3.select('.c3-line-data1').style('stroke')).toBeHexOrRGB("#00ff00"); + expect(d3.select('.c3-line-data2').style('stroke')).toBeHexOrRGB("#ff0000"); + expect(d3.select('.c3-legend-item-data1 .c3-legend-item-tile').style('stroke')).toBeHexOrRGB("#00ff00"); + expect(d3.select('.c3-legend-item-data2 .c3-legend-item-tile').style('stroke')).toBeHexOrRGB("#ff0000"); }); }); @@ -162,3 +163,39 @@ describe('c3 api data', function () { }); }); + +var customMatchers = { + toBeHexOrRGB: function(util, customEqualityTesters) { + 'use strict'; + function rgb2hex(rgb){ + rgb = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i); + return (rgb && rgb.length === 4) ? "#" + + ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) + + ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) + + ("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : ''; + } + + + return { + compare: function(actual, expected){ + if (expected === undefined) { + expected = ''; + } + + var result = {}; + actual = actual.match('rgb') ? rgb2hex(actual) : actual; + expected = expected.match('rgb') ? rgb2hex(expected) : expected; + + result.pass = util.equals(actual, expected, customEqualityTesters); + if (result.pass) { + result.message = "Expected " + actual + " not to be quite so goofy"; + } else { + result.message = "Expected " + actual + " to be goofy, but it was not very goofy"; + + } + + return result; + } + }; + } +}; diff --git a/spec/arc-spec.js b/spec/arc-spec.js index b828368..527eb26 100644 --- a/spec/arc-spec.js +++ b/spec/arc-spec.js @@ -122,7 +122,7 @@ describe('c3 chart arc', function () { .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.7229262694079536e-14A304,304 0 0,1 245.94116628998404,-178.68671669691184L237.85099634623455,-172.8088641739871A294,294 0 0,0 -294,-3.6004615894932184e-14Z'); + expect(data.attr('d')).toMatch('M-304,-3.7229262694079536e-14A304,304 0 0,1 245.94116628998404,-178.68671669691184L237.85099634623455,-172.8088641739871A294,294 0 0,0 -294,-3.6004615894932184e-14Z'); //jshint ignore:line }); it('should update args to have a 2 Pi radian gauge that starts at Pi/2', function() { @@ -151,7 +151,7 @@ describe('c3 chart arc', function () { .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.7229262694079536e-14A304,304 0 0,1 245.94116628998404,-178.68671669691184L237.85099634623455,-172.8088641739871A294,294 0 0,0 -294,-3.6004615894932184e-14Z'); + expect(data.attr('d')).toMatch('M-304,-3.7229262694079536e-14A304,304 0 0,1 245.94116628998404,-178.68671669691184L237.85099634623455,-172.8088641739871A294,294 0 0,0 -294,-3.6004615894932184e-14Z'); //jshint ignore:line }); }); diff --git a/spec/shape.line-spec.js b/spec/shape.line-spec.js index a3021ef..c38ff3f 100644 --- a/spec/shape.line-spec.js +++ b/spec/shape.line-spec.js @@ -1,14 +1,14 @@ describe('c3 chart shape line', function () { 'use strict'; - - var chart, args; beforeEach(function (done) { chart = window.initChart(chart, args, done); }); + var parseSvgPath = window.parseSvgPath; + describe('shape-rendering for line chart', function () { it('should update args', function () { @@ -49,7 +49,7 @@ describe('c3 chart shape line', function () { 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'); + var style = d3.select(this).style('shape-rendering').toLowerCase(); expect(style).toBe('crispedges'); }); }); @@ -97,7 +97,7 @@ describe('c3 chart shape line', function () { 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; + (commands[i].command === 'L') ? segments++ : null; } expect(segments).toBe(3); done(); diff --git a/spec/svg-helper.js b/spec/svg-helper.js index 2033637..c1f2b49 100644 --- a/spec/svg-helper.js +++ b/spec/svg-helper.js @@ -1,10 +1,12 @@ - /** * Parse the d property of an SVG path into an array of drawing commands. * @param {String} d SvgPath d attribute.] * @return {Array} an array of drawing commands. */ -function parseSvgPath(d) { + +function parseSvgPath(d) { //jshint ignore:line + 'use strict'; + var commands = []; var commandTokens = ['M','L','I','H','V','C','S','Q','T','A']; var command; @@ -12,7 +14,7 @@ function parseSvgPath(d) { var in_y = false; var x = ''; var y = ''; - for(var i=0; i <= d.length; i++) { + for(var i = 0; i <= d.length; i++) { if (commandTokens.indexOf(d[i]) !== -1) { if (in_x || in_y) { commands.push({command: command, x: x, y: y}); @@ -24,7 +26,7 @@ function parseSvgPath(d) { in_y = false; } else { - if (d[i] == ',') { + if (d[i] === ',') { if (in_y) { commands.push({command: command, x: x, y: y}); x = ''; @@ -41,8 +43,8 @@ function parseSvgPath(d) { } } } - if (d[i] != ',' && in_y) { + if (d[i] !== ',' && in_y) { commands.push({command: command, x: x, y: y}); } return commands; -} \ No newline at end of file +}