将服务注入Angular单元测试时出现Unknown Provider错误 [英] Getting Unknown Provider error when injecting a Service into an Angular unit test

问题描述

我对Angular还是很陌生，并且已经查看了关于Stack Overflow的所有类似问题，但是没有一个对我有帮助.我相信我已经正确设置了所有内容，但是在尝试将服务注入单元测试时仍然出现未知提供程序"错误.我在下面布置了我的代码-希望有人可以发现一个明显的错误！

I'm fairly new to Angular and have reviewed all the similarly related questions on Stack Overflow but none have helped me. I believe I have everything set up correctly but am still getting an 'Unknown Provider' error when attempting to inject a service into a unit test. I have laid out my code below - hopefully someone can spot an obvious error!

我在一个单独的 .js 文件中定义我的模块，如下所示:

I define my modules in a seperate .js file like this:

angular.module('dashboard.services', []);
angular.module('dashboard.controllers', []);

在这里，我定义了一个名为EventingService的服务(为简洁起见删除了逻辑):

Here is where I define a service called EventingService (with logic removed for brevity):

angular.module('dashboard.services').factory('EventingService', [function () {
    //Service logic here
}]);

这是我使用EventingService的控制器(这一切在运行时都可以正常运行):

Here is my controller that uses the EventingService (this all works fine at runtime):

angular.module('dashboard.controllers')
    .controller('Browse', ['$scope', 'EventingService', function ($scope, eventing) {
        //Controller logic here
}]);

这是我的单元测试-它是我尝试注入EventingService的行，在运行单元测试时会导致错误:

Here is my unit test - its the line where I attempt to inject the EventingService that causes an error when I run the unit test:

describe('Browse Controller Tests.', function () {
    beforeEach(function () {
        module('dashboard.services');
        module('dashboard.controllers');
    });

    var controller, scope, eventingService;

    beforeEach(inject(function ($controller, $rootScope, EventingService) {
        scope = $rootScope.$new();
        eventingService = EventingService

        controller = $controller('Browse', {
            $scope: scope,
            eventing: eventingService
        });
    }));


    it('Expect True to be True', function () {
        expect(true).toBe(true);
    });
});

运行测试时出现此错误:

When I run the test I get this error:

错误:未知提供程序:EventingServiceProvider<-EventingService

Error: Unknown provider: EventingServiceProvider <- EventingService

我确保我的茉莉花specrunner.html文件具有所有必需的源文件(这是一个Asp.Net MVC项目):

I have ensured that my jasmine specrunner.html file has all the necessary source files (this is an Asp.Net MVC project):

<!-- Include source files here... -->
@Scripts.Render("~/bundles/jquery")
<script type="text/javascript" src="@Url.Content("~/Scripts/angular.js")"></script>  
<script type="text/javascript" src="@Url.Content("~/Scripts/angular-mocks.js")"></script>                 

<script type="text/javascript" src="@Url.Content("~/App/scripts/app.js")"></script>                       <!-- Angular modules defined in here -->
<script type="text/javascript" src="@Url.Content("~/App/scripts/services/eventing.js")"></script>         <!-- My Eventing service defined here -->


<script type="text/javascript" src="@Url.Content("~/App/scripts/controllers/browse.js")"></script>        <!-- My Browse controller defined here -->

<!-- Include spec files here... -->
<script type="text/javascript" src="@Url.Content("~/App/tests/browse.js")"></script>                      <!-- The actual unit test here -->

我只是无法理解为什么Angular会因为抱怨我的EventingService而抛出此错误.我的控制器在运行时可以正常工作-只是在我尝试对其进行测试时，我遇到了一个错误，因此我对自己是否在模拟/注入中搞砸了感到好奇.

I just can not fathom why Angular is throwing this error complaining about my EventingService. My controller works fine at runtime - it's just when I try to test it that I am getting an error so I am curious as to whether I have screwed something up with the mocking/injection.

Angular在测试方面的帮助是垃圾，所以我目前很沮丧-任何人可以提供的任何帮助或建议都将不胜感激.谢谢.

The Angular help on testing is rubbish so I am stumped at present - any help or suggestions anyone can give would be very appreciated. Thanks.

推荐答案

我刚刚遇到了这个问题，并通过切换为显式使用$ injector获取服务来解决了这个问题:

I just ran into this and solved it by switching to getting the service using the $injector explicitly:

var EventingService, $rootScope;
beforeEach(inject(function($injector) {
  EventingService = $injector.get('EventingService');
  $rootScope = $injector.get('$rootScope');
}));

我希望我能告诉你为什么这样做以及为什么简单

I wish I could tell you why this works and why the simple

beforeEach(inject(function(EventingService) {   ....  }));

没有，但是我没有时间调查内部情况.始终最好使用一种编码风格并坚持下去.

does not, but I don't have the time to investigate the internals. Always best to use one coding style and stick to it.

这种样式更好，因为您在测试中使用的变量名称是服务的正确名称.但这有点冗长.

This style is better in that the name of the variable that you use in your tests is the correct name of the Service. But it is a bit verbose.

还有另一个棱角魔术功能，它使用诸如 $ rootScope 之类的奇怪变量名，但我不喜欢这种变量的外观.

There is another angular magic feature that uses strange variable names like $rootScope but I don't like the hacky look of that.

请注意，大多数情况下人们会收到此错误，因为他们不包括以下模块:

Note that the most of the time people get this error because they didn't include the modules:

beforeEach(module('capsuling'));
beforeEach(module('capsuling.capsules.services'));

这篇关于将服务注入Angular单元测试时出现Unknown Provider错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！