組件版本:
PhantomJS 2.1.1
Karma v1.7.0
Jasmine 2.6.0
單元測試（Jasmine + Karma）
Jasmine是一個主流的javascript端測試框架，類似于JUnit之類的框架压昼，支持的功能也類似求冷。Karma是一個Test Runner，可以讓測試代碼運行在瀏覽器沙盒里面用來測試其正確性窍霞。
下面是一個karma的配置文件中的部分內(nèi)容匠题，F(xiàn)iles是Karma中需要加載的內(nèi)容，類似于三方的依賴但金，代碼程序和測試程序韭山。Framework填Jasmine框架。Browsers包括主流瀏覽器和PhantomJS。
Phantomjs是一個編程用的瀏覽器钱磅，它沒有瀏覽器頁面巩踏，但是可以作為瀏覽器容器交互，很多爬蟲程序和測試程序依賴于Phantomjs.
Warning: Phantomjs Karma的launcher用的是2.1.1的版本续搀，這個版本的Phantomjs不支持es6語法塞琼，可能需要Babel編碼成es5才能使用。
files: [
'app/bower_components/jquery/dist/jquery.js',
'app/bower_components/jquery-ui/jquery-ui.js',
'app/bower_components/angular/angular.js',
'app/bower_components/angular-mocks/angular-mocks.js',
//...
'app/build-scripts/**/*.js',
'build-tests/spec/**/*.js'
],
frameworks: ['jasmine'],
browsers: ['Chrome', 'PhantomJS'],
這里給出單元測試的gulp例子禁舷。
gulp.task('test', ['es6'] , function (cb) {
return new Server({
configFile: __dirname + '/karma.conf.js',
singleRun: true
}, cb).start();
});
端到端測試
由于我們的項目是基于Angularjs的彪杉，在這里Protractor主要支持AngularJS中的端到端的測試.
這里需要打包一個seleniumServer, 給出相應(yīng)的jar包地址。
'use strict';
exports.config = {
seleniumServerJar: './node_modules/protractor/node_modules/webdriver-manager/selenium/selenium-server-standalone-3.4.0.jar',
framework: 'jasmine',
specs: ['build-tests/e2e/*-spec.js'],
capabilities: {
'browserName': 'chrome',
},
jasmineNodeOpts: {
showColors: true
},
};
由于默認的protractor需要手動執(zhí)行webdriver update的這樣的程序來下載selenium依賴牵咙，由于我們需要的gulp任務(wù)中下載派近，提供一個gulp的任務(wù)如下。另外洁桌，這里用gulp來同步執(zhí)行任務(wù)渴丸，當(dāng)所有測試執(zhí)行結(jié)束的時候自動關(guān)閉Web Server。
gulp.task('webdriver-update', function (cb) {
$.protractor.webdriver_update({
webdriverManagerArgs: ['--ignore_ssl']
}, cb);
});
gulp.task('webserver', ['es6'], function () {
$.connect.server({
root: 'app',
port: 8001
});
});
gulp.task('e2e:tests', ['webdriver-update', 'webserver'], function (cb) {
gulp.src([]).pipe($.protractor.protractor({
configFile: "protractor.conf.js",
})).on('error', function (e) {
throw e;
}).on('end', cb);
});
gulp.task('e2e', ['e2e:tests'], function (){
$.connect.serverClose();
});
小結(jié)
請訪問github地址來獲取完整的例子另凌。
