जैस्मीन कैसे काम करता है अगर फ़ंक्शन मूल्य वापस नहीं करता है?

Question

सबसे पहले, मैं टेस्ट ड्राइव डेवलपमेंट (टीडीडी) और व्यवहार संचालित विकास (बीडीडी) दोनों के लिए नया हूं और मुझे विश्वास है कि यह वेब पेज विकसित करने का एक अच्छा तरीका है क्योंकि पृष्ठों को अक्सर विकसित करने की आवश्यकता होती है तेजी से, जो कुछ भी कर सकते हैं, इससे पहले कि आपको टेस्ट कोड विकसित करना पड़े तो मुश्किल है।

किसी भी तरीके से!

कारण यह है कि मैं इस धागे को लिख रहा हूं, जो मुझे लगता है, मुद्दा नहीं है (लेकिन यदि आपके पास इनपुट है तो मैं इसे पढ़ने का आनंद भी लेगा!)। मैं सिंटैक्स के बारे में कुछ पढ़ रहा हूं, यह कैसे काम करता है, और वह सब कुछ। मैंने पाया कि अगर मेरा कार्य मूल्य वापस नहीं करता है तो दृष्टिकोण को लागू करना मुश्किल है।

$('input[type="text"]').click(function() { 
    $(this).val('Oh, that tickles!'); 
}); 

कैसे चमेली इस का क्या करता है:

के उदाहरण के लिए कहते हैं कि मैं एक क्लिक-घटना समारोह है कि महज एक इनपुट के एक पाठ मान बदलाव हुए कि चलो? निम्नलिखित कोड की तरह ?:

describe('Input type text is clicked', function() { 
    it('changes text in the input field', function() { 
     expect($('input[type="text"]').val()).toEqual("Oh, that tickles!"); 
    }); 
}); 

यह गलत है, क्योंकि jQuery ऑब्जेक्ट में कई इनपुट फ़ील्ड हो सकते हैं जिनमें वह मान नहीं है। क्या तत्व ढूंढने के कोई तरीके हैं (जैसे $(this) या इसी तरह), या मुझे जैस्मीन परीक्षण के अंदर एक क्लिक-हैंडलर रखना चाहिए? इस तरह:

describe('Input type text is clicked', function() { 
    it('changes text in the input field', function() { 
     $('input[type="text"]').click(function() { 
      expect($(this).val()).toEqual("Oh, that tickles!"); 
     } 
    }); 
}); 

कुछ स्पष्टता अग्रिम में अच्छा :)

धन्यवाद होगा एक बहुत!

/जे।

Answer 1

एक दृष्टिकोण यह सुनिश्चित करना है कि परीक्षण चलने पर केवल एक टेक्स्ट इनपुट फ़ील्ड हो। आप इनपुट क्षेत्र के साथ एक दृढ़ बनाने के लिए jasmine-jquery उपयोग कर सकते हैं:

describe('Input type text is clicked', function() { 
    beforeEach(function() { 
    jasmine.getFixtures().set('<input type="text" />'); 
    bindClickEvent(); 
    }); 
    it('changes text in the input field', function() { 
    $('input[type="text"]').click(); 
    expect($('input[type="text"]').val()).toEqual("Oh, that tickles!"); 
    }); 
}); 

आप अपने कोड को refactor करने के लिए ताकि आप परीक्षण कर सकते हैं कि क्लिक करें घटना अलग क्लिक हैंडलर ही नियंत्रित किया जाता है सकते हैं:

var eventHandlers = { 
    tickle: function() { 
    $(this).val('Oh, that tickles!'); 
    } 
};  
$('input[type="text"]').click(eventHandlers.tickle); 

फिर आपके पास दो परीक्षण होंगे:

describe('Input type text is clicked', function() { 
    beforeEach(function() { 
    jasmine.getFixtures().set('<input type="text" />'); 
    spyOn(eventHandlers, 'tickle'); 
    bindClickEvent(); 
    }); 
    it('should tickle the field', function() { 
    $('input[type="text"]').click(); 
    expect(eventHandler.tickle).toHaveBeenCalled(); 
    }); 
}); 

describe('eventHandlers.tickle', function() { 
    it('should set the field value', function() { 
    var input = $('<input type="text"/>'); 
    eventHandlers.tickle.call(input); 
    expect(input.val()).toBe("Oh, that tickles!"); 
    }); 
});