2013-03-13 30 views
10

Tôi cần kiểm tra nhà cung cấp góc của riêng mình và tôi cần kiểm tra nó trong cả cấu hình và giai đoạn chạy để kiểm tra xem các phương thức cấu hình có hoạt động hay không và nhà cung cấp đã thực sự được cấu hình với các tham số chính xác.Tôi có thể kiểm tra nhà cung cấp AngularJS bằng cách nào?

Khi tôi yêu cầu tiêm phụ thuộc cho nhà cung cấp, nó không thể tìm thấy APIResourceFactoryProvider, chỉ APIResourceFactory, và tôi không tìm thấy bất kỳ ví dụ nào về kho này mà tôi đã xem xét cho đến nay.

Trả lời

20

Nó thực sự đơn giản hơn rất nhiều so với nó sẽ có vẻ lúc đầu để kiểm tra một nhà cung cấp trong AngularJS:

describe('Testing a provider', function() { 
    var provider; 

    beforeEach(module('plunker', function(myServiceProvider) { 
     provider = myServiceProvider; 
    })); 

    it('should return true on method call', inject(function() { 
    expect(provider.method()).toBeTruthy(); 
    })); 
}); 

`` `

Bằng chứng là trong Plunker: http://plnkr.co/edit/UkltiSG8sW7ICb9YBZSH

+0

Tính năng này hoạt động như thế nào mà không có bất kỳ lệnh gọi 'tiêm' nào? Tôi thấy rằng tôi đã phải làm theo các 'module()' gọi với 'inject()' – Merott

+0

Các tiêm kết thúc tốt đẹp các thử nghiệm (trong nó (...) tuyên bố) –

+0

"Bằng chứng là trong Plunker" Nó didn ' t làm việc, nhưng đã ném rất nhiều lỗi phụ thuộc. – LeeGee

0

ở đây là một người trợ giúp nhỏ đóng gói đúng cách các nhà cung cấp tìm nạp, do đó đảm bảo cách ly giữa các thử nghiệm riêng lẻ:

/** 
    * @description request a provider by name. 
    * IMPORTANT NOTE: 
    * 1) this function must be called before any calls to 'inject', 
    * because it itself calls 'module'. 
    * 2) the returned function must be called after any calls to 'module', 
    * because it itself calls 'inject'. 
    * @param {string} moduleName 
    * @param {string} providerName 
    * @returns {function} that returns the requested provider by calling 'inject' 
    * usage examples: 
    it('fetches a Provider in a "module" step and an "inject" step', 
     function() { 
     // 'module' step, no calls to 'inject' before this 
     var getProvider = 
     providerGetter('module.containing.provider', 'RequestedProvider'); 
     // 'inject' step, no calls to 'module' after this 
     var requestedProvider = getProvider(); 
     // done! 
     expect(requestedProvider.$get).toBeDefined(); 
    }); 
    * 
    it('also fetches a Provider in a single step', function() { 
     var requestedProvider = 
     providerGetter('module.containing.provider', 'RequestedProvider')(); 

     expect(requestedProvider.$get).toBeDefined(); 
    }); 
    */ 
    function providerGetter(moduleName, providerName) { 
    var provider; 
    module(moduleName, 
      [providerName, function(Provider) { provider = Provider; }]); 
    return function() { inject(); return provider; }; // inject calls the above 
    } 
  • quy trình tìm nạp nhà cung cấp được đóng gói hoàn toàn: không cần biến đóng cửa thỏa hiệp sự cách ly giữa các lần kiểm tra.
  • quy trình có thể được chia thành hai bước, bước 'mô-đun' và bước 'tiêm', có thể được nhóm thích hợp với các cuộc gọi khác thành 'mô-đun' và 'tiêm' trong thử nghiệm đơn vị.
  • nếu không cần chia nhỏ, việc truy xuất nhà cung cấp có thể được thực hiện đơn giản chỉ bằng một lệnh!
1

Chỉ trong trường hợp bạn muốn có một phiên bản rút gọn của nhà cung cấp, mọi thứ trở nên phức tạp hơn một chút.

Đây là mã nhà cung cấp:

angular 
    .module('core.services') 
    .provider('storageService', [function() { 
     function isLocalStorageEnabled(window) { 
      return true; 
     } 

     this.$get = ['$window', 'chromeStorageService', 'html5StorageService', 
      function($window, chromeStorageService, html5StorageService) { 
      return isLocalStorageEnabled($window) ? html5StorageService : chromeStorageService; 
     }]; 
    }]); 

Các trường hợp thử nghiệm:

describe('Storage.Provider', function() { 
    var chrome = {engine: 'chrome'}; 
    var html5 = {engine: 'html5'}; 
    var storageService, provider; 

    beforeEach(module('core.services')); 
    beforeEach(function() { 
     module(function (storageServiceProvider) { 
      provider = storageServiceProvider; 
     }); 
    }); 
    beforeEach(angular.mock.module(function($provide) { 
     $provide.value('html5StorageService', html5); 
     $provide.value('chromeStorageService', chrome); 
    })); 

    // the trick is here 
    beforeEach(inject(function($injector) { 
     storageService = $injector.invoke(provider.$get); 
    })); 

    it('should return Html5 storage service being run in a usual browser', function() { 
     expect(storageService).toBe(html5); 
    }); 
}); 

Trong trường hợp này $ get là một mảng và bạn không thể chỉ gọi nó như là một chức năng thông thường cung cấp phụ thuộc làm đối số. Giải pháp là sử dụng $ injector.invoke().

Điều kỳ lạ là hầu hết các hướng dẫn và mẫu đều bỏ sót chi tiết này.

Các vấn đề liên quan