※スマホ対応はしてません。

タグ: Jest

JestでregeneratorRuntime is not definedと言われたら、regenerator-runtimeを入れる

カテゴリー: JavaScript

たぶん TypeScript のときだけ。というか Babel 使ってるときだけ。

エラー

it() がエラーになっちゃった。

    ReferenceError: regeneratorRuntime is not defined

      30 |       });
      31 |
    > 32 |       it("can read to own item", async () => {
         |         ^

詳細な再現条件は確認してないけど(内部で)ジェネレーター関数が利用されているとこうなるっぽい。

解決策

ポリフィルを入れて、

$ npm install -D regenerator-runtime

どこかで一度だけ import します。

import "regenerator-runtime/runtime";

たぶん setupFilesAfterEnv 設定で指定したスクリプトに書くことになるでしょう。

関連:

babel-polyfill ?

古い情報だと babel-polyfill を入れろというのがあるんだけど、このパッケージはもう非推奨 deprecated になってるので、regenerator-runtime の方を使ってください。

🚨 As of Babel 7.4.0, this package has been deprecated in favor of directly including core-js/stable (to polyfill ECMAScript features) and regenerator-runtime/runtime (needed to use transpiled generator functions):

🚨 Babel 7.4.0 ではこのパッケージは非推奨となりました。core-js/stable(ECMAScript 機能を代替する)や regenerator-runtime/runtime(トランスパイルされたジェネレーター関数の利用に必要)を直接含めてください。

core-js/stable の方は今回の件については不要です。

おしまい

フレームワークなしの自力でやると細かいところで引っかかるものですね。FW すごい。

参考

Module xxx in the setupFilesAfterEnv option was not foundと言われたら<rootDir>を足す。

カテゴリー: JavaScript

ここまでのあらすじ

Jest で試験前に import "@testing-library/jest-dom/extend-expect"; とかそういう準備をするじゃないですか、そういうのをやるために準備用ファイルを読み込むため setupFilesAfterEnv オプション使ったらエラーになりました。

エラー

package.json で setupFilesAfterEnv オプション付けました。

{
  "jest": {
    "setupFilesAfterEnv": [
      "src/setupTests.ts"
    ]
  }

そしたらこんなエラーに。

● Validation Error:

  Module src/setupTests.ts in the setupFilesAfterEnv option was not found.
         <rootDir> is: /mnt/c/Users/ginpei/projects/my-project

  Configuration Documentation:
  https://jestjs.io/docs/configuration.html

解決策:<rootDir> を足す

ファイルパスの最初に <rootDir> を足します。

{
  "jest": {
    "setupFilesAfterEnv": [
      "<rootDir>/src/setupTests.ts"
    ]
  }

これで動くようになりました。

ドキュメント

を読んだらまさにそう書いてありました。(翻訳されてないや。)


If you want a path to be relative to the root directory of your project, please include <rootDir> inside a path’s string, like "<rootDir>/a-configs-folder".

もしパスをあなたのプロジェクトのルートディレクトリーに対し相対的なものにしたい場合、パス文字列の中に <rootDir> を含めてください。例:"<rootDir>/a-configs-folder"

おしまい

ドキュメント読もうね案件でした。

こういう、一度設定したらもう触らない系の話はすぐ忘れちゃう。

参考