茉莉花TypeScript測試角

我想爲我的應用程序在Type Script中編寫一些Angular Controller測試幾天，沒有任何成功。在我開始之前，我想提一提，這是我第一次寫作測試我茉莉花。我的問題是，我不能嘲笑依賴服務，以測試控制器。任何幫助或指向正確的方向將是很好的。茉莉花TypeScript測試角

角模塊：

angular.module('some.module', ['ui.router', 'ngAnimate', 'ui.bootstrap', 'pascalprecht.translate', 'ngCookies', 'smart-table']);

角控制器：

module App.Controllers { 

export class TestController{ 
    static $inject = ["$scope","SomeService"]; 
    WhatController:() => string; 
    constructor(private $scope: App.IAppScope, private SomeService) { 
     var vm = this; 
     vm.WhatController = function(): string { 
      return SomeService.someAction(); 
     }; 
    } 
} 

angular.module("some.module").controller("TestController", TestController);

}

角服務：

module App.Services { 

export class SomeService{ 
    httpService: ng.IHttpService; 
    static $inject = ["$http"]; 
    someAction:() => any; 

    constructor($http: ng.IHttpService) { 
     var service = this; 
     service.someAction=() => { 
      return "test"; 
     } 
    } 
} 

factory.$inject = ['$http']; 
function factory($http: ng.IHttpService) { 
    return new SomeService($http); 
} 

angular.module('some.module').factory('SomeService', factory);

}

噶文件：

module.exports = function (config) { 
    config.set({ 
     basePath: 'Scripts', 
     frameworks: ['jasmine', 'jasmine-matchers'], 
     files: [ 

      { pattern: 'angular.js', included: true }, 
      { pattern: 'angular-mocks.js', included: true }, 
      { pattern: 'angular-ui-router.js', included: true }, 
      { pattern: 'angular-ui/ui-bootstrap-tpls.js', included: true }, 
      { pattern: 'angular-animate.js', included: true }, 
      { pattern: 'angular-translate.js', included: true }, 
      { pattern: 'angular-translate-loader-url.js', included: true }, 
      { pattern: 'angular-cookies.js', included: true }, 
      { pattern: 'smart-table.js', included: true }, 

      '../app/app.module.js', 
      '../app/pages/**/*.controller.js', 

      //Here are controller files 
      { pattern: '../app/pages/**/*.spec.js', included: true }, 

     ], 
     exclude: ['**/*min.js'], 
     preprocessors: { 
      '../app/pages/**/*.controller.js': ['coverage'], 
     }, 

     reporters: ['progress', 'coverage'], 
     port: 9876, 
     colors: true, 
     logLevel: config.LOG_INFO, 
     autoWatch: true, 
     browsers: ['PhantomJS'], 
     singleRun: true, 

     coverageReporter: { 
     type : 'html', 
     dir : 'coverage/' 
    } 
    }) 
}

測試：

'use strict'; 
describe("complaints.controller.test",() => { 
    var $http: ng.IHttpService; 
    var mockSomeServices: App.Services.SomeServices; 
    var mock = angular.mock; 


    beforeEach(() => { 
     mock.module('ui.router'); 
     mock.module('ngAnimate'); 
     mock.module('ui.bootstrap'); 
     mock.module('pascalprecht.translate'); 
     mock.module('ngCookies'); 
     mock.module('smart-table'); 
     }); 

    //This don't work mockSomeServices is undefined 
    beforeEach(mock.inject((_$http_, $injector) => { 
     $http = _$http_; 
     mockSomeServices = $injector.get('SomeServices'); 
    })); 

    //This also don't work mockSomeServices is undefined 
    beforeEach(mock.inject((_$http_, $injector, SomeServices) => { 
     $http = _$http_; 
     mockSomeServices = SomeServices; 
    })); 
});

來源

2016-04-28 Lukasz Ożóg

如果你想嘲笑服務，你這樣做是這樣的：

angular.mock.module(($provide: ng.auto.IProvideService): void => { 
    $provide.constant("SomeService", SomeService = { }); 
});

在你的控制，我不你以爲你想嘲笑你的服務。你想知道它被調用了，你可以通過在你的服務中加入間諜來做到這一點。

spyOn(SomeService, "someAction");

如果你希望它返回一些數據使用/控制器驗證，你可以這樣做：

spyOn(SomeService, "someAction").and.returnValue(/* data */);

然後你斷言它被調用和數據是你所期望的：

expect(SomeService.someAction).toHaveBeenCalled(); 
expect(yourController.someValue).toEqual("someValue");

來源

2016-08-25 21:55:16 Yatrix

茉莉花TypeScript測試角

回答

相關問題