angularjs requirejs unit test

一、安装notejs

　　最好默认路径安装，选上添加环境变量和npm安装

二、全局安装bower　　

npm install -g bower

三、添加配置文件

　　1. package.json (nodejs的库)

可以通过npm init来创建，也可以手动添加如下的依赖库

{
  "name": "workflow",
  "version": "1.0.0",
  "description": "suibian",
  "main": "karma.conf.js",
  "dependencies": {},
  "devDependencies": {
    "bower": "^1.8.0",
    "http-server": "^0.9.0",
    "jasmine-core": "^2.3.0",
    "karma": "^0.12.31",
    "karma-chrome-launcher": "^0.1.8",
    "karma-firefox-launcher": "^0.1.4",
    "karma-jasmine": "^0.3.5",
    "karma-junit-reporter": "^0.2.2",
    "karma-requirejs": "^0.2.2",
    "protractor": "^1.1.1",
    "requirejs": "^2.1.15",
    "shelljs": "^0.2.6"
  },
  "scripts": {
    "postinstall": "bower install", //npm install完后就会接着执行bower install
    "prestart": "npm install",
    "start": "http-server -a localhost -p 8090 -c-1 ",
    "pretest": "npm install",
    "test": "karma start karma.conf.js",
    "test-single-run": "karma start karma.conf.js  --single-run",
    "preupdate-webdriver": "npm install",
    "update-webdriver": "webdriver-manager update",
    "preprotractor": "npm run update-webdriver",
    "protractor": "protractor e2e-tests/protractor.conf.js"
  },
  "author": "",
  "license": "ISC"
}

　　2. bower.json (web库)

　　　　同样的可以通过bower init创建，也可以直接手动添加

{
  "name": "workflow",
  "authors": [
    "Purk <737633175@qq.com>"
  ],
  "description": "workflow progrem",
  "main": "",
  "license": "MIT",
  "homepage": "",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "angular-animate": "^1.6.4",
    "angular-mocks": "^1.6.4",
    "angular-ui-router": "^1.0.3",
    "jquery": "^3.2.1",
    "jquery-ui": "jqueryui#^1.12.1",
    "angular-slimscroll": "^1.1.5",
    "angular": "^1.6.4",
    "jquery-slimscroll": "^1.3.8",
    "bootstrap": "^3.3.7",
    "font-awesome": "^4.7.0",
    "animate.css": "animate-css#^3.5.2"
  },
  "private": true
}

四、安装nodejs库和web库

npm install

五、配置karma

karma.conf.js

//jshint strict: false
module.exports = function(config) {
    config.set({

        basePath: '',


        files: [
            { pattern: 'bower_components/angular/angular.js', included: false },
            { pattern: 'bower_components/angular-mocks/angular-mocks.js', included: false },
            { pattern: 'bower_components/jquery/dist/jquery.min.js', included: false },
            { pattern: 'bower_components/jquery-ui/jquery-ui.min.js', included: false },
            { pattern: 'bower_components/jquery-slimscroll/jquery.slimscroll.min.js', included: false },
            { pattern: 'bower_components/angular-slimscroll/angular-slimscroll.js', included: false },
            { pattern: 'bower_components/angular-animate/angular-animate.min.js', included: false },
            { pattern: 'modules/**/*.js', included: false },
            { pattern: 'component/**/*.js', included: false },
            { pattern: 'directive/*.js', included: false },
            { pattern: 'filter/**/*.js', included: false },
            { pattern: 'js/!(require.config).js', included: false },
            // needs to be last http://karma-runner.github.io/0.12/plus/requirejs.html
            'js/require.config.js'
        ],

        autoWatch: true,

        frameworks: ['jasmine', 'requirejs'],

        browsers: ['Chrome'],

        plugins: [
            'karma-chrome-launcher',
            'karma-firefox-launcher',
            'karma-jasmine',
            'karma-requirejs',
            'karma-junit-reporter'
        ],

        junitReporter: {
            outputFile: 'test_out/unit.xml',
            suite: 'unit'
        }
    });
};

六、requirejs配置

(function() {
    var allTestFiles = [];
    var TEST_REGEXP = /spec.js$/i;
    if (window.__karma__) {


        var pathToModule = function(path) {
            return path.replace(/^/base//, '').replace(/.js$/, '');
        };

        Object.keys(window.__karma__.files).forEach(function(file) {
            if (TEST_REGEXP.test(file)) {
                // Normalize paths to RequireJS module names.
                allTestFiles.push(pathToModule(file));
            }
        });
    }


    function testReady() {
        var testInternal = setInterval(function() {
            if (window.__karma__.angularIsReady == true) {
                window.__karma__.start();
                clearInterval(testInternal);
            }
        }, 50);
    }
    require.config({
        baseUrl: window.__karma__ ? '/base/' : '',
        paths: {
            jquery: 'bower_components/jquery/dist/jquery.min',
            jqueryUI: 'bower_components/jquery-ui/jquery-ui.min',
            ng_slimscroll: 'bower_components/angular-slimscroll/angular-slimscroll',
            angular: 'bower_components/angular/angular',
            ng_animate: 'bower_components/angular-animate/angular-animate.min',
            ng_mock: 'bower_components/angular-mocks/angular-mocks',
            commonjs: 'modules/commonjs/commonjs',
            ng_component: 'modules/component/component',
            ng_directive: 'modules/directive/directive',
            domReady: 'js/domReady',
            page_load: 'component/page_load/page_load',
            header: 'component/header/header',
            side_bar: 'component/side_bar/side_bar',
            menu_list: 'component/side_bar/menu_list',
            content: 'component/content/content',
            view_intro: 'component/view_intro/view_intro',
            panel: 'component/panel/panel',
            d_slide: 'directive/slide',
            slimscroll: 'bower_components/jquery-slimscroll/jquery.slimscroll.min'
        },
        shim: {
            'angular': {
                exports: 'angular',
                deps: ['jquery']
            },
            'ng_animate': {
                deps: ['angular']
            },
            'ng_mock': {
                deps: ['angular'],
                'exports': 'angular.mock'
            },
            'jqueryUI': {
                deps: ['jquery']
            },
            'slimscroll': {
                deps: ['jquery']
            }
        },
        priority: [
            "angular"
        ],
        deps: window.__karma__ ? allTestFiles : ['js/main.js'],
        callback: window.__karma__ ? testReady : null,   //testReady没有直接使用window.__karma__.start（官方的教程）是因为我的项目angularjs+requirejs是异步加载ng的，testReady就是让所有的ng模板compile完后才执行karma的测试，不然后面会报模板找不到的。

        urlArgs: "bust=" + (new Date()).getTime() //防止读取缓存，调试用
    })
})();

注：在npm运行服务或者运行test时可能会报

问题是中文字符导致的，修改方式如下

node_modules/connect/lib/patch.js 修改下面框出的代码

下面是直接复制，省去君们的手敲。

try{
        if(typeof  val === 'string'){
          val =  val.replace(/中国标准时间/,'')
        }
        return setHeader.call(this, field, val);
    }catch(e){
      console.log(e, val,field)
    }