AngularJS控制器测试因RequireJS而失败

时间:2013-08-09 07:41:32

标签: angularjs requirejs jasmine karma-runner

我的茉莉花测试(使用业力)抛出错误:参数'salesListController'不是函数,未定义

经过大量搜索后,question似乎接近我的错误,但这是单元测试而非e2e情景测试。

我的test-main.js

(function (window, require) {
'use strict';
var file, requireModules;
requireModules = [];

for (file in window.__karma__.files) {
    if (window.__karma__.files.hasOwnProperty(file)) {
       // console.log('loaded file'+ file);
        if (file.substring(file.length - 26, file.length) === 'salesListControllertest.js') {
            console.log('Added file to testing..');
            requireModules.push(file);
        }
    }
}

//requireModules.push('appModule');
//requireModules.push('mocks');
deps: requireModules,
require({
    baseUrl: '',
    paths:{
        'angular': '/base/app/bower_components/angular/angular',
        'angularResource': '/base/app/bower_components/angular-resource/angular-resource',
        'angularMocks': '/base/app/bower_components/angular-mocks/angular-mocks',
        'appModule': '/base/app/scripts/appModule',
        'appRoutes':'/base/app/scripts/appRoutes',
        'services/dependencyResolverFor':'/base/app/scripts/services/dependencyResolverFor',
        'salesListController' : '/base/app/scripts/controllers/salesListController'
    },
    shim:{
        'angular' :{
            exports:'angular'
        },
        'appRoutes': {exports:'appRoutes'},
        'services/dependencyResolverFor' : {exports:'services/dependencyResolverFor'},
        'appModule': {
            deps: ['appRoutes', 'services/dependencyResolverFor'],
            exports: 'appModule'
        },
        'angularResource': {
            deps: ['angular'],
            exports: 'angularResource'
        },
        'angularMocks': {
            deps: ['angularResource'],
            exports: 'angularMocks'
        } ,
        'salesListController': {
            deps: ['appModule'],
            exports: 'salesListController'
        }
    }
}, requireModules, function () {
    window.__karma__.start();
}, function (err) {
    var failedModules = err.requireModules;
    console.log("err", err);

    if (failedModules && failedModules[0]) {
        throw new Error("Module could not be loaded: " + failedModules);
    } else {
        throw new Error("unknown error:" + err);
    }
});   }(window, require));

我的example.spec

define(['appModule','angular', 'angularResource', 'angularMocks','salesListController'],
function(app, angular, angularResource, angularMocks, saleslstCtrl) {
    describe('SalesListController1', function(){
        beforeEach(module('AngularSampleBhoomiApp'));
        var SalesListController, scope;
        var sales = [{Customer:"A1",Number:1,Id:1},{Customer:"B1",Number:2,Id:2}];
        beforeEach(inject(function($controller, $rootScope,$injector){
        scope = $rootScope.$new();
        SalesListController = $controller('salesListController', {$scope:scope, getAllSalesResolved:sales});
    }));
    it('should have 0 items when loaded', function(){
        expect(scope.sales).toBeUndefined();
    });
});});

我的示例控制器

define(['appModule'], function(myApp){
function SalesLstCtrl(){
    myApp.lazy.controller('salesListController' ,['$scope', 'getAllSalesResolved',
        function ($scope, sales) {
            console.log('before sales');
            $scope.sales= sales;
            console.log( $scope.sales.length);
        }]);                          }
return SalesLstCtrl;});

由于我正在使用延迟加载,因此我正在解析依赖关系:

define([], function()
{
return function(dependencies)
{
    var definition =
    {
        resolver: ['$q','$rootScope', function($q, $rootScope)
        {
            var deferred = $q.defer();

            require(dependencies, function()
            {
                $rootScope.$apply(function()
                {
                    deferred.resolve();
                });
            });

            return deferred.promise;
        }]
    }
    return definition;
} });

我对整个样本的github回购是here

帮助。

1 个答案:

答案 0 :(得分:0)

是的,我找到了解决方案。

Here是我的博客文章。

GitHub代码在这里:sample

通过模拟模块创建来完成。

编辑: 用代码。这里的技巧是像这样初始化AngularJS:

define(function(){ var app = angular.module('AngularAppModule', 'ngResource']);app.lazy = app;  return app;});

这将在Angular中添加app.lazy引用,然后RequireJS可以以相同的方式初始化控制器。 Test-main.js文件是一样的。对于运行Karma,test-main将预先加载所有脚本,而Require将不会打扰。如果您还有其他问题,请与我们联系。