Nhận lỗi nhà cung cấp không xác định khi tiêm Dịch vụ vào thử nghiệm đơn vị góc

Question

Tôi khá mới đối với Angular và đã xem xét tất cả các câu hỏi liên quan tương tự trên Stack Overflow nhưng không có gì giúp tôi. Tôi tin rằng tôi có mọi thứ được thiết lập chính xác nhưng vẫn gặp phải lỗi 'Nhà cung cấp không xác định' khi cố gắng đưa dịch vụ vào thử nghiệm đơn vị. Tôi đã đặt ra mã của tôi dưới đây - hy vọng ai đó có thể phát hiện ra một lỗi rõ ràng!

tôi xác định mô đun của tôi trong một riêng biệt .js tập tin như thế này:

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

Đây là nơi tôi định nghĩa một dịch vụ gọi là EventingService (với logic loại bỏ cho ngắn gọn):

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

Đây là bộ điều khiển của tôi sử dụng EventingService (tất cả điều này hoạt động tốt khi chạy):

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

Dưới đây là bài kiểm tra đơn vị của tôi - dòng của nó, nơi tôi cố gắng để tiêm EventingService mà gây ra một lỗi khi tôi chạy thử nghiệm đơn vị:

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); 
    }); 
}); 

Khi tôi chạy thử nghiệm tôi nhận được lỗi này:

Error: Unknown provider: EventingServiceProvider <- EventingService

tôi đã đảm bảo rằng tập tin specrunner.html hoa nhài của tôi có tất cả các file nguồn cần thiết (điều này là một dự án Asp.Net MVC):

<!-- 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 --> 

tôi chỉ c không phải là lý do tại sao Angular là ném lỗi này phàn nàn về EventingService của tôi. Bộ điều khiển của tôi hoạt động tốt trong thời gian chạy - đó là khi tôi thử kiểm tra xem tôi có gặp lỗi không, vì vậy tôi tò mò muốn biết liệu tôi có làm hỏng thứ gì đó với việc nhại/tiêm hay không.

Trợ giúp về góc khi thử nghiệm là rác nên hiện tại tôi đang bối rối - bất kỳ trợ giúp hoặc đề xuất nào mà bất kỳ ai có thể đưa ra đều sẽ rất được đánh giá cao. Cảm ơn.

Answer 1

Nếu bộ điều khiển của bạn (được định nghĩa dưới dashboard.controllers mô-đun) phụ thuộc vào một số dịch vụ được kèm theo trong mô-đun khác nhau (dashboard.services) hơn bạn cần phải tham khảo các module phụ thuộc trong mô-đun chữ ký của bạn:

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

Answer 2

Bạn đã cố gắng xác định một thành phần phụ mà phụ thuộc vào module tổng hợp khác của bạn như vậy:

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

vì vậy, bạn có thể trong beforeEach xác định một mô-đun có cả submodules quy định tại nó như vậy:

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

    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); 
    }); 
}); 

Answer 3

Tôi chỉ chạy vào này và giải quyết nó bằng cách chuyển sang nhận được dịch vụ bằng cách sử dụng $ phun một cách rõ ràng:

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

Tôi ước gì có thể cho bạn biết lý do tại sao các công trình này và tại sao đơn giản

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

không, nhưng tôi không có thời gian để điều tra nội bộ. Luôn luôn tốt nhất để sử dụng một phong cách mã hóa và dính vào nó.

Kiểu này tốt hơn là tên của biến mà bạn sử dụng trong các thử nghiệm là tên chính xác của Dịch vụ. Nhưng đó là một chút tiết.

Có một tính năng ma thuật góc khác sử dụng các tên biến lạ như $ rootScope nhưng tôi không thích cái nhìn bẻ khóa đó.

Lưu ý rằng hầu hết những người thời gian nhận được lỗi này vì họ không bao gồm các phân hệ:

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

Answer 4

Trong khi câu hỏi này là khá cũ tôi mất thời gian đáng kể giải quyết một vấn đề tương tự như thế này, tức là :

Error: Unknown provider: SomeServiceProvider <- SomeService 

Do đó, tôi đang rời khỏi đây một nguyên nhân khác có thể gây ra sự cố này. Hy vọng rằng, nó sẽ hữu ích cho ai đó.

Trong trường hợp của tôi, tôi đã có trong dự án của tôi hai mô-đun với tên chính xác tương tự nhưng với phụ thuộc khác nhau được tạo ra, ví dụ, hai .js file khác nhau với:

angular.module('moduleName', [dependencies])) 

Từ tài liệu góc:

Passing one argument retrieves an existing angular.Module, whereas passing more than one argument creates a new angular.Module

Kết luận: Nó chỉ ra rằng những gì đã được tiêm trong thử nghiệm là các mô-đun với các phụ thuộc sai. Loại bỏ đối số thứ hai khỏi mô-đun đã được tạo ra một cách sai lầm đã giải quyết được vấn đề.