Karma + RequireJS + AngularJS，填充脚本未按规范加载

Question

在使用 Karma + Jasmine + RequireJS + AngularJS 时，我无法加载任何填充脚本，例如 angular-mocks，进入测试规范。该文件似乎可以正常使用，只是在规范中不起作用。

UPDATE Angular是全局的，相应的shim不影响它。

在 Karma.conf.js 中，我包括 angular-mocks 以由 RequireJS 加载：

module.exports = function(config) {
    config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '../../',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine', 'requirejs'],


    // list of files / patterns to load in the browser
    files: [
        {pattern: 'node_modules/angular-mocks/angular-mocks.js', included: false},
        ...
        'test/euro-2016/main-test.js'
    ],


    // list of files to exclude
    exclude: [
        'main/main-euro-2016.js'
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
        '../../*.html': ['ng-html2js']
    },


    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],

    // web server port
    port: 9876,


    // enable / disable colors in the output (reporters and logs)
    colors: true,


    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_DEBUG,


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,


    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['PhantomJS'],


    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false,

    // Concurrency level
    // how many browser should be started simultaneous
    concurrency: Infinity
})

};

Karma 主文件中的 RequireJS shim main-test.js:

var tests = [];
for (var file in window.__karma__.files) {
    if (window.__karma__.files.hasOwnProperty(file)) {
        if (/Spec\.js$/.test(file)) {
            tests.push(file);
        }
    }
}

requirejs.config({
    // Karma serves files from '/base'
    baseUrl: "/base",

    paths: {
        "angular": "vendor/angular/angular",
        "angularMocks": "node_modules/angular-mocks/angular-mocks",
        "jquery": "vendor/jquery/jquery.min",
        ...
    },

    shim: {
        "angular":      {
            exports:    "angular",
            deps:       ['jquery']
        },
        "angularMocks": {
            exports: "angularMocks",
            deps: ['angular']
        },
        ...
    },

    // ask Require.js to load these files (all our tests)
    deps: tests,

    // start test run, once Require.js is done
    callback: window.__karma__.start
});

规范文件：

define(['angular', 'modules/euro-2016/app', 'angularMocks'], function(angular, app, mocks){
    console.log("ANGULAR", angular); // ok
    console.log("APP", app); // ok
    console.log("MOCKS", mocks); // undefined
})

Answer 1

查看通过安装npm包angular-mocks安装的源代码，具体是文件node_modules/angular-mocks/angular-mocks.js，这是我看到的：

该代码中没有任何地方提到 angularMocks，因此无法导出 angularMocks。
相反，插件将自己安装为 angular.mock。在文件的开头有一行：
```
angular.mock = {};
```
然后所有内容都添加到 angular.mock。

因此您可以删除 exports 并通过 angular.mock 访问插件。这应该有效：

define(['angular', 'modules/euro-2016/app', 'angularMocks'], function(angular, app){
    console.log("ANGULAR", angular);
    console.log("APP", app);
    console.log("MOCKS", angular.mock); 
});

如果出于某种原因你必须有一个 exports（例如，如果你使用 enforceDefine，这要求所有 shim 都有 exports 值）你可以设置它到 angular.mock.

Karma + RequireJS + AngularJS，填充脚本未按规范加载

Karma + RequireJS + AngularJS, shimmed scripts not loading in spec

requirejs

angularjs

karma-jasmine