web-dev-qa-db-ja.com

TypeErrorを解決する方法：environment.teardownは関数ではありませんか？

create-react-appで作成したアプリケーションをテストすることはできませんが、すべてのガイドでテストがデフォルトで機能していると記載されていますが、「yarn test」を試すとインストール「jest-cli」が必要で、インストール後にエラー「TypeError：environment。分解は機能ではありません」。

javascriptreactjsunit-testingtestingjestjs
6
discovery one

Jest-cliを自分でインストールする必要はありません。すぐに使用できるはずです。

以下を試してください：

  1. Package-lock.json、yarn.lock、node_modulesを削除します
  2. Package.jsonの依存関係からjestを削除します
  3. その後、npm installまたはyarn install。
18
MstrQKN

「jest-environment-jsdom」の最新バージョンを「package.json」に追加します。

5
denisx

私の場合、create-react-appを使用して反応プロジェクトを作成し、jestをインストールするため、このエラーがスローされます。特定の方法で競合します。

プロジェクトからjestを削除し、create-react-appテストスクリプトを使用して解決します。

1
Raul F. de Melo

プロジェクトにcreate-react-appを使用していない場合：

  • jest, jest-cli, jest-environment-jsdomからpackage.jsonを削除するだけです。
  • Node-modules、package-lock.json、およびyarn.lockを削除します。
  • npm --save iまたはyarn addを使用してすべてをインストールし、それぞれが同じバージョンになるようにします。

これは動作するはずです！

私の場合、jest-environment-jsdomパッケージがありませんでした。

1
Abhishek Ranjan

この問題について私の頭を叩いた夜の後、私は最終的にそれを解決したと思います。まず、問題を説明しましょう。

私も得ていました：

TypeError: environment.teardown is not a function

Jestを最新バージョンにアップグレードしようとしていたからです。 Create-React-Appでアプリを起動すると、すべての機能を含まないjestの以前のバージョンがインストールされます。テストファイル内のHTMLマークアップに対してレンダリングされたコンポーネントをアサートできるinlineSnapshots機能の使用に興味がありました。

Create-React-Appまたはjestのドキュメントに含まれていないいくつかの注意事項があります。 inlineSnapshotsなどの新しいjest機能を使用する場合は、次の操作を行う必要があります。

  • yarnはjestおよびjest-environment-jsdomの新しいバージョンを追加します
  • yarn add prettier --dev（これはソースファイルへの書き直しを容易にするためです。）
  • Jest env docblockを各テストスクリプトの最上部に追加します。

Docblockは、プラグママーク「@」が付いたJSブロックコメントです。 jest環境を設定するには、これをすべてのテストファイルの先頭に追加します。

/**
 * @jest-environment jsdom
 */

これはjestにjsdom環境でテストを実行するように指示します。これは、package.jsonのテストスクリプトセクションで渡されたものと一致する必要があります。私のものは次のようになります（react-app-rewiredでパーツを無視します）：

   "scripts": {
      "start": "yarn run flow && react-app-rewired start",
      "build": "yarn run flow && react-app-rewired build",
      "test": "react-scripts test --env=jsdom"
   }

これらすべてを行った後、私はようやくインラインスナップショットを機能させることができました。

1
Cliff

私にとっては、モジュールインポートバインディングでした。基本的に私にとっては、モジュールのエクスポート/インポートバインディングでした。

基本的に、module.exportを使用してエクスポートされた場合、requireを使用してインポートする必要があります。 exportまたはexport defaultを使用してエクスポートされた場合、importを使用してインポートする必要があります。

ここでは混合は許可されていません。

0
somenickname