反應組件中的測試方法不起作用

Question

我在React中有簡單的組件。我想在用戶單擊按鈕時在此組件中測試方法。我已經測試過，但最終沒有通過。

組件：

import React, { Component } from 'react'; 
import PropTypes from 'prop-types'; 
import axios from 'axios'; 

class TestInvokingMethod extends Component { 
    onClick() { 
    } 
    render() { 
     return (
      <div> 
       <input id='buttonTest' type='button' value={10} onClick={this.onClick} /> 
      </div> 
     ); 
    } 
} 

export default TestInvokingMethod; 

和測試爲：

import React from 'react'; 
import { shallow } from 'enzyme'; 
import TestInvokingMethod from '../../components/TestComponent/TestInvokeMethod'; 

const component = shallow(
    <TestInvokingMethod /> 
); 

test('Testing invoke method',() => { 

    const mockFn = jest.fn(); 

    component.instance().onClick = mockFn; 
    component.update(); 
    component.find('#buttonTest').simulate('click'); 

    expect(component.instance().onClick.mock.calls.length).toBe(1); 
}); 

Answer 1

嘗試用玩笑的SpyOn

const spy = expect.spyOn(wrapper.instance(), "onClick"); 
wrapper.update(); 
wrapper.find('#buttonTest').simulate('click'); 
expect(spy).toHaveBeenCalled();