テストの実行と記述方法

テストの実行

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

JavaScriptテスト

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

yarn test

これはJestを使用してテストを実行します。

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

yarn flow
yarn lint

iOSテスト

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

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

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

./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テストを実行するには

cd scripts
sh run_ruby_tests.sh

Androidテスト

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

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

./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:を使用してエラー条件をテストすることもできます。これらは、エラーがスローされることを期待し、エラーが提供された条件に一致することを検証します。

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

• IntegrationTestHarnessTest.js
• RNTesterIntegrationTests.m
• IntegrationTestsApp.js

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

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

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

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

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

これを行うには、RNTester/RNTesterSnapshotTests.mでrecordModeフラグを_runner.recordMode = YES;に変更し、失敗したテストを再実行してから、レコードを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はジョブをローカルで実行する機能を備えたコマンドラインインターフェイスを提供します。

よくある質問

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

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

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

これは、CircleCIのXcodeバージョンリファレンスで、目的のバージョンをクリックし、ランタイムで確認することもできます。

次に、これら2つのファイルを編集できます

• .circleci/config.yml

  macos:の下のxcode:行を編集します（_XCODE_VERSIONを検索します）。

• scripts/.tests.env

  目的のiOSランタイムと一致するように、IOS_TARGET_OS envvarを編集します。

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