什么是Karma？
mocha是一個js的測試框架，之前寫過的一篇博客介紹了如何用node.js的環境來運行測試。Karma是一個驅動測試的Runner。也就是說，karma為測試框架准備運行環境，可以讓這些測試在真正的瀏覽器里運行。
而且，karma運行測試的過程是自動化的。自動化並非理所當然的事。想起之前用Jasmine的時候，需要在一個html文件里引入各種js文件，然后用某個瀏覽器來打開這個html文件，使js在瀏覽器中運行起來。當測試內容發生變化時，需要刷新頁面，並時不時地清空緩存。。。有了karma，就省事多啦~而且不需要額外的配置，karma就會自己找到系統已經裝好的瀏覽器並啟動。
karma支持的測試框架還有Jasmine和Qunit。
環境搭建
假設已經搭建好了node.js平台。先全局安裝mocha和karma的命令行接口karma-cli，有可能需要sudo權限：
npm install -g mocha npm install -g karma-cli
要測試的文件目錄結構如圖：
先在demo-karma-mocha目錄下運行 npm install 安裝package.json里的依賴，package.json內容如下：
1 //package.json 2 { 3 "name": "karma-mocha-example", 4 "version": "0.0.0", 5 "description": "This is an example to show how to use karma with mocha", 6 "main": "index.js", 7 "dependencies": { 8 "karma": "~0.10.8" 9 }, 10 "devDependencies": { 11 "mocha": "~1.18.0", 12 "karma-mocha": "~0.1.3", 13 "should": "~2.1.1", 14 "karma-chrome-launcher": "~0.1.2", 15 "karma-firefox-launcher": "~0.1.3" 16 } 17 }
現在解析一下demo-karma-mocha這個目錄的結構。
node_modules是npm依據package.json下載的包，src是源文件目錄，test是測試文件目錄。
test-lib目錄下的should.js是mocha測試要用到的斷言庫。找到node_modules/should/should.js，將其復制到test-lib目錄下。
karma.conf.js描述了karma測試的配置信息，在該目錄下運行karma start時，會默認從該文件中讀取信息。可以通過在該目錄下運行karma init的方式來幫助生成karma.conf.js文件。
配置karma.conf.js
運行karma init后，karma會提一些問題，可以通過按tab鍵來切換選項。如果一些選項需要依賴某些未安裝的npm包，karma也會提醒你之后用什么命令來安裝這些依賴。
當karma問道：”what is the location of your source and test file"時，依次輸入 src/**/*.js , test-lib/**/*.js , test/**/*.js ，表示要運行src、test-lib、test中的所有js文件。
值得注意的是，autoWatch這一屬性最好選擇true，這樣，karma會在指定目錄有更新時自動跑測試。
本例中karma.conf.js文件的內容如下，設置了同時在Chrome和Firefox這兩個瀏覽器里里運行測試：
1 // Karma configuration 2 // Generated on Mon Mar 17 2014 12:46:02 GMT+0800 (CST) 3 4 module.exports = function(config) { 5 config.set({ 6 7 // base path, that will be used to resolve files and exclude 8 basePath: '', 9 10 11 // frameworks to use 12 frameworks: ['mocha'], 13 14 15 // list of files / patterns to load in the browser 16 files: [ 17 'src/**/*.js', 18 'test-lib/**/*.js', 19 'test/**/*.js' 20 ], 21 22 // reporters : ['progress'], 23 24 // list of files to exclude 25 exclude: [ 26 27 ], 28 29 30 // test results reporter to use 31 // possible values: 'dots', 'progress', 'junit', 'growl', 'coverage' 32 reporters: ['spec'], 33 34 35 // web server port 36 port: 9876, 37 38 39 // enable / disable colors in the output (reporters and logs) 40 colors: true, 41 42 43 // level of logging 44 // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG 45 logLevel: config.LOG_INFO, 46 47 48 // enable / disable watching file and executing tests whenever any file changes 49 autoWatch: true, 50 51 52 // Start these browsers, currently available: 53 // - Chrome 54 // - ChromeCanary 55 // - Firefox 56 // - Opera (has to be installed with `npm install karma-opera-launcher`) 57 // - Safari (only Mac; has to be installed with `npm install karma-safari-launcher`) 58 // - PhantomJS 59 // - IE (only Windows; has to be installed with `npm install karma-ie-launcher`) 60 browsers: ['Chrome', 'Firefox'], 61 62 // If browser does not capture in given timeout [ms], kill it 63 captureTimeout: 60000, 64 65 66 // Continuous Integration mode 67 // if true, it capture browsers, run tests and exit 68 singleRun: false 69 }); 70 };
運行測試
要測試的內容很簡單，就是看sayHi這個函數能不能在有輸入時跟人打個招呼：
1 //greetings.js 2 function sayHi(name){ 3 return name ? "Hi " + name : "Nobody comes"; 4 }
相應的測試代碼寫在greeting-spec.js中：
1 //greetings-spec.js 2 describe("Counter", function() { 3 4 it("should say Hi given a name", function() { 5 sayHi("Tom").should.equal("Hi Tom"); 6 }); 7 8 it("should not say Hi if no input", function() { 9 sayHi().should.equal("Nobody comes"); 10 }); 11 12 });
直接在demo-karma-mocha下運行 karma start 就可以啟動兩個瀏覽器並運行測試了，測試的結果會在命令行中顯示。
由於設置了 autoWatch:true ，當改變src、test-lib、test文件夾中的任意一個文件時，karma都會重新運行所有測試。
如果autoWatch的值為false，則在 karma start 后，還需要 karma run 來手動運行每一次測試。
問題
這樣還仍然不夠方便。
比如，雖然用npm引入了should.js，卻還要在node之外手動地將should.js放在test-lib中。而且，為了讓其在瀏覽器里運行，這個程序沒有用到node.js模塊化的功能。這一點可以用browserify來解決，把運行在后端的js代碼轉換為瀏覽器能運行的代碼。
另外，grunt也可以集成karma，用它來運行karma測試就更方便了。