如何测试使用RequireJS AngularJS控制器？ [英] How do I test AngularJS controllers using RequireJS?

问题描述

下面是我的茉莉花规范，

 定义（['应用'，'角'，'angularResource'，'angularMocks']，函数（）{
描述（应用模块测试，函数（）{
    VAR模块，$ rootScope，范围，AppCtrl;
    beforeEach（函数（）{
        模块= angular.module（MyApp的）;
        注（函数（$ rootScope，$控制器）{
            //注射器来自各地的参数名称相匹配时，解开了下划线（_）
            范围= $ rootScope $新的（）。
            AppCtrl = $控制器（'AppCtrl'，{$范围：适用范围}）;
        }）;
    }）;
    }）;
}）;
 

在我app.js，我..

  VAR的MyApp = angular.module（'MyApp的'）;
MyApp.controller（'AppCtrl'，['$ rootScope'，函数（$ rootScope）{
//控制器code在这里
}]）;
 

当我运行单元测试，我得到以下错误，

错误：参数'AppCtrl不是一个函数，得到了不确定

此外，这里是我的测试main.js

  VAR测试= Object.keys（窗口.__因缘__。文件）.filter（功能（文​​件）{
    返回（/Spec\\.js$/).test(file）;
}）;
requirejs.config（{
    //从噶'/基地提供的文件
    的baseUrl：'/基/ src'中，
    路径：{
        '角'：'库/角'，
        angularResource：库/角资源'，
        angularMocks：库/角嘲笑'，
        应用程序：应用程序/应用程序
    }，
    //问Require.js加载这些文件（所有测试）
    DEPS：测试，
    //启动试运行，一旦Require.js完成
    回调：窗口.__人缘__启动
}）;
 

和我人缘的配置，

  //的文件/目录模式在浏览器中加载
文件= [
    茉莉，
    JASMINE_ADAPTER，
    要求，
    REQUIRE_ADAPTER，
    SRC /库/ angular.js'，
    SRC /库/角resource.js'，
    SRC /库/角mocks.js'，
    {模式：'SRC /应用/ * JS'，包括：虚假}，
    {模式：'SRC /应用/ ** / * JS'，包括：虚假}，
    {模式：测试/ ** / * Spec.js'，包括：虚假}，
    测试/测试main.js
];
 

解决方案

试试这个。我认为你需要摆脱关闭该功能包裹注入（）。

 定义（['应用'，'角'，'angularResource'，'angularMocks']，函数（）{
    描述（应用模块测试，函数（）{
        VAR模块，$ rootScope，范围，AppCtrl;
        beforeEach（angular.module（MyApp的））;        beforeEach（注（函数（$ rootScope，$控制器）{
            范围= $ rootScope $新的（）。
            AppCtrl = $控制器（'AppCtrl'，{
                $适用范围：适用范围
            }）;
        }））;
    }）;
}）;
 

Editied：

我想你需要 ANGULAR_SCENARIO_ADAPTER 来果报工作。

Here's my Jasmine spec,

define(['app', 'angular', 'angularResource', 'angularMocks'], function() {
describe('App module tests', function(){
    var module, $rootScope, scope, AppCtrl;
    beforeEach(function () {
        module = angular.module("MyApp");
        inject(function($rootScope, $controller){
            // The injector unwraps the underscores (_) from around the parameter names when matching
            scope = $rootScope.$new();
            AppCtrl = $controller('AppCtrl', {$scope: scope});
        });
    });
    });
});

In my app.js, I have..

var MyApp = angular.module('MyApp');
MyApp.controller('AppCtrl', ['$rootScope', function($rootScope){
// controller code here
}]);

When I run the unit test, I get below error,

Error: Argument 'AppCtrl' is not a function, got undefined

Also, here's my test-main.js,

var tests = Object.keys(window.__karma__.files).filter(function (file) {
    return (/Spec\.js$/).test(file);
});
requirejs.config({
    // Karma serves files from '/base'
    baseUrl: '/base/src',
    paths: {
        'angular': 'libs/angular',
        'angularResource': 'libs/angular-resource',
        'angularMocks': 'libs/angular-mocks',
        'app': 'app/app'
    },
    // ask Require.js to load these files (all our tests)
    deps: tests,
    // start test run, once Require.js is done
    callback: window.__karma__.start
});

And my karma configuration,

// list of files / patterns to load in the browser
files = [
    JASMINE,
    JASMINE_ADAPTER,
    REQUIRE,
    REQUIRE_ADAPTER,
    'src/libs/angular.js',
    'src/libs/angular-resource.js',
    'src/libs/angular-mocks.js',
    {pattern: 'src/app/*.js', included: false},
    {pattern: 'src/app/**/*.js', included: false},
    {pattern: 'test/**/*Spec.js', included: false},
    'test/test-main.js'
];

解决方案

Try this. I think you need to get rid off the function wrapping the inject().

define(['app', 'angular', 'angularResource', 'angularMocks'], function () {
    describe('App module tests', function () {
        var module, $rootScope, scope, AppCtrl;
        beforeEach(angular.module("MyApp"));

        beforeEach(inject(function ($rootScope, $controller) {
            scope = $rootScope.$new();
            AppCtrl = $controller('AppCtrl', {
                $scope: scope
            });
        }));
    });
});

Editied:

I think you need ANGULAR_SCENARIO_ADAPTER to work with karma.

这篇关于如何测试使用RequireJS AngularJS控制器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！