मैं निर्देश

Question

में यूनिट परीक्षण अलग-अलग क्षेत्र का परीक्षण कैसे कर सकता हूं, मैं एक साधारण निर्देश का परीक्षण करने की कोशिश कर रहा हूं लेकिन दायरे में चर हमेशा अनिर्धारित है।

निर्देशक एसआरसी कोड:

.directive('ratingButton', ['$rootScope', 


function($rootScope) { 
     return { 
      restrict: "E", 
      replace: true, 
      template: '<button type="button" class="btn btn-circle" ng-class="getRatingClass()"></button>', 
      scope: { 
       buttonRating: "=" 
      }, 
      link: function(scope, elem, attr) { 
       scope.getRatingClass = function() { 
        if (!scope.buttonRating) 
         return ''; 
        else if (scope.buttonRating.toUpperCase() === 'GREEN') 
         return 'btn-success'; 
        else if (scope.buttonRating.toUpperCase() === 'YELLOW') 
         return 'btn-warning warning-text'; 
        else if (scope.buttonRating.toUpperCase() === 'RED') 
         return 'btn-danger'; 
        else if (scope.buttonRating.toUpperCase() === 'BLUE') 
         return 'btn-info'; 
       } 
      } 
     }; 
    }]) 

टेस्ट:

describe('Form Directive: ratingButton', function() { 

    // load the controller's module 
    beforeEach(module('dashboardApp')); 

    var scope, 
     element; 

    // Initialize the controller and a mock scope 
    beforeEach(inject(function($compile, $rootScope) { 
     scope = $rootScope.$new(); 

     //set our view html. 
     element = angular.element('<rating-button button-rating="green"></rating-button>'); 
     $compile(element)(scope); 
     scope.$digest(); 
    })); 

    it('should return appropriate class based on rating', function() { 
     //console.log(element.isolateScope()); 
     expect(element.isolateScope().buttonRating).toBe('green'); 
     expect(element.isolateScope().getRatingClass()).toBe('btn-success'); 

    }); 

}); 

मैं एक और निर्देश इकाई परीक्षण मैं तत्व विशेषताओं के माध्यम से मूल्यों को पारित करके था में इसी तरह के कोड का इस्तेमाल किया और यह उम्मीद के रूप में काम किया। इस परीक्षण बटन के लिए हमेशा यह सुनिश्चित नहीं किया जाता है कि यहां से कहाँ जाना है (मैं जैस्मीन/कर्म के साथ काफी नया हूं)

कोई भी मदद महान होगी!

Answer 1

स्ट्रिंग green सेट करने के बजाय इसे परीक्षण के अपने स्टार्टअप में निर्देश तत्व संकलित करते समय दायरे पर सेट करें। अन्यथा यह दायरे के दायरे पर green नाम के साथ स्कोप संपत्ति के मूल्य की तलाश करेगा, और निश्चित रूप से आपके मामले में परिभाषित नहीं किया गया है।

यानी scope.buttonRating = 'green';

और

angular.element('<rating-button button-rating="buttonRating"></rating-button>')

प्रयास करें:

// Initialize the controller and a mock scope 
    beforeEach(inject(function($compile, $rootScope) { 
     scope = $rootScope.$new(); 
     scope.buttonRating = 'green'; //<-- Here 
     //set our view html. 
     element = angular.element('<rating-button button-rating="buttonRating"></rating-button>'); 
     $compile(element)(scope); 
     scope.$digest(); 
    })); 

    it('should return appropriate class based on rating', function() { 
     expect(element.isolateScope().buttonRating).toBe('green'); 
     expect(element.isolateScope().getRatingClass()).toBe('btn-success'); 

    }); 

Plnkr