एनजी 1.47 यूनिट टेस्ट एनीमेशन फ़ंक्शंस को कॉल न करें

Question

मैं this tutorial से काम कर रहा हूं और गुगल विज्ञापन नोडम है, लेकिन मुझे ऐसा लगता है कि यह एक छोटा ngAnimate यूनिट परीक्षण चल रहा है।

मेरे पास ngAnimate ऐप में अच्छी तरह से काम कर रहा है। सभी कोणीय कोर पुस्तकालय संस्करण 1.4.7 हैं।

मॉड्यूल

angular.module 'MyAnimation', [ 'ngAnimate' ] 
    .animation '.added-class', -> 
    addClass: (element, className, done) -> 
     console.log 'add class triggered' 
     element.css 'opacity', '0.5' 
     done() 

टेस्ट

describe 'MyAnimation', -> 
    beforeEach -> module 'ngAnimate' 
    beforeEach -> module 'ngAnimateMock' 
    beforeEach -> module 'MyAnimation' 

    it 'animates', -> inject ($animate, $rootScope, $rootElement) -> 
    $animate.enabled(true) 
    divElement = angular.element '<div>my div</div>' 

    # Kick off initial digest loop in which no animations are run. 
    $rootScope.$digest() 

    # Trigger animation. 
    $animate.addClass divElement, 'added-class' 
    $rootScope.$digest() 

    # Tried this, doesn't seem to do anything. 
    # $animate.flush() 

    # Results in AssertionError: expected '' to equal '0.5' 
    expect(divElement.css('opacity')).to.eq '0.5' 

मुझे यकीन है कि मॉड्यूल परीक्षण में शामिल किया जा रहा है हूँ, लेकिन ट्रिगर $animate.enter भी मुझे मेरे log उत्पादन नहीं मिलता है ।

मैंने इसे अन्य $animate फ़ंक्शंस के साथ भी कोशिश की है और कहीं भी नहीं मिल रहा है। मदद?

Answer 1

कोणीय के स्रोत कोड में कुछ गंभीर खुदाई के बाद, ऐसा लगता है कि अपराधी आंतरिक चेक areAnimationsAllowed है जो कोणीय का उपयोग यह निर्धारित करने के लिए करता है कि एनीमेशन को जल्दी रद्द करना है या नहीं। अन्य चीजों के अलावा, यह जांचता है कि एनिम एनिमेटेड $rootElement और दस्तावेज़ निकाय का वंशज है।

आपके पास दो विकल्प हैं।

1. Plunker। $rootElement पर एनिमेट करने वाले नोड को संलग्न करें और को पर संलग्न करें। उत्तरार्द्ध आवश्यक है क्योंकि ngMock वास्तव में स्मृति में आयोजित <div> नोड के साथ $rootElement स्टब्स करता है। उदाहरण:

var element, body, root; 
beforeEach(module('ngAnimate', 'ngAnimateMock', 'MyAnimation')); 
beforeEach(inject(function ($animate, $document, $rootElement, $rootScope) { 
    // enable animations globally 
    $animate.enabled(true); 

    // create a node to be animated and inject it into the DOM 
    element = angular.element('<div></div>'); 
    root = $rootElement.append(element)[0]; 
    body = $document[0].body; 
    body.appendChild(root); 

    // trigger initial digest 
    $rootScope.$digest(); 
})); 
afterEach(function() { 
    // clean up 
    body.removeChild(root); 
}); 

1. Plunker। $animate.addClass का उपयोग करके अपनी एनीमेशन का परीक्षण न करें, लेकिन इसके बजाय निम्न-स्तर $$animateJs सेवा का उपयोग करें। कोणीय inside their own tests का उपयोग करता है, मुझे लगता है कि उपरोक्त चेक को बाईपास करना है। उदाहरण:

it('should animate', inject(function ($animate, $$animateJs) { 
    // trigger animation 
    $$animateJs(element, 'addClass', { 
    addClass: 'added-class' 
    }).start(); 
    $animate.flush(); 
})); 

आप Plunkers चलाने के लिए और सांत्वना जाँच हैं, तो आप अपने "addClass शुरू हो रहा" संदेश दिखाई देना चाहिए। मैंने कुछ दावे भी जोड़े हैं।

दोनों समाधान हैकी और अनियंत्रित हैं, और दोनों addClass एनीमेशन कुछ एसिंक्रोनस (जो मुझे लगता है) करता है तो अधिक शामिल हो जाते हैं। दुर्भाग्यवश, मुझे जेएस एनिमेशन का परीक्षण करने का एक बेहतर तरीका नहीं मिल रहा है। अतीत में मैंने वास्तव में कवरेज से एनीमेशन कोड को अनदेखा कर दिया है क्योंकि परीक्षण करना बहुत मुश्किल है।