Karma和Jasmine自动化单元测试
单元测试是我们开发过程中必不可少的一部分。在本项目中,使用Jasmine来写单元测试,Karma跑单元测试,Grunt启动Karma任务。
Jasmine
Jasmine是一个Behavior-Driven的测试框架。说到Behavior-Driven,感觉这是在测试领域一个挺火的概念。BDD(Behavior-Driven Development)是根据使用实际的用户案例来驱动软件的开发。在这里不详细展开,具体的可以看:http://en.wikipedia.org/wiki/Behavior-driven_development。
Jasmine不依赖于任何其他JavaScript框架。它拥有灵巧而明确的语法,可以让你轻松地编写测试代码。当前的版本是2.2。一个典型的测试程序如下:
describe("A suite", function() {
it("contains spec with an expectation", function() {
expect(true).toBe(true);
});
});
Jasmine可以部署在浏览器端,把Jasmine和测试文件和要测试的JavaScript文件都放到一个HTML文件中。
Karma
Karma则可以帮助我们从命令行运行Jasmine测试。Karma是一个基于Node.js的JavaScript的Test Runner。之前我们讲到Jasmine时,里面讲到要跑case就要把所有JavaScript文件放到HTML中。而Karma的功能就是它会生成一个Web Server和浏览器实例来执行JavaScript文件(包括测试脚本和要测试的源代码)。这样我们就不要自己手动跑Jasmine了。Karma的配置项中有一个比较核心的配置项就是files,它是一个包括你需要加载的JavaScript文件的数组。这些文件会被加载到浏览器实例中。
准确地说,Karma并不是一个测试框架,也不是一个Assertion Library。Karma所做的只是启动一个HTTP server,并生成用来跑测试的HTML文件。Karma支持Jasmine、Mocha等的是框架,分别有对应的Plugin。
Karma需要一个配置文件,下面是一个例子(karma.conf.js):
module.exports = function(config){
config.set({
basePath : '../',
files : [
'app/bower_components/angular/angular.js',
'app/bower_components/angular-route/angular-route.js',
'app/bower_components/angular-mocks/angular-mocks.js',
'app/js/**/*.js',
'test/unit/**/*.js'
],
autoWatch : true,
frameworks: ['jasmine'],
browsers : ['Chrome'],
plugins : [
'karma-chrome-launcher',
'karma-firefox-launcher',
'karma-jasmine'
],
junitReporter : {
outputFile: 'test_out/unit.xml',
suite: 'unit'
}
});
};
用命令行启动测试:
karma start karma.conf.js
与Grunt集成
Grunt-karma是Grunt的一个插件,用于Grunt和Karma的集成。
下面是一个简单的Karma Task配置例子:
module.exports = function(grunt) {
var path = require('path');
grunt.loadNpmTasks('grunt-karma');
grunt.config('karma',{
options: {
basePath: '../',
// web server port
port: 9876,
// browserNoActivityTimeout: 100000,
client: {
captureConsole: !!grunt.option("with-logs")
},
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
browsers: ['PhantomJS'],
exclude: [],
files: [
'Angular-Grunt-Boilerplate/target/build/webapp/app.js',
'Angular-Grunt-Boilerplate/tests/spec/test.js',
],
plugins : [
'karma-jasmine',
'karma-phantomjs-launcher',
],
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
// requirejs issue, "Disconnected (1 times), because no message in 10000 ms",see below:
// http://stackoverflow.com/questions/23667102/disconnected-1-times-because-no-message-in-10000-ms-using-karma-jasmine
frameworks: ['jasmine'],
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
// html - https://github.com/matthias-schuetz/karma-htmlfile-reporter
reporters: ['progress'],
colors: true,
},
daemon: {
options: {
singleRun: false
}
},
run: {
options: {
singleRun: true
}
}
});
};
其中options里是一些公共的设置。
然后在Gruntfile.js中加入一句:
grunt.registerTask('test', ['karma:run']);
然后我们就可以通过
grunt test
来跑测试了。
Leave a Reply