Ionic 单元测试
1 简介
Ionic 基于AngularJS ，所以可以使用angularJS 的单元测试工具来进行Ionic 的单元测试。
首先，我们先了解下这几个工具的用途，当然，在https://docs.angularjs.org/guide/unit-testing， 官方文档有详细的说明。
Karma：Karma是一个JS命令行工具，可以创建一个服务来运行你的代码和执行你的单元测试。通过配置Karma，可以在不同浏览器上执行。（这里意思是在浏览器上执行，但是测试结果是在命令行中显示），若是程序需要兼容不同的浏览器，都可以通过配置来测试。Karma 是一个NodeJS 程序，所以必须先安装npm 。
Jasmine :
它是最受欢迎的Angular测试框架，提供方法去帮助你构建你的测试和作出断言，随着测试程序的增加，Jasmine可以帮助你保持良好的结构和记录。
使用describe 方法构建测试程序。
describe('test my app',function(){
//单个测试程序
})
每个测试都写在it 方法内
describe('test my app', function() {
it('first test', function() {
// 测试断言
});});
最后，通过匹配toEqual 来作出断言。
describe('test my app', function() {
it('first test', function() {
var users = ['jack', 'igor', 'jeff'];
var sorted = sortUsers(users);
expect(sorted).toEqual(['jeff', 'jack', 'igor']);
});});
angular-mocks
Angular 提供了ngMock 模块，可以模拟你的测试。
2 安装工具
首先，我们先建立一个ionic 的工程并进入工程目录，执行命令。
ionic start ionicTest cd ionicTest
安装karma ,karma-jasmine, angular-mocks ,（注：--save-dev 自动添加模块和版本号）
npm install karma --save-dev npm install karma-jasmine --save-dev bower install angular-mocks --save-dev
创建测试文件
在工程目录下 新建文件夹 tests，并生成一个测试配置文件test.conf.js
md tests karma init test.conf.js
生成的test.conf.js中需要自己配置关联文件。 files[]中要加入js的文件路径。
// Karma configuration
// Generated on Tue Dec 22 2015 17:07:44 GMT+0800 (中国标准时间)
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
//此处需要自己配置，添加angular angular-mocks 自己的js代码路径，测试代码路径
files: [
'../www/lib/angular/angular.js',
'../www/js/*.js',
'../www/lib/angular-mocks/angular-mocks.js',
'**/*tests.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: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// 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: ['Chrome'],
//browsers: ['PhantomJS'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false,
// Concurrency level
// how many browser should be started simultanous
concurrency: Infinity
})
}
现在来编写测试代码，在tests文件下建立Controllers文件夹，创建一个controllers.test.js来测试controllers.js 的下面一段代码
.controller('AccountCtrl', function($scope) {
$scope.settings = {
enableFriends: true
};
});
测试代码controllers.test.js内容如下
describe('Controllers', function () {
var scope;
beforeEach(module('starter.controllers'));
beforeEach(inject(function ($rootScope,$controller) {
scope=$rootScope.$new();
$controller('AccountCtrl',{$scope:scope})
}));
it('should have enableed', function () {
expect(scope.settings.enableFriends).toEqual(true);
})
})
返回到test.conf.js文件所在的目录并执行命令
karma start test.conf.js
执行后chrome浏览器会自动启动。会在命令行中显示
Chrome ：Executed 1 of 1 SUCCESS <0 secs/0.025 second>
表示你的测试通过了。
若是更改controllers.test.js的测试程序，将
toEqual(true)改为toEqual(false)
执行命令后，则会显示
Chrome ：Executed 1 of 1 <1 FAILED> <0 secs/0.025 second>
表示你的测试不通过。
3总结
这里只是简单的一个ionic的单元测试，和AngularJS大同小异。官方文档还提供了其他方法的Jasmin的写法。