2017-12-18 4 views
0

ich diesen Mocha Test haben:Anwendungsbereich Methode in AngularJS Richtlinie ist keine Funktion, wenn Unit-Tests

'use strict'; 

/////////////////////////////////// 

describe('all admin page directives', function() { 

    let scope, $compile, element, tmp; 
    beforeEach(module('app')); 
    beforeEach(module('templates')); 

    afterEach(function() { 
    scope.$destroy(); 
    }); 

    describe('category', function() { 

    beforeEach(inject(function ($injector) { 
     $compile = $injector.get('$compile'); 
     var $rootScope = $injector.get('$rootScope'); 
     scope = $rootScope.$new(); 
     scope.rightSidebarData = {}; 
     $compile('<create-category right-sidebar-data="rightSidebarData"></create-category>')(scope); 
     return scope.$digest(); 
    })); 

    it('should do something', function() { 
     scope.updateModel();   //  <<<<<< ERROR HERE 
    }); 


    }); 

}); 

hier ist meine Richtlinie:

/* globals angular */ 

angular.module('app').directive('createCategory', 

    ['UserService', 'AssignmentService', 'NotificationService', 'USER', 'UserInfoService', 'AlertService', '$window', 

    function (UserService, AssignmentService, NotificationService, USER, UserInfoService, AlertService, $window) { 

     return { 

     scope: { 
      rightSidebarData: '=', 
     }, 

     restrict: 'EA', 
     templateUrl: "pages/admin/views/templates/category/create-category.html", 

     link: function ($scope, el, attrs) { 

      $scope.rightSidebarData.setOrReset = function() { 
      $scope.setOrReset(); 
      }; 

     }, 

     controller: function ($scope, FUNCTIONAL_TEAM_ENUM, CATEGORY_ENUM, CategoryService) { 

      const rsd = $scope.rsd = $scope.rightSidebarData; 

      $scope.setOrReset = function() {...}; 

      $scope.updateModel = function() {...}; 

      $scope.saveModel = function() {...}; 

     }, 
     }; 
    } 
    ]); 

Ich erhalte diese Fehlermeldung:

TypeError: scope.updateModel is not a function

Weiß jemand, was ich in meinem Test tun muss, um das zu beheben? Woher weiß ich außerdem, ob ich $rootScope.$new() verwenden muss oder ob ich den Geltungsbereich des übergeordneten Controllers bestehen soll?

+1

Die $ kompilieren Service einen neuen Isolat Rahmen für das schafft ' create-category'-Direktive. Also ist die Funktion 'updateModel' diesem untergeordneten Bereich zugeordnet; nicht der Root-Bereich. – georgeawg

+0

danke, das macht Sinn, wie greife ich auf den Kindbereich zu? etwas wie 'getIsolateScope()' richtig? –

+0

Siehe [angular.element API-Referenz] (https://docs.angularjs.org/api/ng/function/angular.element). – georgeawg

Antwort

0

ich eine andere Präprozessor in meinem Karma config-Datei hinzuzufügen hatte:

preprocessors: { 
    './public/pages/**/views/**/*.html':['ng-html2js'], // this 
}, 

und dann unter Verwendung der folgenden, es funktionierte:

'use strict';  
describe('all admin page directives', function() { 

    let scope, el, tmp, isoScope; 

    beforeEach(module('app')); 
    beforeEach(module('ngMockE2E')); 
    beforeEach(module('templates')); 

    afterEach(function() { 
    scope.$destroy(); 
    }); 

    describe('category', function() { 

    beforeEach(inject(function ($injector) { 
     const $compile = $injector.get('$compile'); 
     const $rootScope = $injector.get('$rootScope'); 
     const $templateCache = $injector.get('$templateCache'); 
     console.log('create category template =>', $templateCache.get('pages/admin/views/templates/category/create-category.html')); 

     scope = $rootScope.$new(); 
     scope.rightSidebarData = {}; 
     scope.rightSidebarData.model = {}; 
     let element = angular.element(`<create-category right-sidebar-data="rightSidebarData"></create-category>`); 
     el = $compile(element)(scope); 
     $rootScope.$digest(); 
     scope.$digest(); 
     el.isolateScope().setOrReset(); 
    })); 

    it('should do something', function() { 
     el.isolateScope().updateModel(); 
    }); 

    }); 

}); 
Verwandte Themen