有沒有辦法在 React 組件的胖箭頭類實例方法上使用 Jest 進行間諜/模擬？

Question

我有一個handleClick函數：

handleClick = tagIndex => {
    console.log(tagIndex)
    if (tagIndex >= 0 && tagIndex < this.state.suggestedTags.length)
        this.state.suggestedTags.splice(tagIndex, 1);
} 

在我的 React 類中，我無法正確地模擬或監視它。

我目前正在嘗試這個

it('should call handleClick when a tag is clicked', () => {
        wrapper.setState({ suggestedTags: ['Mozart'] })
        const spy = jest.spyOn(component, 'handleClick')
        component.forceUpdate()
        wrapper.find('.suggested-tags__item').simulate('click')
        expect(spy).toHaveBeenCalled()
    })

但我得到的只是Expected mock function to have been called

Answer 1

const spy = jest.spyOn(component, 'handleClick')
wrapper.instance().forceUpdate(); // Here is the difference
wrapper.find('.suggested-tags__item').simulate('click')
expect(spy).toHaveBeenCalled()

https://github.com/airbnb/enzyme/issues/365