幾度、繰り返されるサービスのリリース作業やテスト作業に悩まされる企業は多く存在します。
数百や数千に及ぶテストケースを毎回テスト環境で動作確認を行って、次にステージング環境で同じ作業をまた行います。
最後にステージング環境と本番環境をスワップすると言った手順をソフトウェアの開発では日々に行っております。
しかし、世の中のサービス提供スピードは日々加速していて、
人力で毎回テストケースを確認したり、環境の公開作業をしていては世の中のスピードに出遅れてしまいます、
そこでCI/CDの環境が用意できれば、人力を使わずに自動で毎回テストケースの確認作業や環境の公開作業をさせることができます。
素晴らしいことがいっぱいのCI/CDの環境なのですが、
いざ構築してみようとすると多くのインフラ知識が必要だったり、
サーバの立ち上げやソフトウェアのインストール作業が大量に待っています…。
そこで「Visual Studio Team Services」を利用すればメニューから選択するだけで、
誰でも簡単にCI/CDの環境が構築できます。
今回は「Visual Studio Team Services」でCI/CDの環境を用意して、
「ASP.NET MVC」の「プロジェクト」が「コミット＆プッシュ」されると、
自動で「ユニット テスト」の確認が行われて「Azure Web Apps」に「デプロイ」させる方法ついて紹介したいと思います。
（Visual Studio Team Servicesはサービス名が長いので以降VSTSと略します）
環境構築の大まかな流れ
1. ホームページでVSTSのサービス登録を行います。
2. 登録されたVSTSプロジェクトをVisual Studioにクローンします。
3. Visual StudioでASP.NET MVCのプロジェクトを作成します。
4. 作成されたASP.NET MVCプロジェクトをコミット＆プッシュします。
5. VSTSでビルドパイプラインを作成して実行させます。
(※Azure Web Appsに自動デプロイする場合はAzureアカウントの連携が必要になります)
前提知識
- Visual Studio Team Services(Service)
- Azure Web Apps(Service)
- Visual Studio(C#)
- ASP.NET MVC(MSDN)
- Unit Test(MSDN)
必要なステップは大きく分けて３つ
- VSTSプロジェクトの作成
- Visual Studioソリューションのコミット＆プッシュ
- VSTSビルドパイプラインの作成
VSTSプロジェクトの作成
Visual Studio Team Servicesのサイトにアクセスして、画面中央にある「Start free」を選択します。
「プロジェクト登録」画面では「名前」を入力して「続行」をクリックします。
(海外で利用する場合は詳細のメニューから地域を変更してください)
「プロジェクト」画面では最初に「MyFirstProject」が用意されているので「Clone in Visual Studio」をクリックします。
「Chromeブラウザ」を使っている場合はポップアップが表示されるので「Microsoft Visua…ndler Selector を開く」をクリックします。
Visual Studioソリューションのコミット＆プッシュ
「VisualStudio」が起動するとログインを要求されるので、VSTSと同じ「MSアカウント」でログインします。
ログインが成功したらVSTSからプロジェクトのクローンを行います。
画面の右下にある「Clone」をクリックします。
「VSTSのプロジェクト」は空の状態なのでクローンはすぐに終わります。
次に「VSTSにプロジェクト」の中身を追加します。
「Visual Studio」画面の右側にある「チームエクスプローラー」をクリックして、
ソリューションの「新規作成」をクリックします。
「新しいプロジェクト」画面では「Visual C#」の「Web」の「ASP.NET Web アプリケーション (.NET Framework)」を選択して「OK」をクリックします。
「新しい ASP.NET Web アプリケーション」画面では「ユニット テストを追加する」をチェックしてから「OK」をクリックします。
(ここで用意したユニットテストが自動で確認されます)
「ASP.NET MVC」のプロジェクトが作成されると「ソリューションエクスプローラー」に「WebApplication*」と「WebApplication*.Tests」二つのプロジェクトが表示されます。
次に作成した「ソリューション」を「VSTSのGit」に「コミット＆プッシュ」します。
「チーム エクスプローラー」に切り替えてプロジェクトメニューから「変更」をクリックします。
「変更」メニューでは「テキストボックス」に「コミットメッセージ」を入力して「すべてをコミットのメニュー」から「すべてをコミットしてプッシュ」をクリックします。
「コミット＆プッシュ」が完了するとポップアップ情報で「Successfully pushed branch master to origin. Create a pull request to review your changes.」が表示されます。
VSTSのビルドパイプラインの作成
「Visual Studioのソリューション」が「VSTSのGit」に追加されたので、
次に「VSTSビルドパイプライン」を作成していきます。
画面中央にある「Set up Build」をクリックします。
「VSTSのGit」を使うので、
何も選択せずに「Continue」をクリックします。
「ASP.NET」のプロジェクトを「Azure Web App」に自動デプロイさせたいので、
「Azure Web App for ASP.NET」を選択して「Apply」をクリックします。
「Azure」のアカウントが連携されていない場合は「Manage」を選択して連携作業を行ってください。
（既に連携済みの場合は次の画像になります）
「Azure」のアカウントが連携されたら「Azure subscription」と「Azure service name」が選択できるので対象となる「Azure Web App」を選びます。
次に「ビルドパイプライン」の「実行トリガー」を設定します。
メニューのビックリアイコンが付いている「Triggers」をクリックして、
右側の「Enable continuous integration」のチェックを外します。
「Enable continuous integration」のチェックが外れるとビックリアイコンが付いていた「Triggers」が正常になります。
ビックリアイコンが無くなったのを確認して再度「Enable continuous integration」にチェックを付けます。
今度は「Enable continuous integration」にチェックが付いていても「Triggers」にビックリアイコンが付いていません。
右側の「Branch filters」で「master」ブランチが選択されていれば成功です。
最後にこの「ビルドパイプライン」を保存して実行します。
メニューから「Save & queue」を選択してクリックします。
保存する内容の確認画面が表示されたら「Save & queue」をクリックします。
次に実行の経過を確認してみます。
画面のナビゲーションバーから「Build and release」を選択して「Builds」をクリックします。
「Build pipeline」画面に「MyFirstProject-Azure Web App for ASP.NET-CI」の項目が追加されています、右側の「Status」が「in progress」になっているのを確認してクリックします。
（「Status」が「in progress」になっていない場合はどこかで設定を間違えている可能性があります）
「Build pipeline」画面で対象の「パイプライン項目」をクリックすると「Summary」画面に移動します。
「Summary」画面で少し待つと「Branches」の「master」が「in progress」から「passing」に変化します。
「Recently completed」の項目に表示されている「日付と番号」の項目をクリックします。
今回は「ASP.NET MVC」のプロジェクトを作成する時に「ユニットテスト」を選択したので、自動テストが行われた結果を確認してみたいと思います。
中央にある項目の「Tests」をクリックします。
テスト結果画面では左側にある「Total tests」でテスト件数や
「Passed」「Failed」で成功件数と失敗件数などを確認することができます。
最後に途中で既に届いているかも知れないが、
VSTSアカウントで登録しているメールアドレス宛に「ビルドレポート」が毎回届くようになります。
まとめ
今回はVSTSを利用することで簡単にCI/CDの環境構築が行える方法を記載いたしました。
ビルドパイプラインは一度作成した後でも追加でサービスを足したり削ったりすることができます、更に実行トリガーを変更することで定時実行やビルド時間が凄いかかるようなプログラムの場合に夜間で行わせることができます。
実はVSTSはCI/CDの環境構築を簡単に行えるだけでなく、
タスクの管理まで行うことが可能です、時間がある際にはそちらの方法についても記載したいと考えております。
おまけ
VSTSの自動テストが凄い便利でよく作られていたので、
ワザと失敗するテストケースを用意して、
実行された際にどのように表示されるのかを試してみました。
「WebApplication*.Tests」プロジェクトの「HomeControllerTest.cs」ファイル内にある「Contact」アクション内に「Assert.Fail()」の一行を追加します。
「HomeControllerTest.cs」ファイルを保存して「チーム エクスプローラー」の「変更」で「すべてをコミットしてプッシュ」をクリックします。
VSTSの「ビルドパイプライン」を確認すると「Branches」の「master」が「failed」に変わっています。
「Recently completed」の項目に表示されている失敗した「日付と番号」の項目をクリックします。
中央にある項目の「Tests」をクリックします。
テスト結果画面では3件中2件が成功して1件が失敗しているのを確認できます。
更に失敗した「テストケース」は「メソッド名」が一番下に表示されているので、
クリックすれば詳細画面でスタックトレースを確認する事ができます。
そして、アカウントで登録しているメールアドレス宛に失敗した事を知らせる「ビルドレポート」もちゃんと届きます、メールのタイトルに「failed」と書かれているので「フィルター」機能を利用すれば、失敗した場合は携帯に転送とかも出来そうですね！