webpackerにjestを導入する

webpackerを使ったRailsプロジェクトにjestを導入してみた。jestをインストールしてテストを実行してみると、以下のようなエラーがおきた。

({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import xxx from './xxx';
                                                                                         ^^^^^^

SyntaxError: Unexpected token import
  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:316:17)

importがコンパイルできていないようだ。webpackerが生成する.babelrcでは、以下のように設定されている。

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": "> 1%",
        "uglify": true
      },
      "useBuiltIns": true
    }],
    "react"
  ]
}

"modules": falseと設定されているため、importの変換が行われないようになっている。これはwebpackによってimport文を処理するためにbabelではimportの変換を行わないようにしているんだと思う。

しかし、jestを実行する場合はwebpackによる処理は行われないため、importが変換されずエラーになっていたと考えられそう。

そこで、以下の設定を.babelrcに追加したところ直った。

{
  "env": {
    "test": {
      "presets": [
        ["env", { "modules": "commonjs" }]
      ]
    }
  }
}

jestは実行時に自動的にNODE_ENVをtestに設定するため、これでうまくいく。