diff --git a/karma.conf.js b/karma.conf.js index 5fc3b04..6593f63 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -1,77 +1,27 @@ -// Karma configuration -// Generated on Wed Sep 30 2015 22:01:48 GMT+0900 (KST) +const path = require('path'); module.exports = function(config) { config.set({ - - // base path that will be used to resolve all patterns (eg. files, exclude) - basePath: '', - - - // frameworks to use - // available frameworks: https://npmjs.org/browse/keyword/karma-adapter - frameworks: ['jasmine'], - - - // list of files / patterns to load in the browser + frameworks: ['jasmine', 'browserify'], files: [ - 'node_modules/d3/d3.min.js', - 'c3.js', 'c3.css', 'spec/*-helper.js', 'spec/*-spec.js' ], - - - // list of files to exclude - exclude: [ - ], - - - // preprocess matching files before serving them to the browser - // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor preprocessors: { - 'c3.js': ['coverage'] + 'spec/c3-helper.js': ['browserify'] }, - - - // test results reporter to use - // possible values: 'dots', 'progress' - // available reporters: https://npmjs.org/browse/keyword/karma-reporter - reporters: ['spec', 'coverage'], - - - coverageReporter: { - reporters: [{type: 'lcov'}] + browserify: { + debug: true, + transform: [['babelify', { presets: ['es2015'], plugins: ['istanbul'] }]] + }, + reporters: ['spec', 'coverage-istanbul'], + coverageIstanbulReporter: { + reports: ['html', 'lcovonly', 'text-summary'] }, - - - // web server port - port: 9876, - - - // enable / disable colors in the output (reporters and logs) - colors: true, - - - // level of logging - // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG - logLevel: config.LOG_INFO, - - - // enable / disable watching file and executing tests whenever any file changes autoWatch: true, - - - // start these browsers - // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher browsers: ['PhantomJS'], - - - // Continuous Integration mode - // if true, Karma captures browsers, runs the tests and exits singleRun: true, - browserNoActivityTimeout: 120000, }) -} +}; diff --git a/package.json b/package.json index c481638..55db588 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "build:css:min": "cleancss -o c3.min.css c3.css", "test": "npm run build && npm run lint && karma start karma.conf.js", "dist": "npm run build", - "codecov": "cat coverage/*/lcov.info | codecov" + "codecov": "codecov" }, "repository": { "type": "git", @@ -27,7 +27,11 @@ "chart", "graph" ], - "author": "Masayuki Tanaka", + "authors": [ + "Masayuki Tanaka", + "Ændrew Rininsland", + "Yoshiya Hinosawa" + ], "license": "MIT", "gitHead": "84e03109d9a590f9c8ef687c03d751f666080c6f", "readmeFilename": "README.md", @@ -35,20 +39,31 @@ "d3": "~3.5.0" }, "devDependencies": { + "babel-plugin-istanbul": "^4.1.4", + "babel-preset-es2015": "^6.24.1", + "babelify": "^7.3.0", + "browserify": "^14.4.0", "clean-css-cli": "^4.1.3", - "codecov.io": "^0.1.6", + "codecov": "^2.2.0", "jasmine-core": "^2.3.4", "jshint": "^2.9.4", "jshint-stylish": "^2.1.0", - "karma": "^0.13.10", - "karma-coverage": "^0.5.2", - "karma-jasmine": "^0.3.6", - "karma-phantomjs-launcher": "^0.2.1", - "karma-spec-reporter": "0.0.20", + "karma": "^1.7.0", + "karma-browserify": "^5.1.1", + "karma-coverage-istanbul-reporter": "^1.3.0", + "karma-jasmine": "^1.1.0", + "karma-phantomjs-launcher": "^1.0.4", + "karma-spec-reporter": "0.0.31", "node-sass": "^4.5.3", "node-static": "^0.7.9", - "phantomjs": "^1.9.18", + "phantomjs": "^2.1.7", "rollup": "^0.41.6", - "uglify-js": "^3.0.15" + "uglify-js": "^3.0.15", + "watchify": "^3.9.0" + }, + "nyc": { + "exclude": [ + "src/polyfill.js" + ] } } diff --git a/spec/axis-spec.js b/spec/axis-spec.js index 6cfc038..dc431a8 100644 --- a/spec/axis-spec.js +++ b/spec/axis-spec.js @@ -587,7 +587,7 @@ describe('c3 chart axis', function () { var box = chart.internal.main.select('.c3-axis-x').node().getBoundingClientRect(), height = chart.internal.getHorizontalAxisHeight('x'); expect(box.height).toBeGreaterThan(50); - expect(height).toBeCloseTo(70, -1); + expect(height).toBeCloseTo(76, -1); // @TODO make this test better }); }); diff --git a/spec/c3-helper.js b/spec/c3-helper.js index 970cd1b..452e7a3 100644 --- a/spec/c3-helper.js +++ b/spec/c3-helper.js @@ -1,4 +1,8 @@ -function initDom() { +import c3 from '../src'; + +window.c3 = c3; + +window.initDom = function () { 'use strict'; var div = document.createElement('div'); @@ -7,10 +11,9 @@ function initDom() { div.style.height = '480px'; document.body.appendChild(div); document.body.style.margin = '0px'; -} -typeof initDom !== 'undefined'; +}; -function setMouseEvent(chart, name, x, y, element) { +window.setMouseEvent = function(chart, name, x, y, element) { 'use strict'; var paddingLeft = chart.internal.main.node().transform.baseVal.getItem(0).matrix.e, @@ -20,10 +23,9 @@ function setMouseEvent(chart, name, x, y, element) { false, false, false, false, 0, null); chart.internal.d3.event = event; if (element) { element.dispatchEvent(event); } -} -typeof setMouseEvent !== 'undefined'; +}; -function initChart(chart, args, done) { +window.initChart = function (chart, args, done) { 'use strict'; if (typeof chart === 'undefined') { @@ -43,5 +45,4 @@ function initChart(chart, args, done) { }, 10); return chart; -} -typeof initChart !== 'undefined'; +}; diff --git a/spec/data-spec.js b/spec/data-spec.js index 2fb4100..7379bde 100644 --- a/spec/data-spec.js +++ b/spec/data-spec.js @@ -1035,7 +1035,7 @@ describe('c3 chart data', function () { it('should have y domain with proper padding', function () { var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-254, -1); + expect(domain[0]).toBeCloseTo(-259, -1); expect(domain[1]).toBeCloseTo(260, -1); }); @@ -1058,7 +1058,7 @@ describe('c3 chart data', function () { it('should have y domain with proper padding', function () { var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-254, -1); + expect(domain[0]).toBeCloseTo(-259, -1); expect(domain[1]).toBeCloseTo(260, -1); }); @@ -1267,7 +1267,7 @@ describe('c3 chart data', function () { it('should have y domain with proper padding', function () { var domain = chart.internal.y.domain(); - expect(domain[0]).toBeCloseTo(-894, -1); + expect(domain[0]).toBeCloseTo(-899, -1); expect(domain[1]).toBeCloseTo(0, -1); }); @@ -1290,8 +1290,8 @@ describe('c3 chart data', function () { 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); + expect(domain[0]).toBeCloseTo(-899, -1); + expect(domain[1]).toBeCloseTo(101, -1); }); it('should locate labels above each data point', function () { diff --git a/spec/legend-spec.js b/spec/legend-spec.js index c56df89..1f7b869 100644 --- a/spec/legend-spec.js +++ b/spec/legend-spec.js @@ -61,7 +61,7 @@ describe('c3 chart legend', function () { it('should be located on the center of chart', function () { var box = chart.internal.legend.node().getBoundingClientRect(); - expect(box.left + box.right).toBe(640); + expect(box.left + box.right).toBe(638); }); }); @@ -266,7 +266,7 @@ describe('c3 chart legend', 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 = 17, // default value is 10, plus 7 more for padding @TODO verify this, seems PhantomJS@^2 adds another 1px to each side expectedWidth = textBoxWidth + tileWidth + (index ? 0 : 10) + args.legend.padding; expect(itemWidth).toBe(expectedWidth);