見出し画像

Reactのテスト生成にGithub Copilotを使う

この記事はおよそ5分程度で読むことが可能です。


はじめに

初めまして、K.S.ロジャースのEDITHチームの島田と申します。
ソフトウェア開発では、単体テストを作るのは工数の問題や時間が足りないことも多いかと思います。そこで、単体テストの生成にGithub Copilotのみを使った方法の1つを紹介しようと思います。他にも多くの手法があるかと思いますが、この記事がご検討の参考になれば幸いです。対象読者としては、普段からReactで開発を行っている方、単体テストを実施したことがある方、Github copilotを利用されたことがある方を対象としており、それぞれの説明については割愛させて頂きます。
この記事は全4回のシリーズの第1回目です。第1回目では、環境の準備とテストの生成計画と手順について説明します。第2回目では、実際にテストの生成と評価の方法について説明する予定です。そして、第3回目では、e2eテストへの展開の可能性について説明する予定です。第4回目では、GithubのCIに組み込む手順を予定しています。

環境について

この記事で使用する環境は以下の通りです。
l  エディタ:VS Code
l  コンテナ:node:18-alpine
l  言語:Node.js 18系
l  テストフレームワーク:Jest
l  テスト生成ツール:Github Copilot

テストの生成計画と手順について

テストの生成計画

はじめに、テストの生成計画を作成します。ボタンひとつで全てのテストケースを自動で作成してくれると嬉しいのですが、残念ながら現時点で他のツールを利用していない状況の場合は実現が非常に難しいです。そこで、この記事では以下のような手順でプロジェクトに単体テストを少しずつ増やしていく手法を取ります。
1.     単体テストのファイルを作成する。
2.     作成したテストファイルにどのようなテストを実施したいのかコメントを残す。
3.     Github copilotがレコメンドしたテストファイルを適用する。
他にもGithub copilot chatを利用してファイルごと作成する方法もありますが、今回は対象外とします。もしご要望があればコメントで応援をお願いいたします。

精度の検証

テストの生成にGithub Copilotを使った場合、生成されたテストがすべて正しいとは限らないので、適切な検証が必要です。ここでは、レビュアーの指摘事項の数によってテストの精度を測る方法を紹介します。
1.     生成したテストケースを一度そのままコミットする。
2.     レビュアーと共にコミットした本人もレビューに参加し、テストケースの修正を実施する。
3.     0から単体テストを生成した場合と比べて、どの程度の労力がかかるかを検証する
この方法のメリットは、テストの精度を数値で評価できることです。生成AIでは評価の方法が様々ありますが、単体テストの生成のようなケースでは人間が評価するしかありません。そこで、copilotがプログラムを少し知っている新入社員と仮定し、みなさんのような先輩からレビューを受けるようなイメージをして頂ければと思います。

さいごに

生成AIを利用した手法は様々あるかと思いますが、これから4回に渡って連載する記事もあくまでも1つの例でしかありません。とはいえ、何もないところから生成AIの利用を検討するのも地図がない道のようで辛い思いをしてしまうかもしれません。みなさんの仮の地図として、ここを出発点に独自のテスト手法を完成して頂くことが出来れば幸いです。

第2回目では、今回の前提を踏まえて、実際にテストの生成とレビュープロセス、その結果の品質についてご紹介する予定です。