本文是基于基于Karma和Jasmine的AngularJS测试这篇译文的补充,因为我按照文档进行操作的时候遇到了文档中未提及的几个问题。
首先是nodejs的安装:
可以去nodejs下载界面下载,我用的是Windows Installer (.msi)(32位)的版本,安装步骤很简单,无脑点下一步就可以了。
接下来安装karma:
打开nodejs的命令行界面,执行命令:npm install -g karma
注意这个过程可能会花费比较长的时间,大约5到10分钟吧。
受限于我的工作环境,npm命令执行的下载操作无法完成,导致karma无法正常安装,但是我们可以通过在可以下载的环境中下载安装完成后把C:\Users\xxx\AppData\Roaming目录下的npm和npm-cache文件夹复制到工作环境相应的目录下来解决这个问题,这两个文件夹是npm下载的缓存文件夹。注意路径中的xxx是你当前的用户名。
对于想要通过缓存安装的同学要注意:在可以下载安装的环境中尽量做到安装完karma和jasmine后就把缓存文件夹复制出来,我用nodejs写过单元测试以后发现再把这两个缓存文件给别人就无法正常安装karma了。
安装成功后会有如下提示(如果是通过缓存安装的话会有一些warn告警,不用去管他):
安装完成后我们发现执行karma的任意命令都会有这样的提示(下图的命令是查看karma的版本):
安装了半天结果命令都无法识别,很恼火是吧,因为nodejs没有找到匹配的karma命令行入口。打开nodejs的安装目录,可以看到有一个npm.cmd文件:
把这个文件复制一份,重命名成karma.cmd,然后打开这个文件:
:: Created by npm, please don't edit manually.
@IF EXIST "%~dp0\node.exe" (
"%~dp0\node.exe" "%~dp0\.\node_modules\npm\bin\npm-cli.js" %*
) ELSE (
node "%~dp0\.\node_modules\npm\bin\npm-cli.js" %*
)
把里面的%~dp0\.\node_modules\npm\bin\npm-cli.js这一段换成C:\Users\xxx\AppData\Roaming\npm\node_modules\karma\bin\karma,注意有两个地方需要调整,修改完成后保存。
这个时候我们再检查一下karma的版本:
然后我们需要安装jasmine,执行命令:npm install -g jasmine
'use strict';
var app = angular.module('Application', ['ngResource']);
app.controller('MainCtrl', function($scope) {
$scope.text = 'Hello World!';
});
'use strict';
describe('MainCtrl', function(){
var scope; //we'll use these in our tests
//mock Application to allow us to inject our own dependencies
beforeEach(angular.mock.module('Application'));
//mock the controller for the same reason and include $rootScope and $controller
beforeEach(angular.mock.inject(function($rootScope, $controller){
//create an empty scope
scope = $rootScope.$new();
//declare the controller and inject our empty scope
$controller('MainCtrl', {$scope: scope});
}));
// tests start here
it('should have variable text = "Hello World!"', function(){
expect(scope.text).toBe('Hello World!');
});
});
// Karma configuration
// Generated on Wed Nov 26 2014 20:13:26 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
files: ['angular.js',
'angular-mocks.js',
'angular-resource.js',
'*.js'],
// list of files to exclude
exclude: ['karma.config.js'],
// 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: [],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
});
};