酵素シミュレーション「クリック」が必要なときに機能しない

Question

フォームコンポーネントをテストするためにJestとEnzymeを使用していますが、クリックシミュレーションがうまくいかない。参考のために：Buttonはスタイルrebassボタンであり、このような形で存在します、

ここで注意しなければならない何

it('should handle the onClose event',() => { 
     const onCloseSpy = jest.fn(); 
     const renderedComponent = mount(renderFormUtil({ onClose: onCloseSpy })); 
     expect(onCloseSpy).not.toHaveBeenCalled(); 
     console.log(renderedComponent.find(Form).props().onClose); 
     renderedComponent 
     .find(Button) 
     .first() 
     .simulate('click'); 
    expect(onCloseSpy).toHaveBeenCalled(); 
    }); 

場合、私は交換することである：

<Button 
    type="reset" 
    disabled={pristine || submitting} 
    onClick={() => onClose(dirty)} 
> 

ここで失敗のテストです次の行をシミュレートしてください。

renderedComponent 
    .find(Button) 
    .first() 
    .props() 
    .onClick(); 

突然私のテストに合格します。これはどのように可能ですか？ onClick小道具が正しい場合、それはクリックイベントが小道具を正しく呼び出さないことを意味しませんか？

Answer 1

2つのコンポーネントが同じセレクタを使用しているため、2つのコンポーネントが同じコンポーネントを選択するかどうかは不明です。これと組み合わせて、.first()を使用しています。これは、サンプルコードでの注文についてはわかりません。
.first()を使用せず、希望のコンポーネントを.findとするだけで、より具体的なセレクタを使用できます。そのために、あなたは、特定のButtonSubmitためidを追加することができますし、のようなセレクタを使用します。
使用すると、1つのケースと他では `.find（ボタン）`に `` .find（ButtonSubmit）を使用しないのはなぜ .find('ButtonSubmit[id="foo"]')