2017-01-26 20 views
2

この質問はthis previous oneに似ています。しかし今は別のフレームワーク、Jestを使用しています。ReactDOM.renderと他のインポートされた関数がJestで呼び出されたことをテストするには?

import * as React from "react"; 
import * as ReactDOM from "react-dom"; 

import * as injectTapEventPlugin from "react-tap-event-plugin"; 

import Application from "./components/Application"; 

import "./assets/styles/theme.css"; 

injectTapEventPlugin(); 

ReactDOM.render(<Application />, document.getElementById("root")); 

私はここでテストしたい3つの事があります:

  1. injectTapEventPlugin()が呼び出されたが

    私のコードは次のようになります。

  2. ReactDOM.renderがそれぞれ、期待される引数、<Application />、およびdocument.getElementById("root")で呼び出されました。
  3. その./assets/styles/theme.cssをインポートしました。私はこれが奇妙であることを知っていますが、このインポートはwebpackがそれをピックアップして最終的なバンドルに含めるようにここにあります。おそらく、このインポートは存在しないはずです。私は、theme.cssファイルが何らかの方法でlodadedされていることを確認する必要があります。

少なくとも1と2はテストする必要があります... JestはJasmine2を使用していますが、Enzymeも使用しています(ただし、おそらくこれは役に立ちません)。

すべてのヘルプは高く評価され:)

答えて

1

これをテストするための問題は、モジュールだけのものをインポートするが、それは難しいテストすることができた、何をエクスポートしていないということです。最初に質問する必要があるのは、「なぜこれをテストする必要があるのか​​」です。なぜなら、ここで起こるのは2つの関数呼び出しだと思うからです。

テスト#1は簡単で、テストにインポートし、スパイが

import * as injectTapEventPlugin from "react-tap-event-plugin"; 
jest.mock('react-tap-event-plugin',()=>jest.fn()) 

expect(injectTapEventPlugin).toHaveBeenCalled() 

ないimport * as構文は、この場合の問題点であるかどうかわから呼ばれていたチェック、スパイでモジュールを嘲笑。

#2のテストでは、テストでも上書きできるようになる前に、document.getElementByという名前を偽装する方法がないので、テストすることが可能かどうかはわかりません。

+0

ええ、私はインポートの前に 'jest.mock'を呼び出さなければいけませんでした。さもなければ、動作しませんでした。しかし、そうです、私はおそらくこれをテストする必要はありません...私は 'injectTapEventPlugin'または' ReactDom.render'を正しく呼んでいないと、アプリケーションは単に機能しません。将来大きく変化しない可能性が高いファイルです。すべてのコンポーネントがテストされている限り、このファイルはちょうど「ねえ、アプリケーションをレンダリング」と同じです。それだけです。 –

関連する問題