6. 6
Visual Studio Mobile Center にログインしました。今回のハンズオン用のアプリケーションの設定を行います。
1. 表示されている [username] の値を記録します。
2. [Choose username] をクリックします。
3. [Add new app] をクリックします。
Visual Studio Mobile Center のアカウント作成 (3)
32
1
7. 7
1. [Name] には、[AndroidDemo] と入力します。
2. [OS] には、[Android] を選択します。
3. [Platform] には、[Xamarin] を選択します。
4. [Add new app] をクリックします。
Visual Studio Mobile Center のアカウント作成 (4)
1
2
3
4
9. 9
Visual Studio Mobile Center にログインしているユーザーパスワードを設定します。
1. [ユーザー] アイコンをクリックします。
2. [Account Settings] をクリックします。
Visual Studio Mobile Center のアカウント作成 (6)
1
2
10. 10
1. [Password] をクリックします。
2. [Send set password email] をクリックします。
3. [メール送信が完了した] 旨のメッセージが表示されていることを確認します。
Visual Studio Mobile Center のアカウント作成 (7)
1
2
3
11. 11
1. マイクロソフトアカウントに紐づいたメールボックスにメールが届いています。[Set your password] をクリックします。
2. 設定したいパスワードを入力します。自由に入力いただいて結構ですが、特になければ[Welcome00] と入力します。
3. [Change password] をクリックしてパスワードを設定します。
Visual Studio Mobile Center のアカウント作成 (8)
1
2
3
56. 56
Visual Studio Team Services のソースコードを Visual Studio Mobile Center でビルドして成果物をダウンロードします。
1. ブラウザーで Visual Studio Mobile Center の画面に移動します。[Build] をクリックします。
2. 連携するコースコード管理サービスを選択します。[Visual Studio Team Services] をクリックします。
Visual Studio Mobile Center でビルド (1)
2
1
57. 57
Visual Studio Mobile Center から Visual Studio Team Services へのアクセス承認画面が表示されます。
1. [承認] をクリックします。
Visual Studio Mobile Center でビルド (2)
1
58. 58
1. 連携する Git リポジトリのリストが表示されます。[MyFirstProject] をクリックします。
Visual Studio Mobile Center でビルド (3)
1
76. 76
作成した UI テストを Visual Studio Mobile Center 上で実行します。
1. 26行目のコメントアウトします。
2. [すべて保存] アイコンをクリックして、ソースコードを保存します。
Visual Studio Mobile Center での UI テストの実行 (1)
2
1
77. 77
作成した UI テストを Visual Studio Mobile Center 上で実行できるようにパッケージをアップグレードします。
1. Visual Studio のメニュー [ツール] – [NuGet パッケージマネージャ] – [ソリューションの NuGet パッケージの管理]
の順にクリックします。
Visual Studio Mobile Center での UI テストの実行 (2)
1
79. 79
1. Visual Studio のメニュー [ビルド] – [ソリューションのビルド] の順にクリックして、ビルドを実行します。
Visual Studio Mobile Center 上で UI テスト実行設定を行います。
2. ブラウザーで Visual Studio Mobile Center にアクセスし、[Test アイコン] をクリックします。
3. [Try automated UI testing] をクリックして、UI テストを有効化します。
Visual Studio Mobile Center での UI テストの実行 (4)
1
2
3
80. 80
1. New test run をクリックします。
Visual Studio Mobile Center での UI テストの実行 (5)
1
82. 82
1. Android 6.0.1 OS のデバイスを 3 つ選択します。リストの上から 3 つ選択するとテスト実行時間の待ち時間が増える
場合があります。
2. [Select 3 devices] をクリックします。
Visual Studio Mobile Center での UI テストの実行 (7)
1
2
83. 83
1. [System launguage] は [Japanese (Japan)] を選択します。
2. [Test framework] は、[Xamarin.UITest] をチェックします。
3. [Next] をクリックします。
Visual Studio Mobile Center での UI テストの実行 (8)
1
2
3
84. 84
Visual Studio Mobile Center での UI テストの実行手順の記載があることを確認します。
1. [Running tests] の [copy to clipcoard] をクリックしてコピーして、メモ帳などに貼り付けします。
2. [Done] をクリックします。
Visual Studio Mobile Center での UI テストの実行 (9)
1
2
85. 85
1. Node.js をインストールします。 https://nodejs.org/ja/download/ にアクセスして [Windows Installer] をクリッ
クし、Node.js インストーラーをダウンロードします。
Visual Studio Mobile Center での UI テストの実行 (10)
1
86. 86
1. ダウンロードした Node.js インストーラーをダブルクリックします。
2. Node.js のインストールウイザードに従って Node.js のインストールを
実施します。
Visual Studio Mobile Center での UI テストの実行 (11)
1
2-1 2-2 2-3
2-4 2-5 2-6
87. 87
1. Mobile Center CLI をインストールします。Windows の検索ボックスで [cmd] と入力します。
2. 検索結果から [コマンドプロンプト] をクリックします。
3. コマンドプロンプト上で [npm install -g mobile-center-cli] と入力してから [Enter キー] を押して、Mobile
Center CLI をインストールします。
Visual Studio Mobile Center での UI テストの実行 (12)
2
1
88. 88
Mobile Center CLI から ログインコマンドを実行します。
1. コマンドプロンプト上で [mobile-center login] と入力してから [Enter キー] を押します。
2. [Enable telemetry?] には、[Yes] と入力してから [Enter キー] を押します。
3. ブラウザーが開いてアクセスコードが表示されます。[コピーアイコン] をクリックしてアクセスコードをコピーします。
4. コマンドプロンプト上でアクセスコード貼り付けしてから [Enter キー] を押します。
5. [Loogin in as [ユーザー名]] と表示されていることを確認します。
Visual Studio Mobile Center での UI テストの実行 (13)
2
1
4
3
5
89. 89
Mobile Center CLI から UI テストを実行します。
1. コマンドプロンプト上で [cd “DocumentsVisual Studio 2017Projects“]と入力してから [Enter キー] を押し、
プロジェクトフォルダーに移動します。
2. 先ほどコピーした mobile-center コマンドを実行します。テレメトリの質問は [Y] と入力します。
• [pathToFile.apk] は、[C:Users(ユーザー名)DesktopApp1.App1.apk] と置き換えます。
• [pathToUITestBuildDir] は、[UITest1UITest1binDebug] と置き換えます。
3. 10 分程度待つとテストが終了します。今回は失敗していることを確認します。
Visual Studio Mobile Center での UI テストの実行 (14)
1
2
3
90. 90
1. UI テスト結果を確認します。ブラウザーで Visual Studio Mobile Center にアクセスし、[Test] をクリックします。
2. 先ほどコマンドラインで実行した UI テストの結果が表示されています。クリックします。
Visual Studio Mobile Center での UI テストの実行 (15)
1
2
95. 95
Visual Studio Mobile Center では、成果物をユーザーに配布することも行えます。
1. ブラウザーで Visual Studio Mobile Center にアクセスし、[Distribute アイコン] をクリックします。
2. [Distribute new release] をクリックします。
ユーザーへの配布 (1)
1
2
100. 100
手順書
• Team Foundation Server / Visual Studio Team Services 体験
• Visual Studio + Team Foundation Server / Visual Studio Team Services による開発業務効率化体験
• Visual Studio と Team Foundation Server / Visual Studio Team Services で実現するビルド・テスト・
デプロイ自動化
• Visual Studio と Team Foundation Server / Visual Studio Team Services で実現するビルド・テスト・
デプロイ自動化 + Azure 仮想マシン起動自動化
• Team Foundation Server 2015 Update 3 インストール
• Team Foundation Server 2015 Update 3 へのアップグレード
• Team Foundation Server 2015 によるテスト工数削減
• Team Foundation Server プロセステンプレートの変更
• Entity Framework 6.1.3 + ASP.NET MVC 5 サンプル アプリケーション構築
• Entity Framework 6.1.3 + Windows フォーム サンプル アプリケーション構築