Ошибка при использовании ng-model в директиве angular при выполнении модульного теста

#javascript #angularjs #unit-testing

#javascript #angularjs #модульное тестирование

Вопрос:

Позвольте мне быть немного более конкретным. Рабочий код работает очень хорошо (никаких ошибок или исключений в консоли). Однако, когда я пытаюсь выполнить тестирование, это работает не очень хорошо.

Это соответствующая часть моего шаблона директивы:

 <form ng-if="totalOrganizations > numOrganizationsForSearch" class="search">
            <input type="text" class="form-control" placeholder="Search for..." ng-model="searchText"/>
        </form>
  

Соответствующий фрагмент моей директивы angular:

 module.exports = function portalSwitcher($state, $window) {
    return {
        restrict: 'E',
        replace: true,
        scope: {},
        template: template,
        link: function(scope, element) {
            scope.totalOrganizations = 0;
            scope.searchText = "";

       // more code here
  

Вероятно, я что-то упускаю в своем тестировании. Тесты работают хорошо, если условие ng-if="totalOrganizations > numOrganizationsForSearch" неверно, и поэтому оно не добавляет input поле в мою директиву DOM. Однако, когда это условие выполняется, мои тесты завершаются с ошибкой, подобной этой:

 TypeError: document.createElement is not a function
        at Object.hasEvent (dist/d16cd293c8e995aad0be/vendor.js:22558:34)
        at baseInputType (dist/d16cd293c8e995aad0be/vendor.js:26751:17)
        at textInputType (dist/d16cd293c8e995aad0be/vendor.js:26702:4)
        at pre (dist/d16cd293c8e995aad0be/vendor.js:27292:63)
        at invokeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:13719:10)
        at nodeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:13192:12)
        at compositeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:12609:14)
        at nodeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:13208:25)
        at compositeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:12609:14)
        at publicLinkFn (dist/d16cd293c8e995aad0be/vendor.js:12489:31)
    Error: Declaration Location
        at window.inject.angular.mock.inject (node_modules/angular-mocks/angular-mocks.js:2488:25)
        at Suite.<anonymous> (spec/shared/portalSwitcher.spec.js:168:24)
  

Оказывается, если я удалю ng-model атрибут из своего input , я вообще не получу эту ошибку. Итак, я начал просматривать код angular и обнаружил, где происходит сбой кода:

https://github.com/angular/angular.js/blob/v1.4.9/src/ng/sniffer.js#L34

 function $SnifferProvider() {
          this.$get = ['$window', '$document', function($window, $document) {
            var eventSupport = {},
                android =
                  toInt((/android (d )/.exec(lowercase(($window.navigator || {}).userAgent)) || [])[1]),
                boxee = /Boxee/i.test(($window.navigator || {}).userAgent),
                document = $document[0] || {}, //$document[0] is just an empty object here

            //more code...

if (isUndefined(eventSupport[event])) {
                  var divElm = document.createElement('div'); //exception line. document object is empty and therefore doesn't have createElement function
                  eventSupport[event] = 'on'   event in divElm;
                }
  

Кажется, по какой-то странной причине $document[0] объект пуст. При чтении кода кажется, что этого не должно быть. Я предполагаю, что некоторые настройки моего теста неверны (это мой первый тест директивы). Соответствующий код находится здесь:

     beforeEach(module('app.shared', function($provide) {
            $provide.value('Service1', Service1);
            //other dependencies
        }));

   beforeEach(function() {
      //setup that makes the condition above return true
      //and add ng-model to DOM.
   });

   beforeEach(inject(function($compile, $rootScope) { //it fails at this line
                elm = $compile('<portal-switcher />')($rootScope.$new());
                scope = elm.isolateScope();

                scope.listPortals();
                scope.$digest();
            }));
  

Я пытался исправить это, предоставляя $document в моем тесте document объект из моего теста (который не является пустым объектом и содержит createElement функцию), но все та же ошибка.

Я не смог найти ни одной подобной ошибки в Duckduckgo или Google.

Я использую angular 1.4.9, angular также издевается над 1.4.9. Я не думаю, что проблема связана с версиями, хотя я не смог найти никаких проблем в репозитории angular github по этому поводу.

Приветствуется любая помощь.