a2 Tech blog

試したこと・調べたこと・感じたことを発信するITエンジニアの日記です。仕事とは直接関係ないけど興味あることを模索していきます。

Visual Studio Team ServicesでCoded UI TestのBuild/Releaseパイプラインを作る

f:id:ninna2:20170411015358j:plain:w240

Coded UI Test を Visual Studio Team Services と連携して動かせるようにBuild & Release パイプラインを構築することをやってみたいと思います。Build & Release パイプラインを作ることにフォーカスしますので、Coded UI Testのやり方とかは過去記事を参考にしてください。

こんな感じの手順になります。

  • Build Agentの有効化
  • サンプルアプリケーションのビルド定義
  • Coded UI Testの作成
  • テストコードのビルド定義
  • アプリケーション/テストのリリース定義
  • リリース実行(テスト実行)

VSTSのプロジェクトの作成や、今回は使用しているAzureの設定などの細かいところは割愛してます。さて、始めていきましょう。

Build Agentの有効化

ビルドサーバをAzure上に構築して、Build AgentとしてVSTSから認識させます。こうすることで、テスト対象のアプリケーションやテストモジュールをBuild Agent経由でデプロイ、テストの実施を行えるようになります。VSTSとオンプレミスの環境の組み合わせや、Azure上でもロードバランサ等で区切られたネットワーク環境に対してデプロイしたいケースなどで有効な手段です。

一応、Build Agentの設定方法を前回記事にしておきましたので、構築の参考にしてください。ちなみに、前回記事では、Visual Studio 2017 on Windows Server 2016で構築していますが、わけあってVisual Studio 2015 on Winodws Server 2012 R2 で構築しています。Windows Server 2016で実は最初やってみたのですが、Build Agentから各サーバへのWinRMでうまくいかなくってTest Agentがデプロイできないという問題がありました。これについては解決できなかったので継続調査が必要です。セキュリティ周りでの設定があやしいなと思ってます。

ninna2.hatenablog.com

Build Agentが設定できると、VSTSのAgent queuesから見ると緑色になって正しく認識されていることがわかります。

f:id:ninna2:20170528221623j:plain

サンプルアプリケーションのビルド定義

サンプルアプリケーションには、前回のBuild Agentの作成でも使用した電卓アプリケーション(Simple Calculator)を使っていきます。これです。

code.msdn.microsoft.com

ソースコードは公開されているので取得して、VSTSのGitリポジトリに格納しておきます。

f:id:ninna2:20170528222724j:plain

サンプルアプリケーションのソースコードの準備ができたのでビルド定義を作成していきます。"Build & Release"から"Builds"とたどっていきます。"+ New definition"をクリックして、ビルド定義を追加していきます。Templateは、"Visual Studio"を選択し"Apply"。Nameは任意の名前を入力し、Solutionは“Simple Calculator/MyCalculatorv1.sln”を指定します。

NuGet、Copy Files、Publish Build Artifactsは不要なので削除します。代わりにCopy and Publish Build Artifactの追加します。Copy and Publish Build Artifactsの設定を入力していきます。"Copy Root"は。"…“から今回の対象アプリケーションのrootフォルダ(Simple Calculator)を指定、"Contents"は”**\bin"と入力、"Artifact Name"には"drop"と入力、"Artifact Type"には"Server"と入力します。

f:id:ninna2:20170522150201p:plain

“Variables"タブから、BuildConfigurationを"release"から"debug"に変更しておきます。また、"Options"の"Default agent queue"を"Hosted"からBuild Agentでビルドする方式(私の場合は "AzureVS2015”)に変更します。

これで定義変更は出来たので保存とビルド実行(Save & Queue)を行います。ビルド成功すればOKです。

Coded UI Testの作成

Coded UI Testのコードを作成していきます。サンプルアプリケーションが実際に実行される環境とPathなどを合わせないといけないので、今回は、C:\drop\配下にサンプルアプリケーション(MyCalculatorv1.exe)が配置される 想定で進めます。テストコードを作成する端末にC:\drop\MyCalculatorv1.exeを配置します。ビルド済みのモジュールはビルド実行した際のArtifactから取得して下さい。

配置で来たら、早速テストコードを作成していきます。まず、Visual Studioを起動します。Coded UI Testを行うためには、Enterpriseエディションでないといけないので、その点だけ注意してください。

私がいつもテストを組む時にやる方法としては、アプリケーションの起動部分と起動後のテスト実施部分を分離して定義していきます。アプリケーションの起動は、毎回同じ操作になるはずですので、TestInitiaraizeにて行えばよく、毎回行う必要性がないからです。

TestInitialize()部分にアプリケーションの起動部分をBuilderを使って記録していきます。極力マウスにて操作するのでなくキーボードのみで操作する方が後からの再現性を保証できるので良いかと思います。

f:id:ninna2:20170528225054p:plain

次にそれぞれのテスト部分を作成します。とりあえずテストケースが1つ作成できればよいので、適当な動作を記録してテストケースとしています。[1000-273]という計算をテストケースにしました。

f:id:ninna2:20170528225446p:plain

かなり割愛しながら説明しているので、細かいCoded UI Testの記録方法を知りたい方は、私の過去記事を参照していただければと思います。Webシステムを対象にしてますがクライアントアプリケーションでも基本の操作は変わりませんので。

ninna2.hatenablog.com

テストコードが作成できたら、VSTSのGitリポジトリにPushします。とその前に、サンプルコードとテストコードのリポジトリは分けておくべきなので、新しいリポジトリ(CuitPrjにしました)を作成しておきます。テストコード格納用のリポジトリに、今回作成したCoded UI TestのコードをPushします。こんな感じですね。

f:id:ninna2:20170528225918j:plain

テストコードのビルド定義

テストコードに対するビルド定義を行っていきます。サンプルコードのビルド定義の作成とほぼ類似しているので割愛します。注意点は有効化したBuild Agentでビルドするようにすることぐらいですかね。

f:id:ninna2:20170528230130j:plain

アプリケーションとテストモジュールのリリース定義

サンプルアプリケーションとテストコードの準備ができたので、リリース定義を作成していきたいと思います。今回構成的には、Build Agentとは別にテストを実行するマシンを別途Azure上に作成しています。内部IPは、10.0.0.7になってます。Windows Server 2016で検証した残骸が残っているので台数が多くなってますが使うのは、下の2台のみです。テスト実行のマシンには、Windows Server 2012 R2 Datacenter を選択しました。DevTest Labsで雛形が用意されているものです。

f:id:ninna2:20170528231202j:plain

リリース定義を行なっていきます。"Build & Release"から"Releases"に進み、新しくリリース定義を作成します。テンプレートから定義を作成する必要がないので"Empty"で始めます。

リリース定義は4タスクで構成します。

  • Windows Machine File Copy(サンプルアプリケーションの配置)
  • Windows Machine File Copy(テストコードの配置)
  • Visual Studio Test Agent Deployment
  • Run Functional Test

全体設定と追加した4タスクの設定していきます。まずは、Run on agentを設定します。設定変更箇所は1箇所のみです。"Deployment queue"に Build Agentで有効化したもの を指定します。こうすることで、Build Agentが起点となり全てのタスクが動きます。

f:id:ninna2:20170528231826j:plain

サンプルアプリケーションの配置を行うための設定をします。Sourceには配置すべきアプリケーションを指定します。"MyCalculatorv1.exe"です。Machineには、Build Agentから見たときのアクセスIP を指定します。ログインユーザーとパスワードは、後で説明しますがVarablesで定義した変数で指定します。最後に、Distination Folderを今回のアプリケーションの配置先である “C:\drop\” と指定して完成です。

f:id:ninna2:20170528231844j:plain

テストコードの配置も、アプリケーションの配置とほぼ同じです。配置対象は、DLLです。また、“C:\test\” を配置先にしています。

f:id:ninna2:20170528231916j:plain

Visual Studio Test Agent Deploymentタスクもあまり迷うところはないかと思いますが、Version2.*を使ってみたのと、Run UI Tests というチェックボックスがあるのでそこをチェックするぐらいが注意点です。

f:id:ninna2:20170528231939j:plain

Run Functional Testタスクですが、Machineを指定するだけですので難しくないかと思います。

f:id:ninna2:20170528232002j:plain

最後に、“Variables” にユーザー名とパスワードを変数定義しておきます。こうすることで、$(myuser)と$(mypass)に値が入るようになります。パスワードは見られたくないので、横の鍵マークを押しておくと良いかと思います。

f:id:ninna2:20170528232327j:plain

リリースの定義がこれです完成しました。

リリース実行(テスト実行)

さて、実行してみます。実行は"+Release"をポチッと押すだけです。そうすると動き始めます。Test Agentの設定が思ったより時間がかかりますが設定があっていれば無事完了します。

f:id:ninna2:20170529015722j:plain

途中、テスト実行のVMを覗いているとちゃんとテストが実行されている様子がわかると思います。誰も触ってないのに勝手に動き出したってなります。

f:id:ninna2:20170529015909j:plain

駆け足でしたが、Visual Studio Team ServicesでCoded UI Testを動かすCI/CDパイプラインを作成してみました。基本的な組み方さえわかってしまえば、複数のサーバに展開してもいいし、Webアプリケーションのテスト自動化に使ってもいいし、色々考えられます。UIテストを継続的に実施するとハードルがVSTSを使うことで少しでも緩和されて生産性が向上するはずです。

細かい説明を割愛してますので過去記事も合わせてご参照ください。では!!