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');\""

  }

}