使用 Jasmine 编写单元测试，Angular JS 需要 Karma 中的 JS？答案

【问题标题】：Writing Unit Testing With Jasmine , Require JS in Karma for Angular JS?使用 Jasmine 编写单元测试，Angular JS 需要 Karma 中的 JS？
【发布时间】：2015-03-11 07:42:49
【问题描述】：

我已经使用 Angular JS 完成了一个库管理应用程序，Mongo Lab 将充当数据库部件，我在创建单元测试用例时面临 Require JS Dependency 的问题

Error: [$injector:modulerr] Failed to instantiate module lmaApp due to:
Error: [$injector:nomod] Module 'lmaApp' is not available!

我面临的上述错误，请帮助我摆脱困境。

我的代码：

Controller.js

define(
    ['modules'],
    function(lmaApp) {
        lmaApp.controller('gridControl',['$scope' , '$http' , 'internal' , 'commonValues', function($scope , $http , internalFn , commonValues){
            jQuery('ul.navbar-nav li').removeClass('active');
            jQuery('ul.navbar-nav li:nth-child(1)').addClass('active');
            $('.loaderImg').removeClass('no-loading');
            var lmaTableData = internalFn.getTableData(commonValues.mongoAPIurl,commonValues.bookTableName,'');
                    var promise = lmaTableData
                    .success(function(tbData) {
                        if(tbData.length > 0){
                            $scope.nobook=0;
                            $scope.books =tbData;
                        }
                        else{
                           $scope.nobook =1; 
                        }
                    }).then(function (response) {$('.loaderImg').addClass('no-loading');});
        }]);
});

modules.js

define(
    ['app_config','angularRoute'],
    function() {
        var lmaApp =angular.module('lmaApp',['ngRoute'])
        return lmaApp;
    });

app_config.js

define(
    ['angular','angularRoute','modules'],
    function() {

            angular.element(document).ready(function() {
                angular.bootstrap(document, ['lmaApp'], {});
            });

    });

我的规范文件

controllerSpec.js

define(['angular', 'angular-mocks'], function() {
    describe('gridControl', function(){

      beforeEach(module('lmaApp'));

      it('should get the book table Datas', inject(function($controller) {
        var scope = {},
            ctrl = $controller('gridControl', {$scope:scope});

        expect(scope.phones.length).not.toEqual(0);
      }));

    });
});

在这里，我对 require js 的依赖有疑问，就像我不得不提到 modules.js 作为 Spec 文件中的依赖一样。

【问题讨论】：

标签： angularjs unit-testing requirejs jasmine karma-runner

【解决方案1】：

你的 controller-spec.js 是错误的，你需要调用它的依赖，即你的 module.js、app_config.js、Controller.js 和 'angularRoute'。在其他方面使您的应用程序能够进行自举。

这样试试

define(['angular', 'angular-mocks','modules', 'app_config', 'Controller', 'angularRoute'], function() { ... }

我仍然无法确定它是否适合您。因为如果你的任何配置是错误的。它会被打破。在单元测试中使用 requireJS 和 AngularJS 在配置中非常棘手/复杂。

您应该阅读有关 requireJS 配置的更多信息，并使用 shim 为您的脚本定义依赖项。当您的应用程序变大时，它将更加清晰和易于处理。例如，您可以在配置文件中执行以下操作：

shim: {
    'modules': ['angular', 'app_config', 'angular-mocks'],
    'app_config': ['angular', 'angularRoute', 'modules'],
    'Controller': ['modules']
}

你的 controller-spec.js 会是这样的

define(['modules', 'app_config', 'Controller'], function(){ ... });

另外在元素就绪时引导角度对于测试来说不是一个好主意。在加载模拟业力时可能会引起一些冲突。我不确定，但感觉不对

Sencond 你的app_config.js 和modules.js 是相互依赖的。那么，如果有什么东西需要加载顺序，你怎么看。哪个需要先加载？因为两者都需要在被 requireJS 注入之前加载另一个。

仍然我认为我的解决方案行不通。因为你的配置看起来很不对。

【讨论】：