Модульное тестирование директивы, которая определяет контроллер в AngularJS

Я пытаюсь проверить директиву, используя Карму и Жасмин, которые делают пару вещей. Во-первых, он использует templateUrl, а во-вторых, определяет контроллер. Возможно, это не правильная терминология, но она создает контроллер в своем объявлении. Приложение Angular настроено таким образом, чтобы каждый модуль содержался в своем собственном модуле. Например, все директивы включены в модуль app.directive, все контроллеры содержатся в app.controller, а все сервисы содержатся в app.service и т. Д.

Чтобы усложнить ситуацию, контроллер, определяемый в этой директиве, имеет одну зависимость и содержит функцию, которая делает запрос $ http для установки значения в области $. Я знаю, что могу смоделировать эту зависимость, используя макет $ httpBackend для имитации вызова $ http и возврата соответствующего объекта для вызова этой функции. Я'мы делали это много раз на других модульных тестах, которые яМы создали, и довольно хорошо разбираемся в этой концепции.

Код ниже написан на CoffeeScript.

Вот моя директива:

    angular.module('app.directive')
      .directive 'exampleDirective', [() ->
        restrict: 'A'
        templateUrl: 'partials/view.html'
        scope: true
        controller: ['$scope', 'Service', ($scope, Service) ->
          $scope.model = {}
          $scope.model.value_one = 1

          # Call the dependency
          Service.getValue()
            .success (data) ->
              $scope.model.value_two = data
            .error ->
              $scope.model.value_two = 0
        ]
      ]

Вот служба зависимостей:

    angular.module("app.service")
      .factory 'Service', ['$http', ($http) ->

      getValue: () ->
        options.method = "GET"
        options.url = "example/fetch"

        $http _.defaults(options)

Вот мнение: я

    
      {{model.value_one}} {{model.value_two}}
    

Мы немного упростили это, поскольку моя цель - только понять, как подключить это, я могу взять это оттуда. Причина яЯ структурирую это таким образом, потому что я изначально не создавал это. Я'я работаю над написанием тестов для существующего проекта, и я неу него есть возможность настроить его любым другим способом. Я'Я сделал попытку написать тест, но не могу заставить его делать то, что я хочу.

Я хочу проверить, связаны ли значения с представлением, и, если возможно, также проверить, правильно ли контроллер создает значения.

Вот что яу нас есть:

    'use strict'

    describe "the exampleDirective Directive", ->

      beforeEach module("app.directive")
      beforeEach module("app/partials/view.html")

      ServiceMock = {
        getValue : () ->

        options.method = "GET"
        options.url = "example/fetch"

        $http _.defaults(options)
      }

     #use the mock instead of the service
     beforeEach module ($provide) ->
       $provide.value "Service", ServiceMock
       return

     $httpBackend = null
     scope = null
     elem = null

     beforeEach inject ($compile, $rootScope, $injector) ->

     # get httpBackend object
     $httpBackend = $injector.get("$httpBackend")
     $httpBackend.whenGET("example/fetch").respond(200, "it works")

     #set up the scope
     scope = $rootScope

     #create and compile directive
     elem = angular.element('')
     $compile(elem)(scope)
     scope.$digest()

Я нене знаю, насколько я близок, или это даже правильно. Я хочу быть в состоянии утверждать, что значения привязаны к представлению правильно. Я'мы использовали ВойтажинуПример установки html2js в моем файле karma.js, чтобы я мог получить представление. Я'Мы провели много исследований, чтобы найти ответ, но мне нужна помощь. Надеюсь, программист умнее, чем я, может указать мне правильное направление. Спасибо.

Ответы на вопрос(1)

Ваш ответ на вопрос