Visual Studio Team Servicesで単体テストの品質管理をする(23日目)

VSTSで実行する単体テスト

.NET CoreとVSTS

いろいろ調べてみたのですが、残念ながら現在VSTSのHosted Agentは1.0 preview2(3131)なので、VS2015ベースの.NET Core 1.0.0のみサポートです。

• VS 2017は.NET Core 1.1(Tooling Preview4)なので、Hosted agentではビルドできない
• VS 2017と.NET Core 1.1を入れてしまうとVS2015で.NET Core 1.0ベースのものが作れなくなってしまう(少なくとも私の環境では)
• 今のところ.NET Coreアプリのコードカバレッジや単体テストの集計は取れてない…

ということで、この手順を実施するなら、フル.NETアプリケーションでやってください。

ASP.NETプロジェクトのビルドテンプレート

以前はVisual Studioというテンプレートしかなかったのですが、今ではASP.NET Build(Preview)というテンプレートが用意されています。ほとんどVisual Studioと変わらないのですが、webdeployを使ったデプロイタスクが登録されているところが変わります。

はっきり言ってめんどくさい手順だったので、用意してくれるに越したことはありません。

注意点として、Visual Studio TestタスクのOverride Testrun Parametersで/logger:trx /UseVsixExtensions:trueを指定してください。

Code Coverageをチェックすると、コードカバレッジ情報が生成されます。

単体テストと品質履歴

単体テストを有効にしていると、このようにSummaryで単体テストと、コードカバレッジの結果が表示されます。

コードカバレッジに関しては、"Download Codecoverage Results"でダウンロードすると、Visual Studioで表示されるコードカバレッジと全く同じ結果が確認できます。

より詳細に見たい場合はSonarQubeなどを使うといいでしょう。C#であればプラグインは無償です(VB/VB.NETは有償)。

単体テストエラー発生時

一か所コントローラーの単体テストがわざと通らないような変更をコミットします。

当然ビルドが失敗します。

Test詳細ページで、具体的にどのテストが失敗したのか、何パーセントくらい失敗したか、確認できます。

先日、ダッシュボードにBuild状態を表示するタブを作りましたが、今回のようにテストが失敗すると、このように品質グラフや、デプロイの成功/失敗も一目でわかるようになります。

VSTSのダッシュボードはロールや自分たちの関心毎に作るのがいいように思います。

まとめといいわけ

ほんとはこの話はもっと前にやるはずだったのですが、.NET Core + VS2017プロジェクトのHosted Buildがどうしてもうまくいかず、いろいろ調べたらやっぱりだめそうというのがわかり、今日まで引っ張ってしまいました(反省)。

もう少し紹介したいことがありますが、それは25日超えてからにします。

明日はPowerShellアドベントカレンダーとの相乗りで一つ紹介します。

Visual Studio Team Servicesの外部サービス連携を使う-Teams編(22日目)

はじめに

VSTSには外部のWebサービスと連携する機能があります。イベントとしては多くないのですが、いろいろな通知が一か所にまとめられるといいものです。そんなサービス連携を紹介します。

Teamsとの連携

Microsoft Teams – グループ チャット ソフトウェア

TeamsはMSが先日からOffice 365サービスの1つとして提供している要はSlackやHipChat, ChatWorkみたいなやつです。Office 365のひとつなので、同じアカウントを共有するVSTSとの連携は結構楽です。ちょっとやってみましょう。

Teamsの設定に関しては省略します。

Teamsで通知用のチャネルを作っておいて、そのチャネルにVisual Studio Team Servicesのコネクタを追加します。

使用するアカウントおよび、VSTSのテナント名を指定します。既定ではデフォルトのMSアカウントになっているかもしれないので、気を付けてください。現時点において、MSアカウントを連携に使用することはできません。必ずOffice 365のアカウントを使ってください。

いつも通りアプリケーションの承認します。いつでもVSTS側で取り消しできます。

Teamsへの通知を指定します。ビルドやリリース、作業項目とかありますね。訳語がいまいち統一されていない(作業アイテムと作業項目など)のはスルーで。

区分と種類がありますが、ここでは全部通知させます。大きなチームになったら、VSTSのチームごとに通知とかにしましょう。VSTSでチームを作った場合、区分パスがそのままAreaに該当しているので、わかりやすいはずです。

kkamegawa.hatenablog.jp

チームに関してはこちらをどうぞ。

VSTSでWork Itemを作るとこのように通知されました。

チャネルへの通知は複数設定できます。同様にビルドが完了した通知を設定してみましょう(大体同じなので省略)。

こんな風にビルド完了通知がきます。

VSTSのService Hook

実はこの機能、TeamsがVSTSへのService Hookに登録することで実現しています。VSTSから外部サービスへの登録もできるのですが、office 365関係のサービスの場合、Office 365から操作することが前提になっています。VSTSからOffice 365のService Hookはしないでください(やろうとしてもエラーになります)。

こんな感じで、Office 365のWeb Hookが追加されています。ここから編集できそうな気がしますが、絶対に編集しないでください。削除する場合は必ずTeams側から実施します。

これはほかのOffice 365サービスのFlowを使う場合でも同じです。ちなみにFlowの場合はMSアカウントのVSTSのサービス呼び出しができるんですよね。はやくTeamsもサポートしてほしいものです。

Teams以外にもSlackやHipChatへの通知も標準で提供されています。ChatWorksはないようですが、Web Hookが提供されているので、それでやればいいんじゃないでしょうか。

まとめ

というわけで、VSTSの通知機能の紹介でした。Slack一強みたいな感じでしたけど、Teamsこれからどうなるんでしょうね。標準でOffice 365のアカウント連携して使えるのは非常に便利なので、Office 365ユーザーには受けそうです。

VSTSのAPIもartifactへのアクセス手段とかもうちょっとあればいいんですが(ないですよね…)。

www.visualstudio.com

Visual Studio Team ServicesのデータをPower BIで可視化する(21日目)

はじめに

VSTSのデータを可視化して一括で見たいという話はよくあります。そういうときのためにVSTSはPower BIでデータを抜き取って表示できます。Power BIはVSTSだけではなく、GitHubやほかのデータソースにもアクセスできます。MSDNを持っていれば有償のProが使えます。

blogs.msdn.microsoft.com

powerbi.microsoft.com

Power BIのサインアップについては省略します。

データを取得

データを取得から「サービス」の「取得」をクリック。

Visual Studio Team Servicesがあるので、「入手する」

接続先のアカウントは hoge.visualstudio.com であれば、hoge だけ入力します。Project名は * を入れれば全プロジェクトが対象になりますが、推奨されていません。見たいプロジェクトだけを指定します。

OAuth2で認証します。

アプリケーションの承認でVSTSへのアクセスを許可します。ちなみにMSアカウントで承認する場合、たまにデータの同期がとれなくなるようなので、見えなくなったら作り直したほうがいいようです。今回はどちらも同じ組織アカウントでやってるのでたぶん大丈夫の…はず。

データのインポートにはしばらく時間がかかります。終了後、初期データが見えます。ぼっちプロジェクトなので寂しいですｗ。

レポートでは各種の状態のレポートがタブになっています。ここではOpen状態のバグデータですね。

Scrumプロジェクトテンプレートで作っているので、Scrum Sprint Statusにもデータが入っています。AgileやCMMIタブには何も入っていないので、消してもいいでしょう。

Gitのコミット状態も見えます。TFVCで作っている場合、Team Foundation Version Controlタブで同様のデータが見えます。

Power BIサイトで見るのもいいですが、外部のWebページやVSTSのダッシュボードで見たいところですよね。「Webに公開」で埋め込み用のリンクが作成できます。

埋め込み用のコードを使う場合、プライベートなデータが意図せず漏れることになるので注意してください。今回の場合、プライベートであるVSTSに埋め込むので基本問題はありません。

ダッシュボードに昨日紹介した方法でPower BIというタブを作り、そこにhtmlウィジェットでPower BIのリンクを貼り付けます。iframeなどのhtmlタグは不要で、httpのリンクのみ指定します。

で、こんな風にVSTSにPower BIのデータが貼りつきます。簡単ですね！

作業項目でチャートを見る

作業項目に関してはWorkタブの中の各種クエリ結果をグラフで確認できます。

今回の場合Assigned to meのNew Chartから

Work Itemの種類を円グラフに。

棒グラフにしてみました。

まとめ

Power BIのコンテンツパック、実は更新されていないようで、例えば新しいビルドシステムやRelease Managementの状態が見えません。オンプレミスのTFSであればSQL Serverなので、どうにでもなる(最悪Power BIにみせればいい)のですが、VSTSの場合コンテンツパックを更新してくれないとどうしようもありません。

usersvoiceで言ってみてください(英語)。私からもちょっと聞いてみようとは思っています。

Visual Studio Team Serviceのダッシュボードを使って作業を可視化する(20日目)

はじめに

VSTSのチームを開いたとき、ダッシュボードが表示されます。デフォルトでも必要十分な情報がありますが、やはりダッシュボードであるからにはwidgetを貼りたいものです。ということで、ダッシュボードのカスタマイズ方法を紹介します。

初期状態

初期状態ではこんな感じですね。Dashboardの編集権限があるアカウントでは右下に鉛筆マークが出るので、ここをクリックして編集します。

Welcomeタブをクリックすると、チームのWelcomeページが表示されます。これはwelcome.mdというファイルになっているので、それを編集すればいいです。

右上のスパナアイコンをクリックすると、ダッシュボードにタブを追加できます。今回はBuildというタブを追加して、ビルドやリリース関係の情報を集めます。

Auto-refreshにチェックすると自動的に更新されます。ビルド状態のようにいつ変わるかわからないデータを表示するタブではチェックしましょう。

Widget紹介

• Assigned to Me : ログオンユーザーに割り当てられている作業を表示します。初期状態で表示されています。
• Chart for Build History : 指定したビルド定義の成功・失敗および所要時間の概略をグラフにします。
• Chart for Work Items : 指定した作業項目の種類に応じてグラフにします。

• Code Tile : コードリポジトリに対して変更された数を表示します
• Deployment status : デプロイ状態を表示します
• Embedded Webpage : 外部のページをiframeで表示します。

• Markdown : Markdownで書いた簡単なメモを表示します
• New Work Item : 新規のWork Item(Backlog, Task, Featuresなど)を作ります
• Other Links : Feedbackクライアントなどを起動するためのリンクです。

• Pull Requests : Pull Requestの一覧を表示します。
• Query Results : Workタブで作成したクエリの実行結果を表示します。
• Query Tile : 指定したクエリの件数を表示します。

• Release Definition Overview : リリース定義ごとの状態を表示します。
• Requirements Quality : 要求項目に対する自動テストの品質を表示します
• Sprint Burndown : スプリントのバーンダウンチャートです

• Sprint Capacity : スプリントごとの作業許容量です。これはわかりにくいので、次のSprint Overviewを使うことをお勧めします。
• Sprint Overview : スプリントの残り時間と消化した作業の割合を表示します。
• Team Members : チームに所属しているメンバーを表示します

• Team Rooms : あまり出来が良くないチャットみたいなやつです。SlackやOffice 365のTeamsを使ったほうがいいでしょう。
• Test results trend : 指定したテストの品質をチャートにして表示します。
• Visual Studio Shortcuts : Visual Studioを起動するためのリンクがあります。まぁ必要ないでしょう。

• Welcome : Welcomeページの内容です
• Work Links : 作業項目のリンクです。

下にあるExtensions Gallaryをクリックすると、Widgetのギャラリーが表示されます。

今日現在で24種類登録されています。GitHubとかAzure Application Insightsのウィジェットは結構便利そうです。FREEのものが多いですね。

ビルド関係のWidgetを追加する

順番が変わりましたが、Buildタブにビルド関係のウィジェットを追加してみましょう。Markdownはビルド時の注意事項などを書いておけばいいでしょう。ウィジェット右上の…からスパナアイコンをクリックすると、ウィジェットの設定ができます。

Chart for Build historyではTitleとビルド定義を指定します。一つのウィジェットに一つの定義しか設定できません。ビルド定義が増えた場合、タブを分割するとか、全部みるとか、ダッシュボードで工夫してください。以下同じです。

Deployment Widgetでは、ビルド定義、ブランチ名、リリース環境名、テスト結果をどのグラフで見るか選択します。

Release Definition overviewでは、参照するリリース定義を一つだけ指定します。

Test results trendでは指定したビルドの単体テストの品質をグラフにします。

ビルド関係のウィジェットを貼り付けてみました。いちいち定義を見なくても一覧で見えるので非常に便利ですね。

Widget SDK

www.visualstudio.com

WidgetはJavaScriptとhtmlで作ってzipにして公開することになるようですね。VSTSの全機能はまだWeb APIでアクセスできない…はずなので、一部に限られますが、外部サイトの情報を表示するのでもいいと思います。

まとめ

ダッシュボードでの視覚化は凝り始めるといろいろできますが、ビルドステータスとかは結構すぐに使えていいと思いますよ。