Javascript CI篇（3）- Karma + Jasmine + istanbul 集成

karma 和 jasmine 基础

请查看Jasmine基础学习和Karma基础学习

安装

//karma
npm install karma --save-dev

//jasmine
npm install karma-jasmine karma-chrome-launcher jasmine-core --save-dev

//istanbul
npm install karma-coverage
npm install karma-jasmine-html-reporter --save-dev

增加 npm 脚本

karma采用本地安装模式，所以运行karma是在node_module/.bin/karma.cmd，运行起来麻烦，直接package.json中加载脚本方便运行

    "karma-start": ".\\node_modules\\.bin\\karma.cmd start",
    "karma-init": ".\\node_modules\\.bin\\karma.cmd init"

配置karma.conf.js

先运行karma init完成初始化配置，karma默认用的测试框架就是jasmine。

//npm 脚本
npm run karma-init

修改配置文件

    //这里要注意，预处理的文件是源码，而不是测试文件，因为我们要查源码的测试覆盖率
    preprocessors: {
      'src/**/*.js':'coverage'
    },
    //istanbul的配置
    coverageReporter: {
        type : 'html',
        dir : 'coverage1/'
    },
    
    https://npmjs.org/browse/keyword/karma-reporter
    //'coverage','kjhtml' 这两个覆盖率报告
    reporters: ['progress','coverage','kjhtml'],

运行

npm run karma-start

运行后直接在网页中点debug可以看测试情况。如果你看覆盖率需要到项目目录找到coverage1对应浏览器Chrome地下的index.html文件。