AngularJS에서 구성 단계를 테스트하는 장치

AngularJS에서 구성 단계를 테스트하는 장치

AngularJS의 유닛 테스트 작성법을 배우려고 합니다.저는 처음에 시작했습니다.

angular.module( ... ).config( ... )

내부 구성을 테스트하고 싶습니다.관련 부분은 다음과 같습니다.

angular.module('ogApp', ['ngCookies','ui.router','ogControllers','ogServices','ogDirectives','ogMetricsData'])

.config([
  '$stateProvider', '$locationProvider',
  function ($stateProvider, $locationProvider) {
    $stateProvider.
      state('login', {
        templateUrl: 'connect.html'
      }).state('addViews', {
        templateUrl: 'add-views.html'
      }).state('dashboard', {
        templateUrl: 'dashboard.html'
      });
    $locationProvider.
      html5Mode(true).
      hashPrefix('!');
  }
]);

이 코드를 테스트하는 가장 쉬운 방법은 모조품을 주입하는 것입니다.$stateProvider그리고.$locationProvider. 그런 다음 구성 단계를 실행합니다.그 다음에는 어떻게 주장합니다.$stateProvider그리고.$locationProvider그렇게 보여야 합니다.

제 생각이 맞다면 문제는 모듈에 해당 모의실험을 어떻게 주입하고 테스트에서 해당 모의실험의 구성 단계를 실행할 수 없다는 것입니다.

이 코드를 테스트하는 방법을 보여주시겠습니까?

장치 테스트를 위해 공급업체에 액세스하는 방법은 다음과 같습니다.

describe('yourProvider', function () {
    var provider;

    // Get the provider
    beforeEach(module('app', function (yourProvider) {
        // This callback is only called during instantiation
        provider = yourProvider;
    });

    // Kick off the above function
    beforeEach(inject(function () {}));

    it('does its thing', function () {
        expect(provider.someMethod()).toEqual('your results');
    });
});

저는 아직 모의실험을 하는 아주 간단한 방법을 생각해내지 못했지만, 여러분은 쉽게 그 방법들을 염탐할 수 있고, 그것은 충분히 가깝습니다.종속성 제공자의 .$get() 메서드에서 반환된 모의가 필요한 경우 다른 스파이와 함께 수행할 수도 있습니다.이 예에서는 모의를 반환하고 추가 스파이를 설정하는 방법을 보여 줍니다.

describe('yourProvider', function () {
    var dependency, mock, provider;

    beforeEach(module('app', function (dependencyProvider) {
        dependency = dependencyProvider;
        mock = jasmine.createSpyObj('dependency', [
            'methodsGoHere'
        ]);
        spyOn(dependency, 'methodName');
        spyOn(dependency, '$get').andReturn(mock);
    }, function (yourProvider) {
        provider = yourProvider;
    });

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

    it('does its thing', function () {
        expect(provider.someMethod()).toEqual('your results');
        expect(dependency.methodName).toHaveBeenCalled();
    });

    it('returns the mock from $get', function () {
        expect(dependency.$get).toBe(mock);
    });
});

자스민스를 사용하시면 됩니다. createSpy그리고.createSpyObj모의 서비스를 만드는 것과angular-mocks.js주사를 놓는 겁니다

모의실험에 대한 자세한 지침은 다음과 같습니다.모크를 각도에 주입하기JS서비스

제가 지시서를 작성한 이 테스트에서는 다음을 확인할 수 있습니다.

• 9행 Google cdn의 angular-mock 포함
• Line 19 & 20 가짜 rootScope 객체 생성
• 라인 21 & 22 가짜 q 서비스 생성
• 라인 42 서비스에 가짜를 주입하도록 공급자를 설정합니다.
• 라인 48 가짜가 있는 서비스 인스턴스화(이 서비스는 테스트 대상 지침에 주입됨)
• 53번 라인 테스트 중인 방법 호출
• 55번 선 - 59번 가짜의 상태에 대한 주장

기능을 가리키는 공장을 만들 겁니다그런 다음 해당 함수는 config 함수 내에서도 호출됩니다.이렇게 하면 공장을 단위 테스트할 수 있습니다.

angular.module('ogApp', ['ngCookies','ui.router','ogControllers','ogServices','ogDirectives','ogMetricsData']);

// Configuration factory for unit testing
angular.module('ogApp')
.factory('configuration', configuration);

configuration.$inject = ['$stateProvider', '$locationProvider'];

function configuration($stateProvider, $locationProvider) {
  return {
    applyConfig: function () {
      $stateProvider.
        state('login', {
          templateUrl: 'connect.html'
        }).state('addViews', {
          templateUrl: 'add-views.html'
        }).state('dashboard', {
          templateUrl: 'dashboard.html'
        });
      $locationProvider.
        html5Mode(true).
        hashPrefix('!');
    };
}

// Call above configuration function from Angular's config phase
angular.module('ogApp')
.config([
  '$stateProvider', '$locationProvider',
  function ($stateProvider, $locationProvider) {
    var config = configuration($stateProvider, $locationProvider);
    config.applyConfig();
  }
]);

다른 공장과 마찬가지로 구성 공장을 단위 테스트하고 모의 주입을 할 수 있습니다.

언급URL : https://stackoverflow.com/questions/18983280/unit-testing-the-config-phase-in-angularjs