リアクション子コンポーネントメソッドの盗難

Question

私はjestと酵素で私のリアクションコンポーネントをテストしようとしています。私はreact-skylightコンポーネントを使用するフォームコンポーネントを持っています。私は.show()をフォーム送信時に起動し、サーバーからの応答が成功したときにだけ起動します。

私のテストはこのように現在：私は同様の問題についてhereディスカッションを見つけましたが、私のためにそれはない

expect(jest.fn()).toHaveBeenCalled() 

Expected mock function to have been called. 

：

import MyForm from './MyForm'; 
import Popup from 'react-skylight'; 

describe('<MyForm />',() => { 
    it('should show popup on success',() => { 
     const popupShowSpy = jest.spyOn(Popup.prototype, 'show'); 
     const myForm = mount(<MyForm />); 
     myForm.update(); 

     myForm.find('form').simulate('submit'); 
     expect(popupShowSpy).toHaveBeenCalled(); 
    }); 
}); 

が、私はテストを実行したとき、私はエラーを取得していますワーキング。

---

ソリューション：

問題はaxiosモジュールとありました。コンポーネントを更新していましたが、応答のタートが解決されなかったため、この投稿hereのおかげで、テストを書くことができました。そして、親コンポーネント自身の関数で子コンポーネントの関数呼び出しをラップし、その親関数を傍観しました。

import MyForm from './MyForm'; 
import Popup from 'react-skylight'; 

describe('<MyForm />',() => { 
    it('should show popup on success', async() => { 
     const popupShowSpy = jest.spyOn(MyForm.prototype, 'showPopup'); 
     const myForm = mount(<MyForm />); 

     const response = Promise.resolve({ 
      data: { 
       message: 'Error: some error' 
      }, 
      status: 400 
     }); 
     axios.post = jest.fn(() => response); 
     myForm.find('form').simulate('submit'); 
     await response; 
     myForm.update(); // <- child component is rendered correctly 
     expect(popupShowSpy).toHaveBeenCalled(); 
    }); 
}); 

Answer 1

ソリューション：

問題はaxiosモジュールとありました。コンポーネントを更新していましたが、嘲笑されたレスポンスは解決されていませんでした。このポストhereのおかげで、テストを書くことができました。そして、親コンポーネント自身の関数で子コンポーネントの関数呼び出しをラップし、その親関数を傍観しました。

import MyForm from './MyForm'; 
import Popup from 'react-skylight'; 

describe('<MyForm />',() => { 
    it('should show popup on success', async() => { 
     const popupShowSpy = jest.spyOn(MyForm.prototype, 'showPopup'); 
     const myForm = mount(<MyForm />); 

     const response = Promise.resolve({ 
      data: { 
       message: 'Error: some error' 
      }, 
      status: 400 
     }); 
     axios.post = jest.fn(() => response); 
     myForm.find('form').simulate('submit'); 
     await response; 
     myForm.update(); // <- child component is rendered correctly 
     expect(popupShowSpy).toHaveBeenCalled(); 
    }); 
});