angularJS測試並集成到jinkens

最近咱們打算把angularJS的測試集成到jinkens中去，因爲jinkens上所須要的格式和angular官方例子中的不同，最後在google和API的幫助下，找到了較好的解決辦法。可是protractor的測試覆蓋率去沒有好的解決辦法（我的感受也不必將protractor集成到jinkins上）。

plantomJS

因爲karma和protractor是須要瀏覽器才能運行的測試框架，而jinkens通常都是在無界面服務器上，全部須要在服務器上安裝一個無界面瀏覽器plantomJS。 plantomjs 主要用於 頁面自動化 ， 網絡監測 ， 無界面測試 等。下載地址： http://phantomjs.org/download.html ，Linux版本須要選擇對應 版本下載解壓便可。能夠查看《PlantomJS快速入門教程》

karma:

　　jinkens要收集測試結果，須要測試工具生成固定格式的xml文件。在karma中要將測試文件以符合jinkens格式形式輸出須要引用karma-junit-reporter。因爲karma是須要瀏覽器的，全部還須要karma-phantomjs-launcher。jinkens測試還須要覆蓋率這個東西，因此還要karma-coverage這個東西。karma-config.js配置文件以下：

 1     autoWatch : false,
 2 
 3     singleRun:true,
 4     frameworks: ['jasmine'],
 5     browsers:['PhantomJS'],
 6 
 7     plugins : [
 8             'karma-phantomjs-launcher',
10             'karma-jasmine',
11             'karma-junit-reporter',
12             'karma-coverage'
13             ],
14     reporters:['dots','junit','coverage'],
15     preprocessors:{
16       'app/js/*.js':['coverage']
17     },
18     junitReporter : {
19       outputFile: 'test/unit/karma.xml',
20       suite: ''
21     },
22     coverageReporter:{
23       type:"cobertura",
24       dir:'test/unit/'
25     }

注意,因爲在服務器上只須要運行一次，因此須要配置singleRun=true。那麼問題來了，我想測試本地的其餘瀏覽器呢？難道還有手動在天天提交的時候更改一次，這樣也太麻煩了。咱們能夠在寫一個配置文件karma.local.conf.js，專門來保存本地的測試配置。而後在package.json的scripts中加入一句

"local-test": "node node_modules/karma/bin/karma start test/karma.local.conf.js",

而後使用命令：npm run local-test便可。

protractor

　　對於protractor集成到jinkens上，protractor官方的意見是反對（against）的。由於e2e測試，在不一樣的瀏覽器表現可能會出現不一致，因此就算集成到jinkens上也不能表明真實的環境下測試的結果。並且對於e2e測試的覆蓋率也很差定義。protractor要想將測試結果保存爲xml文件，須要用到jasmine-reporters。至於protractor的測試覆蓋率，git上有一個項目叫作grunt-protractor-coverage。可是因爲e2e測試覆蓋率的問題，關注的人比較少，因此建議不用。也就是說，對於protractor，建議最多也就只把測試結果集成到jinkens上。我protractor-conf.js配置以下：

　　

exports.config = {
  framework: 'jasmine2',

  allScriptsTimeout: 11000,

  specs: [
    'e2e/*.js'
  ],

  capabilities: {
    'browserName': 'phantomjs'
  },

  chromeOnly: false,

  baseUrl: 'http://localhost:8000/',
  onPrepare:function(){
    var jasmineReporters = require('jasmine-reporters');
    jasmine.getEnv().addReporter(new jasmineReporters.JUnitXmlReporter({
      savePath:"test/e2e/"
    }));
  },
  jasmineNodeOpts: {
    defaultTimeoutInterval: 30000
  }
};

　　注意framework: 'jasmine2',要使用jasmine2,protractor版本必須在1.6以後。

　　其實關於protractor有不少麻煩的地方。首先就是要注意咱們偉大的牆，沒翻就會在運行webdirver-manager start的時候出現運行jar包出錯。你能夠點擊下載解壓，選擇合適的chromedriver和 selenium-server-standalone-2.25.0.jar保存到/node_modules/protractor/selenium/裏面。

　　另外，注意在運行protractor以前要將server啓動。通常也就是npm start

下面是個人package.json，還有一些其餘的東西，就請不要在乎那些重點了。

{
  "version": "0.0.1",
  "private": true,
  "name": "ajs-demo",
  "description": "A demo application for AngularJS",
  "repository": "https://github.com/towersxu/ajs-demo",
  "license": "MIT",
  "devDependencies": {
    "bower": "^1.3.1",
    "grunt": "~0.4.5",
    "grunt-bower-task": "~0.4.0",
    "grunt-contrib-concat": "0.5.1",
    "grunt-contrib-uglify": "0.9.1",
    "grunt-jsdoc": "0.5.8",
    "http-server": "^0.6.1",
    "jasmine-reporters": "^2.0.6",
    "karma": "^0.12.35",
    "karma-chrome-launcher": "^0.1.4",
    "karma-coverage": "0.3.x",
    "karma-firefox-launcher": "^0.1.6",
    "karma-jasmine": "^0.1.5",
    "karma-junit-reporter": "0.2.x",
    "karma-phantomjs-launcher": "0.2.0",
    "shelljs": "^0.2.6",
    "tmp": "0.0.23"
  },
  "scripts": {
    "postinstall": "bower install",
    "prestart": "npm install",
    "start": "http-server -a 0.0.0.0 -p 8000",
    "pretest": "npm install",
    "test": "node node_modules/karma/bin/karma start test/karma.conf.js --reporters junit,dots,coverage",
    "local-test": "node node_modules/karma/bin/karma start test/karma.local.conf.js",
    "test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js  --single-run --reporters junit,coverage,dots",
    "preupdate-webdriver": "npm install",
    "update-webdriver": "webdriver-manager update",
    "preprotractor": "npm run update-webdriver",
    "protractor": "protractor test/protractor-conf.js",
    "update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/, '//@@NG_LOADER_START@@\\n' + cat('bower_components/angular-loader/angular-loader.min.js') + '\\n//@@NG_LOADER_END@@', 'app/index-async.html');\""
  }
}