Reactコンポーネントの小道具からmjacksonのexpect spyOn関数を使用

Question

おそらくspyOn動作のために、spyOnを関数のpropsに使用しようとすると、エラーTypeError: Cannot assign to read only property 'onFocus' of object '#<Object>'が表示されます。

it('handleFocus',() => { 
     const wrapper = setup() 
     const spy = spyOn(wrapper.props(), 'onFocus') 
     wrapper.instance().handleFocus() 
     expect(spy).toHaveBeenCalled() 
}) 

セットアップ機能を使用すると、SpyOnはモックを使用してメソッドをオーバーライドしようとし

handleFocus() { 
    const { onFocus, onInputFocus } = this.props 
    if (onInputFocus) { 
     onInputFocus() 
    } 
    onFocus() 
    } 

Answer 1

handleFocus機能を見つけることができます

const setup = (isMount) => { 
    const props = { 
     value: 'test', 
     promise:() => Promise.resolve({}), 
     access:() => {}, 
     onFocus:() => {}, 
     onChange:() => {}, 
     onUpdateInput: v => v 
    } 
    return isMount 
     ? mount(<AutoCompleteAsync {...props} />) 
     : shallow(<AutoCompleteAsync {...props} />) 
    } 

、そこにあります。

スパイでターゲットのメソッドを置き換えます。

// That's what actually happens in your test, setup() aside 
const wrapper = shallow(<AutoCompleteAsync {...props} />) 

その小道具を変更する唯一の方法は再びsetPropsを呼び出すことである： https://github.com/mjackson/expect#spyon

しかし、あなたのオブジェクトは、酵素が提供する浅いコピーです。

それを（ 'handleFocus'、（）=> { CONSTラッパー=セットアップ（） CONST小道具= { 値： 'テスト'、 のonFocus：（）=> {} } //交換のonFocusスパイのonFocus のconstスパイ= spyOn（小道具 'のonFocus'）