問題タブ [react-native-testing-library]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
0 に答える
857 参照

typescript - TypeScript を使用して React Native monorepo で jest ユニットおよびコンポーネント テストを適切に構成する方法

私たちのリポジトリ (作業中なので、残念ながらリンクを提供することはできません) はかなり大きくて複雑なので、私の問題を説明するのは少し難しいですが、最善を尽くします。まず第一に、問題:

問題

実行するjestと、結果は次のようになります。

エラー メッセージは、モノレポ内から (@packages/エイリアス経由で) 何かをインポートするファイルのすべてのテストで同じです。IconWithBadge明らかにMetricsモジュールをインポートできないまったく同じコンポーネントです。現在のすべてのテスト スイートの完全な出力については、以下を参照してください。

ここで注意すべき重要な点は次のとおりです。

React Native コンテキストでは、このコードはすべて問題なく動作します。

つまり、通常どおり、コマンドを使用してアプリをビルドおよび実行するとreact-native、すべてが機能し、エラーは発生しません。jestこのエラーが発生するのは、テストのコンテキストだけです。

Metricsまた、 fromのすべてのインスタンスを削除して、再度IconWithBadge実行するとjestします。Metrics次に、奇跡的にある場所にインポートする別のファイルを見つけますundefined

ここで、リポジトリの構造と構成の概要を説明するために、環境を見てみましょう。

環境

次のような構造の monorepo があります。

コンポーネント テスト ( jest-nativeおよびRN Testing Libraryを使用) と、リポジトリ内の単純な単体テストの両方があります。detoxディレクトリの存在から推測できるように、テストもありますがe2e、現時点では重要ではありません。

すべてのコード (テスト コードとアプリ コード) は TypeScript で記述され、React Native 部分については、RN チームが推奨するようにすべて Babel 経由でコンパイルされます。ただし、テストのために、コードを CommonJS にコンパイルするようにts-jestjestを構成しました。TypeScript コードをコンパイルし、すべての JavaScript コードttypescriptで使用するように特別に構成されています。babel-jest

すべてがどのように構成されているかを示すために、最も重要な構成をここに貼り付けます。

設定

Jest設定

Expo の unimodulesを使用するためjest-expo、Expo 側の jest-testing を適切にセットアップするインストールも行いました。これts-jestを念頭に置いて、私たちjest.config.jsは次のようになります。

バベルの設定

./get-babel-config.js

./app-directory/babel.config.js

./babel.config.js

TypeScript 構成

./tsconfig.json

./tsconfig.spec.json

パッケージJSON

./package.json

./app-directory/package.json

概要

これは、すべての関連情報である必要があります。何か不足している場合や追加情報が必要な場合は、お知らせください。質問を要約するには:

jest通常の開発/生産では問題なく動作するのに、なぜこのパッケージを解決できないのですか? どうすればこの問題を解決できるでしょうか?

ここですべての専門家に質問jest!あなたが私を助けてくれることを願っています。ありがとう!