Fonksiyon reaktif ve enzim olarak adlandırılan test

Question

Test bileşenimden birini test etmeye çalışıyorum. O yüzden enzim ile yerinde simülasyon var bir düğme tıklaması sonra çağrılan

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

Benim bileşen yöntemi burada:

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

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

_handleCloneClick çağrıldığında düğme thats kullanıcı tıkladığında simülasyonda, başarılı bir şekilde denendiğini test etmek için nasıl gidebilirim?

Answer 1

iki seçenek vardır, ya sen bileşeni işlemek önce, bileşenin prototipin _handleCloneClick casusluk olmalıdır: Eğer deneyebilirsiniz,

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 
}); 

Veya:

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>); 
    } 
} 

Ve testinde Bileşeni oluşturduktan sonra bir casus ayarladıktan sonra wrapper.update()'u çağırır: