使用 karma 在 angularjs 中进行测试时得到“未定义要求”

Question

我正在使用带有 browersify 的 angulajs 来构建应用程序。为了测试它，我想使用 Karma。 我已经像这样设置了我的 conf 文件：

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

    basePath: '',

    frameworks: ['jasmine', 'browserify'],

    files: [
      'node_modules/angular/angular.js',
      'node_modules/angular-mocks/angular-mocks.js',
      'src/app/*',
      'src/app/*/*'
    ],

    exclude: [
      'src/app/*/*.jade'
    ],

    reporters: ['progress'],

    port: 9876,

    colors: true,
    logLevel: config.LOG_INFO,

    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,

    browserify: {
      debug: true
    },

    preprocessors: {'src/app/*/*.js': ['browserify']}
  });
};

我的 app.js 文件如下所示：

    require('angular')
require('angular-mocks')

var uiRouter          = require('angular-ui-router')
var serices    = require('./services')
var directives  = require('./directives')
var controllers = require('./controllers')
var routes            = require('./routes')

angular.module('myApp', [uiRouter, 'ngMocks'])
  // load Routes
  .config(routes)

  // Services
  .service('someService', services.someService)

  // Controllers
  .controller('myCtrl', controllers.myCtrl)

  // Directives
  .directive('myDirective', directives.myDirective);

我正在使用karma-browserify，但在运行测试时仍然出现以下错误：

'require is not defined'

我该如何解决这个问题？

Answer 1

您需要对单元测试文件运行 browserify 并将它们包含在文件中。我在这里包括 bundled.js，这是浏览器化的应用程序代码。

这个和你的很接近，它可以工作。

(function() {
    'use strict';
    // Karma configuration

    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: ['mocha', 'chai-as-promised', 'chai', 'browserify'],

            // list of files / patterns to load in the browser
            files: [
                // app-specific code. This should be generated by gulp browserify. Includes Angular
                'webapp/bundled.js',
                // 3rd-party resources
                'node_modules/angular-mocks/angular-mocks.js',
                // test files
                'unit/**/*.js'
            ],
            // list of files to exclude
            exclude: ['karma.conf.js', 'protractor-conf.js'],
            // Browserify config
            browserify: {
                watch: true,
                debug: true
            },
            // preprocess matching files before serving them to the browser
            // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
            preprocessors: {
                'unit/**/*.js': ['browserify']
            },

            // 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_INFO,

            // 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

            // - IE
            // - Chrome
            // - ChromeCanary
            // - Firefox
            // - Opera
            // - Safari
            // - PhantomJS
            browsers: ['Chrome', 'IE', 'Firefox'],

            // Continuous Integration mode
            // if true, Karma captures browsers, runs the tests and exits
            singleRun: true
        });
    };
})();