Angularjs 我的应用程序测试失败了

Angularjs 我的应用程序测试失败了,angularjs,requirejs,karma-runner,Angularjs,Requirejs,Karma Runner,我有一个Angular应用程序,带有一个简单的karma测试和一个使用requirejs和Angular 1.2.28的非常简单的配置。我的测试还可以 /** * Created by jose on 7/12/2015. */ /*global module, inject */ define(['home', 'angularMocks','ngStorage'], function(app) { 'use strict'; describe('homeControll

我有一个Angular应用程序,带有一个简单的karma测试和一个使用requirejs和Angular 1.2.28的非常简单的配置。我的测试还可以

/**
 * Created by jose on 7/12/2015.
 */
/*global module, inject */

define(['home', 'angularMocks','ngStorage'], function(app) {
    'use strict';
    describe('homeController', function () {
        var scope, $location, createController;
        beforeEach(module('homeApp'));

        beforeEach(inject(function ($rootScope, $controller, _$location_) {
            $location = _$location_;
            scope = $rootScope.$new();

            createController = function () {
                return $controller('homeController', {
                    '$scope': scope
                });
            };
        }));

        it('should have message', function () {
            var controller = createController();
            $location.path('/');
            expect($location.path()).toBe('/');
            expect(scope.message).toEqual('This is Add new order screen');
        });
    });

});
我的模块:

/**
 * Created by jose on 7/12/2015.
 */
'use strict';

define(['angular', 'angularRoute'], function(angular) {
    var app = angular.module('homeApp', ['ngRoute']);

    app.config(['$routeProvider',
        function ($routeProvider) {
            $routeProvider.
                when('/', {
                    templateUrl: 'partials/home.html',
                    controller: 'homeController'
                })
                .when('/404', {
                    templateUrl: 'partials/404.html',
                })
                .otherwise({
                    redirectTo: '/404'
                });
        }
    ]);

    app.controller('homeController', function ($scope) {
        $scope.message = 'This is Add new order screen';
    });

    return app;
});
不幸的是,当我尝试添加ngStorage作为此模块的依赖项时,它无法再工作。即使尝试将ngStorage添加到我的karma配置中,也会引发如下错误:

Error: Mismatched anonymous define() module: function (app) {
只有当我尝试使用ngStorage时,当我将其注释到karma.conf文件中时,错误才会消失,一切正常。。。 如果无法将ngStorage与业力一起使用,那么ngStorage还有其他替代方案吗?谢谢

karma.conf

// Karma configuration
// Generated on Mon Jul 13 2015 09:49:28 GMT-0300 (Hora est. Sudamérica Pacífico)

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: [
      'test-main.js',
      'bower_components/angular/angular.js',
      'bower_components/angular-mocks/angular-mocks.js',
      'bower_components/angular-route/angular-route.js',
      'bower_components/ngstorage/ngStorage.js',
      {pattern: 'javascripts/*.js', included: false},
      {pattern: 'test/**/*Spec.js', included: false}
    ],


    // list of files to exclude
    exclude: [
      'javascripts/config.js'
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },


    // 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
  });
};
项目位于github:


亲切的问候。

似乎你并不是唯一一个试图一起使用业力和存储的人。Karma的人已经提供了一些代码来帮助解决这个问题。您可以在这里查看:


这是因为requirejs的异步加载特性。用这种方法可以解决错误

转到test-main.js。 用这种方法在那里加垫片

shim:{
   'yourJsModule':{
      deps:['angular','yourApp']
   }
}

用您要测试的角度文件替换您的JSModule,用您的角度模块文件替换“yourApp”…

如果您查看ngStorage的代码,您将看到它调用define。所以它是一个合适的AMD模块。您在Karma设置中使用的每个AMD模块必须在文件中加载include:False:


否则,Karma将使用脚本元素加载它,您将得到您得到的错误。

OP自己的模块是正确的AMD模块:它们使用define。当模块使用define时,不得为其设置垫片。因此,告诉OP在OP的模块中使用define是错误的。如果您不使用shim,那么您将如何提供依赖项?依赖项将提供给define调用。@Louis我也尝试过,但它也会抛出错误。但是,在垫片中添加DEP后,所有错误都消失了。
{ pattern: 'bower_components/ngstorage/ngStorage.js', included: False }