다른 지시문에 의존하는 지시문 테스트 - Angularjs

Question

다른 지시문을 포함하는 지시문이 있습니다. 여기

<div class="chat-container"> 
<h5 class="chat-header"> 
    <span class="patient-name-container">{{encounter.patient.firstName }} {{encounter.patient.lastName}}</span></h5> 
    <div ng-show="showMessages"> 
    <div messages-container messages="encounter.comments"></div> 
    </div> 
</div> 

그리고 내 테스트입니다 : :

이

var element; 
    beforeEach(module('app/views/chat.container.html')); 
    beforeEach(inject(function($templateCache, $compile, $rootScope) { 
    var chatTemplate = $templateCache.get('app/views/chat.container.html'); 
    $templateCache.put('views/chat.container.html', chatTemplate); 

    var directive = angular.element('<div chat-container max-chat-count="800" class="pull-left"></div>'); 
    element = $compile(directive)($rootScope); 
    $rootScope.$digest(); 
    })); 

    it('the remaining count to be 800', function() { 
    expect(element.find('#counter').text()).toBe('800'); 
    }); 
}); 

내 오류가 Error: Unexpected request: GET views/messages.container.html입니다 여기 지시어이다. messages-container 지시문을 만들려면 html을 찾고 있지만 찾을 수 없습니다. 첫 번째 질문 바로 뒤에 다른 지시문을 추가하려고 시도했습니다.

var messagesTemplate = $templateCache.get('app/views/messages.container.html'); 
$templateCache.put('views/messages.container.html', messagesTemplate); 

그러나 여전히 동일한 오류가 발생하므로 2 가지 질문이 있습니다. 먼저 어떻게 테스트합니까? 둘째 - 다른 지시문에 의존하여 테스트를 만들고 있습니다. 어떻게 처리해야할까요?

Answer 1

내가 액세스하려고 시도하기 전에 module 기능이있는 템플릿을 추가하지 않은 것이 문제였습니다.

var element, scope; 
    beforeEach(module('app/views/chat.container.html')); 
* beforeEach(module('app/views/messages.container.html')); 
    beforeEach(inject(function($templateCache, $compile, $rootScope) { 
    var chatTemplate = $templateCache.get('app/views/chat.container.html'); 
    $templateCache.put('views/chat.container.html', chatTemplate); 
    var messagesTemplate = $templateCache.get('app/views/messages.container.html'); 
    $templateCache.put('views/messages.container.html', messagesTemplate); 
    var directive = angular.element('<div chat-container max-chat-count="800" class="pull-left"></div>'); 
    element = $compile(directive)($rootScope); 
    $rootScope.$digest(); 
    scope = $rootScope; 
    })); 

내가 이전 *으로 라인을 가지고 있지 않았다 다음은 문제를 해결 코드입니다. 이제 모든 것이 완벽하게 작동합니다.