角茉莉花UI路由器注入决心值转换成考验 [英] Angular Jasmine UI router inject resolve value into test

问题描述

在我的角的应用程序，用户界面​​解析路由器的承诺到控制器。当试图测试这个控制器，噶抱怨一个未知的供应商。我如何注入假的对象插入到测试重新present这个决心对象。

我的应用程序的code看起来是这样的：

  angular.module（'的myapp'）
的.config（函数（$ stateProvider，$ urlRouterProvider）{
    $ stateProvider
    .STATE（'tab.name'，{
        ...
        解析：{
            allTemplates：功能（模板）{
                返回Templates.all（）。然后（功能（模板）{
                    返回模板;
                }）;
            }
        }
    }）
}）
.controller（'QueriesCtrl'，函数（allTemplates，UserQuery）{
    VAR VM =这一点;
    vm.queries = allTemplates;
    vm.goToUrl =功能（索引数据）{
        VAR processedUrl = UserQuery.process（数据，vm.queryTyped [指数]）;
        UserQuery.goToUrl（processedUrl）;
    };
}）;
 

当试图运行测试中，我得到的错误

 未知提供商：allTemplatesProvider＆LT;  -  allTemplates＆LT;  -  QueriesCtrl
 

我试图创造一个间谍和注入，但不起作用。下面是我的测试此刻的：

 描述（'单位：queriesCtrl'，函数（）{
    VAR控制器，
        范围，
        UserQuery;    beforeEach（函数（）{
        模块（'的myapp'）;
        注（函数（$喷油器）{
            UserQuery = $ injector.get（'UserQuery'）;
            allTemplates = jasmine.createSpyObj（'allTemplates'，[{A：1}，{A：2}，{B：3}]）;
        }）;
    }）;    描述（goToUrl'，函数（）{
        beforeEach（注（函数（$ rootScope，$控制器）{
            范围= $ rootScope $新的（）。
            控制器= $控制器（'QueriesCtrl作为CTRL'，{
                '$范围：范围
            }）;
        }））;
        它（'应该调用UserQuery.process（）'，函数（）{
            spyOn（UserQuery，进程）;
            scope.ctrl.goToUrl（）;
            期待（UserQuery.process）.toHaveBeenCalled（）;
        }）;
    }）;
}）;
 

解决方案

由于没有参与单元测试路线，你将不得不注入 allTemplates 为普通对象与 $控制器功能。你可以试试：

 控制器= $控制器（'QueriesCtrl作为CTRL'，{
                '$范围：范围，
                 allTemplates'：allTemplates
            }）;
 

否则，你可以使用 $提供 API来创建一个虚拟的服务。

 模块（函数（$提供）{
    $ provide.value（allTemplates，{[{一个：1}，{一个：2}，{B：3}]}）;
 

不要在你的 beforEach 块第一件事。

In my Angular app, UI router resolves a promise into the controller. When trying to test this controller, Karma is complaining about an unknown provider. How do I inject a fake object into the test to represent this resolve object.

My app's code looks something like:

angular.module('myapp')
.config(function($stateProvider, $urlRouterProvider) {
    $stateProvider
    .state('tab.name', {
        ...
        resolve: {
            allTemplates: function(Templates) {
                return Templates.all().then(function(templates) {
                    return templates;
                });
            }
        }
    })
})
.controller('QueriesCtrl', function(allTemplates, UserQuery) {
    var vm = this;
    vm.queries = allTemplates;
    vm.goToUrl = function(index, data) {
        var processedUrl = UserQuery.process(data, vm.queryTyped[index]);
        UserQuery.goToUrl(processedUrl);
    };
});

When trying to run tests I get the error

Unknown provider: allTemplatesProvider <- allTemplates <- QueriesCtrl

I've tried creating a spy and injecting it, but this does not work. Here's my test at the moment:

describe('Unit: queriesCtrl', function() {
    var controller,
        scope,
        UserQuery;

    beforeEach(function() {
        module('myapp');
        inject(function($injector) {
            UserQuery = $injector.get('UserQuery');
            allTemplates = jasmine.createSpyObj('allTemplates', [{a:1}, {a:2}, {b:3}]);
        });
    });

    describe('goToUrl', function() {
        beforeEach(inject(function ($rootScope, $controller) {
            scope = $rootScope.$new();
            controller = $controller('QueriesCtrl as ctrl', {
                '$scope': scope
            });
        }));
        it('should call UserQuery.process()', function() {
            spyOn(UserQuery, 'process');
            scope.ctrl.goToUrl();
            expect(UserQuery.process).toHaveBeenCalled();
        });
    });
});

解决方案

Since there is no route involved in unit test you would have to inject the allTemplates as a normal object with $controller function. Can you try:

controller = $controller('QueriesCtrl as ctrl', {
                '$scope': scope,
                 'allTemplates':allTemplates 
            });

Else you can use the $provide API to create a dummy service.

 module(function ($provide) {
    $provide.value("allTemplates", {[{a:1}, {a:2}, {b:3}]});

Do it first thing in your beforEach block.

这篇关于角茉莉花UI路由器注入决心值转换成考验的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！