Установка для директивы в AngularJs

Question

Ошибка при тестировании директивы в AngularJs:

INDEX_SIZE_ERR: INDEX_SIZE_ERR: DOM Exception 1 (line 14925)
Error: INDEX_SIZE_ERR: DOM Exception 1

Код:

beforeEach(inject(function(_$rootScope_, _$compile_) { 
    $rootScope = _$rootScope_; 
    $compile = _$compile_; 
    $scope = $rootScope.$new(); 
    $scope.size = 100; 
    $scope.currentBenchmark = { id : '' }; 
    elem = angular.element('<pub-toolbar></pub-toolbar>'); 
    elem = $compile(elem)($scope); 
    $scope.$digest(); 
})); 

describe('Testing for watches', function() { 

    it('currentBenchmark.id ', function() { 
     expect(true).toBe(true); 
    }); 
}); 

Это HTML-страница:

<tf-toolbar tf-theme="carbon" id="app-toolbar"> 
    <div > 
    <tf-progress-indicator progress='"indeterminate"' size="small" style="position:relative; top:3px " ></tf-progress-indicator> 
    </div> 
    <div > 
    <tf-progress-indicator progress='"indeterminate"' size="small" style="position:relative; top:3px " ></tf-progress-indicator> 
    </div> 
</tf-toolbar> 

After removing tf-progress-indicator from the html it is working fine.

ДИРЕКТИВА код:

(function() { 
    'use strict'; 

    function pubToolbarDrct(pubReportState, pubGetSanitizedDate, pubDateUtils){ 
     return { 
      restrict: 'E', 
      templateUrl: 'drcts/toolbar/templates/pub-toolbar.html', 
      controller: 'pubToolbarCtrl', 
      link: function(scope, element) { 
       scope.$watch('currentPortfolio.id', function(query, oldQuery) { 
        if (!query) { 
         scope.pubReportState.selectedPortfolio = { 
          description:'', 
          eMethodology:0, 
          gui_path:'', 
          id:'' 
         }; 
         return; 
        } 
        scope.pubReportState.setPortfolio(scope.currentPortfolio); 
        if (scope.currentPortfolio.benchmark && scope.currentPortfolio.benchmark.id) { 
         pubReportState.setBenchmark(scope.currentPortfolio.benchmark); 
         scope.currentBenchmark.id = scope.pubReportState.selectedBenchmark.value; 
        } 
       }); 

      } // end link function 
     }; 
    } 
    angular.module('pubApp').directive('pubToolbar', pubToolbarDrct); 
})(); 

Спасибо.

Answer 1

Это действительно смешно, я отвечаю на свой вопрос. ошибка была брошена из-за директивы

<tf-progress-indicator progress='"indeterminate"' size="small" style="position:relative; top:3px " ></tf-progress-indicator> 

, потому что он требует GIF-изображения. Просто немного взломать. Поскольку мы тестируем панель инструментов pub, мы можем высмеивать директиву индикатора tf-progress-indicator, чтобы он никогда не вызывался.

Код ниже издеваться на direcitve:

beforeEach(module('yourModule', function($compileProvider) { 
     $compileProvider.directive('nameOfDirectiveToMock', function() { 
      var def = { 
       priority: 100, 
       terminal: true, 
       restrict:'E', 
       template:'<div ></div>' 
      }; 
      return def; 
     }); 
    }));