परीक्षण अगर फ़ंक्शन को प्रतिक्रिया और एंजाइम कहा जाता है

Question

मैं अपने प्रतिक्रिया घटक में से किसी एक विधि का परीक्षण करने का प्रयास कर रहा हूं। यह तो मैं एंजाइम के साथ जगह में अनुकरण है एक बटन क्लिक करने के बाद बुलाया जा रहा है

it('clone should call handleCloneClick when clicked',() => { 
     const cloneButton = wrapper.find('#clone-btn'); 
     cloneButton.simulate('click'); 
}); 

मेरे घटक विधि यहाँ है:

_handleCloneClick(event) { 
    event.preventDefault(); 
    event.stopPropagation(); 

    this.props.handleClone(this.props.user.id); 
} 

_handleCloneClick बुलाया जा रहा है, जब बटन thats पर उपयोगकर्ता क्लिक करता है सिमुलेशन में, मैं परीक्षण के बारे में कैसे जा सकता हूं जिसे इसे सफलतापूर्वक कहा जाता है?

Answer 1

पास दो विकल्प हैं, या तो आप, घटक के प्रोटोटाइप का _handleCloneClick पर जासूसी करना चाहिए इससे पहले कि आप घटक प्रस्तुत करना:

export default class cloneButton extends Component { 
    constructor(...args) { 
    super(...args); 
    this. _handleCloneClick = this. _handleCloneClick.bind(this); 
    } 

    _handleCloneClick() { 
    event.preventDefault(); 
    event.stopPropagation(); 

    this.props.handleClone(this.props.user.id); 
    } 

    render() { 
    return (<button onClick={this. _handleCloneClick}>Clone</button>); 
    } 
} 

और अपने परीक्षण में:

it('clone should call handleCloneClick when clicked',() => { 
    sinon.spy(cloneButton.prototype, '_handleCloneClick'); 
    const wrapper = mount(<cloneButton/>); 
    wrapper.find('#clone-btn').simulate('click'); 
    expect(spy).toHaveBeenCalled() //adept assertion to the tool you use 
}); 

या, आप की कोशिश कर सकते घटक प्रतिपादन के बाद एक जासूस की स्थापना की और बाद में wrapper.update() आह्वान:

it('clone should call handleCloneClick when clicked',() => {  
    const wrapper = mount(<cloneButton/>); 
    sinon.spy(wrapper.instance(), "_handleCloneClick"); 
    wrapper.update(); 
    wrapper.find('#clone-btn').simulate('click'); 
    expect(spy).toHaveBeenCalled() //adept assertion to the tool you use 
});