테스트 지시문, dom 조작이 발생하지 않음 - Angularjs/jasmine

Question

지시문에 대한 첫 번째 테스트를 실행하고 있는데 지시문이 호출되는 동안 (지시문의 템플릿 URL에 대해 GET 요청이 있음) 링크 함수에서 발생하기로되어있는 DOM 조작은 그렇지 않습니다. 그렇지 않으면 올바르게 테스트하지 않을 것입니다.

// Generated by CoffeeScript 1.6.3 
(function() { 
    var sprangularDirectives; 

    sprangularDirectives = angular.module('sprangularDirectives', []); 

    sprangularDirectives.directive('productDirective', function() { 
    return { 
     scope: { 
     product: '=' 
     }, 
     templateUrl: 'partials/product/_product.html', 
     link: function(scope, el, attrs) { 
     return el.attr('testattr', 'isthisclasshere'); 
     } 
    }; 
    }); 

}).call(this); 

테스트 : I가 브라우저를 부팅 할 때 거기에도 불구하고 ... 정의되지 않은

'use strict'; 

describe('productDirective', function() { 

    var scope, el, directive, $httpBackend, compiler, compiled, html; 

    beforeEach(angular.mock.module('sprangularApp')); 

    beforeEach(function() { 

     html = '<div data-product-directive product="currentProduct"></div>'; 

     inject(function($injector) { 
      $httpBackend = $injector.get('$httpBackend'); 

      // jasmine.getHTMLFixtures().fixturesPath='base/partials/product'; 

      $httpBackend.when('GET', 'partials/product/_product.html').respond(
       ' <div class="product">' 
       +'  {{ currentProduct.name }}' 
       +'  {{ currentProduct.page }}' 
       +' </div>' 
      ); 

      scope = $injector.get('$rootScope'); 

      el = angular.element(html); 

      compiler = $injector.get('$compile'); 
      compiled = compiler(el); 
      compiled(scope); 

      scope.$digest(); 
     }); 

    }); 

    it('Should have an isolate scope', function() { 
     scope.currentProduct = {name: 'testing'}; 

     console.log(el.attr('testattr')) 
     console.log(el.isolateScope()) 
     expect(el.scope().product.name).toBe('testing'); 
    }); 
}); 

console.log(el.attr('testattr')) 돌아갑니다. 몇 가지 도움이 될 것입니다 :) 감사합니다

Answer 1

요소는 사전 컴파일 된 요소 참조입니다. 당신이 원하는 요소는 "컴파일 (범위)"메서드 호출에서 반환됩니다

var compileTemplate = function (scope, rawTemplate) { 
    var template = angular.element(rawTemplate) 
    var element = $compile(template)(scope) 
    scope.$digest() 
    var new_scope = element.scope() 
    return [element, new_scope] 
} 

:

compiler = $injector.get('$compile'); 
compiled = compiler(el); 
var element = compiled(scope);  // <-- This guy! 

내가 테스트 도우미 방법으로이 코드 조각을 사용하여