Jest で webpack の require.context() を使えるようにする

require.context() は、フォルダ内の全ファイルを一気に require 出来たりと非常に便利なため使う機会が多々ある。

しかし、 require.context() は webpack を使用したビルド中のみ動作する。
そのため、Jest をはじめとした他のツールで require.context() を使用すると以下のようなエラーが発生する。

TypeError: require.context is not a function

これに関して、以下の通り Issue で議論されている。

• require.context doesn't work in tests · Issue #517 · facebook/create-react-app
• equivalent of require.context · Issue #2298 · facebook/jest

手っ取り早くこの問題を解決する方法として、こちらにも記載されているが、 babel-plugin-require-context-hook プラグインを追加する方法がある。

$ npm install --save-dev babel-plugin-require-context-hook

Jest の setupFiles に以下を追記する。

setupFiles

import registerRequireContextHook from 'babel-plugin-require-context-hook/register';
registerRequireContextHook();

.bablerc にプラグインを追加する。

.babelrc

{
  "presets": ["..."],
  "plugins": ["..."],
  "env": {
    "test": {
      "plugins": ["require-context-hook"]
    }
  }
}

これで、 Jest でも require.context() が使えるようになった。