コード化された UI テストをさまざまなブラウザで

ゴール

• Web アプリをテスト
• さまざまなブラウザで
  • テストコードは共有したい
• 環境: Visual Studio 2017

---

前半：コード化された UI テスト

• 公式ページ

  • UI オートメーションを使用してコードをテストする
  • https://msdn.microsoft.com/ja-jp/library/dd286726.aspx

---

1. テストを追加

• コード化された UI テスト プロジェクト を追加する
• 2つ目以降の CodedUITest を追加するには
  • プロジェクトを右クリック > 追加 > コード化された UI テスト

---

トラブルシューティング: コード化された UI テストが無い

• Visual Studio のメニューに コード化された UI テスト が無い
  • 次のコンポーネントのインストールが必要
  • Visual Studio Installer > Visual Studio Enterprize 2017 > 変更 > 個別のコンポーネント > デバッグとテスト > コード化された UI テスト

---

2. レコーディング

• IE を立ち上げておいて、レコーディング開始

---

3. ブラウザ (IE) を起動するコードを追加

BrowserWindow.Launch(
    new Uri("https://www.google.com/"));

---

Tips: コードで起動したブラウザをテストにアタッチ

• UIMap.uitest で Window の 検索プロパティ を Name - Contains - google などと指定する

---

トラブルシューティング: テストが認識されない

• テスト エクスプローラーに出てこない
• [TestMethod] が水色にならない
  • .csproj で PropertyGroup の中の IsCodedUITest の値を True にする

---

後半：さまざまなブラウザで実行

• 公式ページ

  • コード化された UI テストでのさまざまな Web ブラウザーの使用
  • https://msdn.microsoft.com/ja-jp/library/jj835758.aspx

---

1. Selenium をインストール

• Selenium components for Coded UI Cross Browser Testing
• https://marketplace.visualstudio.com/items?itemName=AtinBansal.SeleniumcomponentsforCodedUICrossBrowserTesting

---

2. レコーディング

• レコーディングできるのは IE のみ

---

3. 再生する

• IE で再生するには BrowserWindow.CurrentBrowser に "IE" と設定する（既定値）
• IE 以外のブラウザのときはここを変える
  • IE 以外のブラウザは Selenium 経由で起動される

---

コード例: Chrome を起動する

BrowserWindow.CurrentBrowser = "Chrome";
BrowserWindow.Launch(
    new Uri("https://www.google.com/"));

---

Tips: 連続実行

• ブラウザを変えながら連続実行するには
  • 同一[TestMethod] 内では難しい
  • [TestMethod] は分けておいて、それら複数テストの実行ならばできる
  • それぞれの [TestMethod] から共通のテストコードを呼べばよい

---

ブラウザ対応状況

ブラウザ	CurrentBrowser名	制限
Edge	MicrosoftEdge	日本語入力できない (後述)
Chrome	Chrome
FireFox	FireFox	v48 以降は動かない
Opera	(未対応)

---

トラブルシューティング: Edge で日本語入力できない

Edge で日本語入力できない問題は、 ExecuteScript で回避できます。

public void RecordedMethod1()
{
    ...
    //uINameEdit.Text = this.RecordedMethod1Params.UINameEditText;
    this.UIHogeWindow.ExecuteScript($"document.getElementsByName('Name')[0].value = \"{this.RecordedMethod1Params.UINameEditText}\"");
    ...

---