Единица испытания в угловой привязки директивы с templateUrl

Question

Я пытаюсь проверить блок привязки данных в очень простой угловой директивы:

Директива

<uri></uri> 

.directive('uri', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'views/partials/directives/uri.html', 
     transclude: false, 
     replace: false, 
     scope: false, 
     controller: function ($scope) { 
      $scope.uri = null; 
     } 
    }; 
}); 

Шаблон

<h2>url</h2> 
<input type="text" placeholder="{{uri}}" class="form-control" ng-readonly="true"> 

Test Unit

describe('Directive: uri', function() { 

    // we declare some global vars to be used in the tests 
    var elem, 
     scope, 
     $compile, 
     directive = angular.element('<uri></uri>'), 
     template = 'views/partials/directives/uri.html'; 

    // load the module/template we want to test 
    beforeEach(module('app', template)); 

    // before each test, creates a fresh scope 
    beforeEach(inject(function ($rootScope, _$compile_, $templateCache) { 
     //assign the template to the expected url called by the directive and put it in the cache 
     var tplCache = $templateCache.get(template); 
     $templateCache.put(template, tplCache); 
     console.log(tplCache); 

     scope = $rootScope.$new(); 
     $compile = _$compile_; 
    })); 

    function compileDirective() { 
     //create the element with the directive template 
     elem = $compile(directive)(scope); 
     scope.$digest(); 
    } 

    it('should set the input value to the scope.uri value', function() { 
     // add uri to scope 
     var uri = 'test-uri'; 
     scope.uri = uri; 
     // then produce our directive using it 
     console.log(scope.uri); 
     compileDirective(); 
     console.log(scope.uri); 
     console.log(elem); 
     // this should impact the input value value 
     var templateAsHtml = elem.html(); 
     expect(templateAsHtml).toContain(scope.uri); 
    }); 
}); 

ШаблонCache кэширует шаблон. Элемент скомпилирован по объему с помощью прилагаемой директивы. Но как-то свойство uri не связано с моей директивой. . Кроме того, после того, как объем $ переваривать() scope.uri равна нулю ... Результаты

тест Карма

LOG: '<h2>url</h2> 
<input type="text" class="form-control" placeholder="{{uri}}" ng-readonly="true">' 
LOG: 'test-uri' 
LOG: null 
LOG: Object{0: <uri class="ng-scope"><h2>url</h2> 
<input type="text" class="form-control" placeholder="" ng-readonly="true" readonly="readonly"></uri>, length: 1} 

PhantomJS 1.9.7 (Mac OS X) Directive: uri should set the input value to the scope.uri value FAILED 
    Expected '<h2>url</h2> 
    <input type="text" class="form-control" placeholder="" ng-readonly="true" readonly="readonly">' to contain null. 

PhantomJS 1.9.7 (Mac OS X): Executed 6 of 6 (1 FAILED) (0.03 secs/0.026 secs) 

Warning: Task "karma:unit" failed. Use --force to continue. 

Aborted due to warnings. 

Answer 1

Для полноты: Моя директива инициализирует с $ scope.uri = нуль. Это перезаписывает мой тест в цикле дайджеста.

Директива:

.directive('uri', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'views/partials/directives/uri.html', 
     transclude: false, 
     replace: false, 
     scope: false, 
     controller: function ($scope) { 
      $scope.uri = null; 
     } 
    }; 
}); 

Фиксированный тест блок с повторно применяя новое значение объема:

it('should set the input value to the scope.uri value', function() { 
    // produce our directive 
    compileDirective(); 
    // add uri to scope 
    var uri = 'test-uri'; 
    scope.uri = uri; 
    scope.$digest(); 
    // check the html 
    var templateAsHtml = elem.html(); 
    expect(templateAsHtml).toContain(uri); 
});