テストの実行と作成方法

テストの実行

このセクションは、コントリビューターとしてReact Nativeへの変更をテストすることについてです。まだの場合は、ネイティブコードでプロジェクトをビルドするための開発環境をセットアップする手順を確認してください。

JavaScriptテスト

JavaScriptテストスイートを実行する最も簡単な方法は、React Nativeチェックアウトのルートで以下のコマンドを使用することです。

bash
yarn test

これにより、Jestを使用してテストが実行されます。

また、コードがFlowとlintテストに合格していることを確認する必要もあります。

bash
yarn flow
yarn lint

iOSテスト

packages/rn-tester ディレクトリにあるREADME.mdの指示に従ってください。

次に、React Nativeチェックアウトのルートに戻り、yarnを実行します。これにより、JavaScriptの依存関係がセットアップされます。

この時点で、React Nativeチェックアウトのルートから以下のスクリプトを呼び出すことで、iOSテストを実行できます。

bash
./scripts/objc-test.sh test

Xcodeを使用してiOSテストを実行することもできます。RNTester/RNTesterPods.xcworkspaceを開き、Command + Uを押すか、メニューバーからProduct > Testを選択してローカルでテストを実行します。

Xcodeでは、テストナビゲーターを通じて個別のテストを実行することもできます。Command + 6ショートカットを使用することもできます。

注

objc-test.shは、すべてのテストを実行できるようにテスト環境が設定されていることを確認します。また、不安定であるか、または壊れていることが知られているテストは無効にします。Xcodeを使用してテストを実行する際には、この点に留意してください。予期せぬ失敗が発生した場合は、まずobjc-test.shで無効になっているかどうかを確認してください。

iOS Podfile/Rubyテスト

Podfileの設定を変更する場合、これらを検証できるRubyテストがあります。

Rubyテストを実行するには

bash
cd scripts
sh run_ruby_tests.sh

Androidテスト

Androidユニットテストはエミュレーターでは実行されませんが、ローカルマシンのJVMで実行されます。

Androidユニットテストを実行するには、React Nativeチェックアウトのルートから以下のスクリプトを呼び出します。

bash
./gradlew test

テストの記述

React Nativeでバグを修正したり、新しい機能を追加したりする際は、それをカバーするテストを追加することをお勧めします。変更内容に応じて、適切なテストの種類が異なります。

JavaScriptテスト

JavaScriptテストは、テスト対象のファイルの隣にある__test__ディレクトリ内にあります。TouchableHighlight-test.jsを基本的な例として参照してください。JestのReact Nativeアプリのテストチュートリアルを参考にすることもできます。

iOS統合テスト

React Nativeは、ブリッジを介してネイティブコンポーネントとJSコンポーネントの両方が通信する必要がある統合コンポーネントをテストしやすくするための機能を提供します。

主な2つのコンポーネントはRCTTestRunnerとRCTTestModuleです。RCTTestRunnerはReact Native環境をセットアップし、XcodeでXCTestCaseとしてテストを実行する機能を提供します（runTest:moduleが最もシンプルなメソッドです）。RCTTestModuleはJavaScriptにNativeModules.TestModuleとしてエクスポートされます。

テスト自体はJSで書かれており、完了時にTestModule.markTestCompleted()を呼び出す必要があります。呼び出さない場合、テストはタイムアウトして失敗します。

テストの失敗は主にJS例外をスローすることで示されます。エラー条件はrunTest:module:initialProps:expectErrorRegex:またはrunTest:module:initialProps:expectErrorBlock:を使用してテストすることも可能で、これによりエラーがスローされることを期待し、エラーが指定された基準と一致することを確認します。

使用例と統合ポイントについては、以下を参照してください。

iOSスナップショットテスト

一般的な統合テストの一種がスナップショットテストです。これらのテストはコンポーネントをレンダリングし、FBSnapshotTestCaseライブラリを舞台裏で使用して、TestModule.verifySnapshot()を使用して画面のスナップショットを参照画像と照合します。参照画像は、RCTTestRunnerでrecordMode = YESを設定し、テストを実行することで記録されます。

スナップショットは32ビットと64ビット、および様々なOSバージョン間でわずかに異なるため、正しい設定でテストが実行されるように強制することをお勧めします。

すべてのネットワークデータは、その他の問題となる可能性のある依存関係とともに、モックアウトすることを強くお勧めします。基本的な例については、SimpleSnapshotTestを参照してください。

プルリクエストでスナップショットテストに影響を与える変更を行った場合（例：スナップショットが作成されている例のいずれかに新しい例のケースを追加した場合など）、スナップショット参照画像を再記録する必要があります。

これを行うには、RNTester/RNTesterSnapshotTests.mのrecordModeフラグを_runner.recordMode = YES;に変更し、失敗したテストを再実行し、その後recordをNOに戻してプルリクエストを送信/更新し、CircleCIビルドが合格するかどうかを確認します。

Androidユニットテスト

Java/Kotlinコードだけでテストできるコードを扱う場合は、Androidユニットテストを追加することをお勧めします。Androidユニットテストはpackages/react-native/ReactAndroid/src/test/にあります。

良いユニットテストがどのようなものかを知るために、これらを一通り見てみることをお勧めします。

継続的テスト

私たちはCircleCIを使用してオープンソーステストを自動的に実行しています。CircleCIは、プルリクエストにコミットが追加されるたびにこれらのテストを実行し、メンテナーがコード変更によってリグレッションが導入されたかどうかを理解するのに役立てています。また、mainおよび*-stableブランチへのコミットでもテストが実行され、これらのブランチの健全性を追跡します。

Metaの内部テストインフラストラクチャ内で実行される別のテストセットがあります。これらのテストの一部は、React Nativeの内部コンシューマーによって定義された統合テストです（例：Facebookアプリ内のReact Nativeサーフェス用のユニットテスト）。

これらのテストは、Facebookのソース管理にホストされているReact Nativeのコピーへのすべてのコミットで実行されます。また、プルリクエストがFacebookのソース管理にインポートされたときにも実行されます。

これらのテストのいずれかが失敗した場合、Metaの誰かに確認してもらう必要があります。プルリクエストはMetaの従業員のみがインポートできるため、プルリクエストをインポートした人が詳細を伝えることができるはずです。

注

CIテストをローカルで実行する：ほとんどのオープンソース協力者は、CircleCIにこれらのテストの結果を確認するために依存しています。CircleCIと同じ設定を使用してローカルで変更を検証したい場合は、CircleCIはローカルでジョブを実行する機能を備えたコマンドラインインターフェースを提供しています。

F.A.Q.

CIテストで使用されるXcodeのバージョンをアップグレードするにはどうすればよいですか？

Xcodeの新しいバージョンにアップグレードする際は、まずCircleCIでサポートされていることを確認してください。

テストがCircleCIマシンにインストールされているiOSシミュレーターで実行されるように、テスト環境の設定も更新する必要があります。

これは、CircleCIのXcodeバージョン参照で目的のバージョンをクリックし、Runtimesの下を見ても確認できます。

その後、次の2つのファイルを編集できます。

.circleci/config.yml

macos:の下にあるxcode:の行（_XCODE_VERSIONを検索）を編集します。
scripts/.tests.env

IOS_TARGET_OS環境変数を目的のiOSランタイムに一致するように編集します。

この変更をGitHubにマージする予定がある場合は、Metaの従業員に通知してください。彼らがプルリクエストをインポートする際に、react_native_oss.pyの内部Sandcastle RN OSS iOSテストで使用される_XCODE_VERSIONの値を更新する必要があるためです。