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

      

    
    
  • 相关阅读:
    SqlServer无备份下误删数据恢复
    vue——storage命名冲突问题解决 前端
    vue——bus总线 前端
    elementUI——elform表单验证,表单项切换显示,校验错误信息未清除 前端
    elementUI——input输入框,设置autocomplete="off"无效问题 前端
    elementUI——table空单元格自动填充占位符,编辑后数据更新视图未更新问题 前端
    vue——爷孙组件之间通信 前端
    vue——路由守卫beforeEach,next(), next('/'), next({...to, repalce: true})说明及实例问题 前端
    elementUI——zindex自增问题 前端
    vue——vuecli3项目打包时区分环境以及环境变量undefined问题解决 前端
  • 原文地址:https://www.cnblogs.com/towersxu/p/4544499.html
Copyright © 2020-2023  润新知