単体テストとは何ですか?なぜ重要ですか?

単体テストは、コーディングした関数が期待どおりに動作することを確認するために、テストを作成して自動的に実行するプロセスです。手間がかかるように思えるかもしれませんが、実際には、バグが発生する前に予防策を講じてバグを潰すことが重要です。
単体テストとは何ですか?
「ユニット」とは、アプリ内の可能な最小のソフトウェア コンポーネント (関数、クラス、コンポーネントなど) です。個別の単体テストでは、アプリのコア コンポーネントが期待どおりに動作していること、およびコードのある領域への今後のコミットによって別の領域のコードが中断されないことを確認します。存在する場合は、新しいコードまたは古いコード (または不適切に書かれた/古いテスト) にバグがある可能性があります。
単体テストの目的は明らかです。バグ、特に統合によって発生するバグを減らすことです。開発者は、ローカルではすべて問題ないと思ってコードをコミットしても、別のコミットによってアプリが壊れていることに気づくかもしれません。単体テストは、これらの欠陥の一部を問題になる前に発見するのに役立ち、自動化された継続的インテグレーション パイプラインと組み合わせることで、毎日のビルドが常に適切に動作していることを確認できます。
単体テストは小さなコードに限定されません。また、他の複数の関数を利用する大規模なコンポーネントを単体テストすることもでき、コンポーネント自体が単体テストされる可能性があります。これは、エラーをより効果的に追跡するのに役立ちます。エラーは、大きなコンポーネント オブジェクトのメソッドにあるのでしょうか、それとも、それが使用する他のコンポーネントにあるのでしょうか。
単体テストは重要ですが、実行すべきテストはそれだけではありません。エンドツーエンドの UI テストと人間による手動レビューを実行すると、すべてのユニットが期待どおりに動作している場合に単体テストで見逃される可能性のあるロジック バグを多数検出できます。
単体テストはよりクリーンなコードベースにつながる
レガシー コードベースの主な問題の 1 つは恐竜コードです。コードが非常に古いため基本的にブラック ボックスであり、どのように動作するかわからないかもしれませんが、どういうわけか動作します。また、動作するのではないかと心配してリファクタリングしたくない場合があります。すべてを壊すかもしれない。
ある意味、単体テストを作成するということは、単体テストのドキュメントを作成していることになります。マニュアル全体を書く必要はないかもしれませんが、API スキーマの定義と同様に、関数に何を与えるか、関数が何を返すかという 2 つのことを常に定義することになります。これら 2 つの情報があれば、関数が何を行うのか、そしてそれをアプリに統合する方法が明確になります。明らかに、単体テストは既存のレガシー コードベースを解決するものではありませんが、そもそもこの種の恐竜コードを作成することを妨げます。
多くの場合、実際の関数をテストする前にテストを作成できます。関数が何をする必要があるかがわかっている場合は、最初にテストを作成することで、コードの最終結果とその責任について考える必要があります。
単体テストのこの効果が気に入った場合は、TypeScript にも興味があるかもしれません。TypeScript は、JavaScript を強力に型指定する、コンパイルされた JavaScript のスーパーセットです。それでも単体テストを書きたいと思うかもしれませんが、コーディング中に関数がどのような型を与え、どのような型を受け取るかを知っておくことは非常に便利です。
単体テストを実行する方法
単体テスト フレームワークにはさまざまな種類があり、最終的に使用するフレームワークはテストする言語によって異なります。ただし、それらがどのように機能するかを示すために、新しい React アプリケーションのデフォルトである JavaScript テスト フレームワークである Jest を使用します。
単体テストは通常、次の 3 つの段階で構成されます。
- ユニットをテストするためのデータを準備する場所を手配します。データを取得したり、複雑なオブジェクトを構築したり、単に何かをセットアップしたりする必要がある場合は、これを最初に行います。
- Act。ユニットが呼び出され、応答が記録されます。
- アサート。大部分のテストが行われます。ここで、 に基づいてブール演算を記述します。
いずれかのアサーションが失敗した場合、ユニットはテストに不合格となり、何がうまくいかなかったのか、何が予想されたのか、そして実際に何が返されたのかを示す詳細なログとスタック トレースが得られます。
Jest にはさまざまなマッチャーが用意されており、これらを使用して迅速かつシンプルなアサーションを実行できます。たとえば、2 つの数値を加算するだけの次の関数があるとします。
function doSomeMath(a, b) {
return a + b;
}
次のステートメントを使用してこの関数をテストできます。
test('Expect math to work', () => {
expect(doSomeMath(1, 1)).toBe(2);
});
通常、これは関数と一緒に functionName.test.js
の下に保存されます。 Jest はテストの実行時にこれらのファイルを自動的に検索します。
.toBe()
関数はマッチャーであり、この場合は基本的な同等性をチェックします。オブジェクトの同等性をチェックする .toBeEqual()
や、配列の内容をチェックする .toContain()
など、他にも多数あります。サポートされているマッチャーの完全なリストについては、Jest のドキュメントを参照してください。