Visualizer機能"Automator"と"Collab"の基本的な使い方

# 目次
1. はじめに
1. Visualizer V9で増えた機能
1. Automator機能について
1. Collab機能について
1. まとめ
1. 参考
# 1.はじめに
Visualizerの左側にあるナビゲーションバーは、Visualizerの重要な機能へのショートカットで構成されています。
この記事では、Visualizer V9で強化された4機能の中で「Automator」と「Collab」を紹介します。
※「Hikes」と「Quantum IQ」は以下の記事で紹介していますので、気になる方はこちらをご確認ください。

https://qiita.com/Kony_Team/items/64c2f910bcfe1874cf17
# 2.Visalizer V9で増えた機能
Visualizer V8とV9を比較するとV9では、左のナビゲーションバーに以下4つの新機能が追加されています。
- **Automator：**
Automatorは最新の実行済みテストケースを表示することができます。テストの実行時間、テストが実行されたチャンネル、テスト結果などの詳細を確認することができます。
この機能の詳細については、「3.Automator機能について」で説明しています。
- **Collab：**
Collabは、同じプロジェクトで作業している開発者のアクティビティを追跡するのに役立ち、また複数の開発者が1つのファイルで作業している場合、アラートメッセージを表示します。
この機能の詳細については、「4.Collab機能について」で説明しています。
- **Hikes：**
Hikesは、Visualizerの基本的な使い方をステップバイステップの対話型ウォークスルーで説明します。
この機能の詳細については、[こちら](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Default.htm#Hikes.htm)をご覧ください。
- **Quantum IQ：**
Quantum IQは、Visualizerユーザーが様々なチャネル向けのアプリケーションを作成する過程を支援するために設計されたチャットボットです。
この機能の詳細については、[こちら](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Default.htm#Kony_IQ.htm)をご覧ください。

# 3.Automator機能について
Visualizer V9以降、Konyはテスト自動化機能を導入し、Jasmineテストフレームワークの機能を利用して、アプリケーションのアクティビティを記録し、テストスクリプトを生成することができるようになりました。
さらに、Wait、Assert、Scroll to Widgetなどの特定のアクションを追加することで、記録したテストスクリプトを編集することができます。アクションを設定したら、生成されたテストスクリプトをシステム上のVisualizerのライブプレビューオプションやモバイルデバイスで実行して、アプリケーションをテストすることができます。

- **どのテストケースを自動化するか？**
自動化するテストケースは、自動化の ROI を高めるために以下の基準で選択することが考えられます。
  - ビジネスクリティカルなテストケース
  - 繰り返し実行されるテストケース
  - 手動で実行するのが非常に面倒、または困難なテストケース
  - 時間がかかるテストケース

- **Jasmineの分類**
また、Jasmineでは、テストリソースをその階層に応じて以下3種類に分類しています。
  - **Test Case**
Test Caseの作成方法については、[こちら](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/TestAutomation.htm#Test)を確認してください。後段ではTest Case Recorderの使用方法についてお伝えします。
  - **Test Suite**
詳細については、[こちら](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/TestAutomation.htm#Test2)を確認してください。
  - **Test Plan**
詳細については、[こちら](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/TestAutomation.htm#Test3)を確認してください。

- **Test Case Recorder の使用方法**
1. [Record]を押します。
1. デバイス上で行ったすべてのアクションは、TestCase Recorder に記録されます。![画像1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/592264/59794c69-1ccc-fbf0-62ce-e3f6f2feee88.gif)
1. 必要なケースを記録したら、テストケース名を作成し、停止を押して保存してください。
1. [ACTIONS]パネルから、対応するユーザーアクティビティに対して、以下のアクションのいずれかを選択します。
    - **Assert:** ウィジェットの指定されたプロパティの値を検証します。
    - **Screenshot:** デバイス上のアプリのスクリーンショットを撮影します。このアクションは、ネイティブアプリケーションにのみ適用され、デスクトップ Web アプリケーションには適用されません。
    - **Wait:** 選択されたアクションが実行された後、指定された時間だけ次のアクションを遅らせます。期間はミリ秒単位です。
    - **Wait for:** 選択したユーザーアクティビティに関与するウィジェットに適用されます。待機中のウィジェットが表示されるまで、選択したアクションを遅延させます。
    - **Scoll To Widget:** アプリケーション上の指定されたウィジェットにスクロールします。
    - **Scroll To Row** セグメントウィジェットの指定された行にスクロールします。
    - **Record From Here:** 録画中の選択されたアクションから録画を開始します。
1. 以下は、期待される結果が 0 より大きいオートメーションテストの例です。 ![画像2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/592264/03efeb85-2379-b2e1-3a21-84949124ef5d.gif)



●**主な機能**

**1. ダッシュボード**
- Automator は、最新の実行済みテストケースをワンストップで表示することができます。また、テストの実行時間、テストが実行されたチャンネル、テスト結果などの詳細を確認することができます。
- 必要に応じて、ダッシュボードで過去 5 回実行したテストや、記録したテスト スクリプトを表示することができます。さらに、プロジェクトエクスプローラーの Test Resources フォルダに移動しなくても、ダッシュボードから新しいテストケースを記録することができます。
- Dashboard 上では、以下の作業を行うことができます。
  - [テスト履歴を表示](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/TestAutomation.htm#View)
  - [実行されたテスト スクリプトの記録を表示](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/TestAutomation.htm#Play)
  - [新しいテストケースを作成](https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/TestAutomation.htm#Create2)
- Visualizer の左側のナビゲーションバーに Automator のアイコンがあります。アイコンをクリックすると、ダッシュボード ウィンドウが表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/592264/dda3b7be-8a57-41d9-c598-fb375fae72f3.png)

**2. テストリソースのデプロイ**
- testPlan.js ファイルはチャンネルごとに存在し、テストレコーダーを開かずにアプリを起動したときに実行されます。テストスクリプトが生成されたら、テストリソースをデプロイして、サーバーからテストスクリプトを取得し、アプリケーションをテストします。
- アプリケーションをデプロイするには、次の手順に従います。
1.Visualizerのプロジェクト・エクスプローラーから、Test Resources > Jasmineに進みます。
2.Jasmineを右クリックし、デプロイを選択します。

# 4.Collab機能について
- Visualizer を使ったアプリケーションの開発には、他のソフトウェア開発と同様、他の開発者との共同作業が発生します。共同作業はアプリの開発を加速させ、効率を高め、時間を節約しますが、問題も起こります。主な問題の1つは、コードのマージに関するコンフリクトです。
Visualizer V9 では新機能 Collab が導入され、Git をコラボレーションツールとして使用しながら、 一つの Visualizer プロジェクトで作業している開発者と連携できるようになりました。
- Collab は同じプロジェクトで作業している開発者の活動を追跡し、複数の開発者が1つのファイル で作業している場合は警告メッセージを表示します。Collab ウィンドウは、GIT リポジトリのリモートプロジェクトにコードがプッシュされたときに発生する可能性のあるマージの競合を強調表示してくれます。

- **Collab インストールと設定プロセス**
Collabのインストールと設定には以下3つのプロセスがあります。
  - Collabサーバーのダウンロードと起動 ：
  通常は組織の管理者が行う1回限りの作業です。
  - Gitのインストールと設定 ： 
  プロジェクト内のすべての開発者が行う1回限りの作業です。
  - Visualizer プロジェクトを GIT に追加し、コラボレーションする ：
  Visualizer プロジェクトを Git に追加するのは 1 回の作業で、通常はプロジェクトのリーダーが行います。その後、開発者はプロジェクトをクローンし、ローカルプロジェクトで共同作業を行います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/592264/6bad1231-c6b8-92cb-9bb9-294cecd81f1f.png)

**Collabの使い方**
Git と Collab Server のセットアップが完了したら、Visualizer で Collab の設定を行い、Collab の使用を開始する必要があります。
設定方法を以下で説明します。

- **Visualizer で Collab の設定を行う**
Collab 機能を使い始める前に、Git リポジトリでホストされているリモートプロジェクトに接続するように Collab サーバーを設定する必要があります。

  - VisualizerでCollabの設定を行うには、以下の手順となります。
  1. Visualizer で、プロジェクトメニューから、Window > Collab に進みます。
  1. Collab ウィンドウが表示されます。![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/592264/2928c9ec-2e51-e15a-b65d-437c03de202a.png)
  1. [Collab Server Configuration]でCollab サーバがインストールされているローカルアドレスを入力します。
サーバーURLの形式は、``https://<サーバーがインストールされているマシンのIPアドレス>:<ポート番号>``です。
  1. [Enable Collab]を選択します。
  1. [Git Configuration]で、プルリクエストを発行するリモートブランチを選択します。
  1. これで Visualizer での Collab 設定は完了です。
  
- **Collab との連携**
必要な設定をすべて行い、開発者がプロジェクトで作業を開始すると、Collabは開発者がローカルプロジェクトで行った変更の追跡を開始します。
Collabは、Gitリポジトリの同じブランチにコードをプッシュする開発者間の潜在的な競合を検出し、画面上にアラートを表示します。
  - 可能性のあるマージコンフリクトの詳細を表示するには、次の手順となります。
  1. Visualizer で、プロジェクトメニューから、Window > Collab に進みます。
  1. Collab ウィンドウが表示されます。![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/592264/9aab7143-e8ac-b2cb-0491-735c45d99981.png)
  1. 競合の可能性がある項目をクリックすると、競合の詳細が表示されます。※この機能を使うことで、他の開発者と協調して作業することができ、マージ時に発生する競合などの問題も回避することができます。

  - 手順2.のCollabウインドウの詳細は以下となります。
  - **ウィンドウ左側パネル**
ウィンドウの左側には、同じプロジェクトで作業している開発者のリストと、マージの競合が発生する リスクが表示されます。
マージの衝突は、あなたが作業していた Git リポジトリの同じブランチに開発者がコードをプッシュしたときに発生する可能性があります。マージの衝突を引き起こすリスクの大きさは、バッジの色に基づいて表現されます。※色別の意味は以下となります。
    - **赤色**：Git のリモート・リポジトリに変更をプッシュする際に、マージの競合を引き起こす可能性のあるファイルが少なくとも1つあります。
    - **黄色**：両方の開発者が編集している共通のファイルが少なくとも1つあるが、マージの競合の可能性はない。
    - **緑色**：両方の開発者が編集している共通のファイルが存在しない。

  - **ウィンドウ右側パネル**
右側のパネルには、選択した開発者とのマージのコンフリクトの可能性が表示されます。各コンフリクトの色は、以下のように表示されます。
    - **赤色**：複数の開発者がプロジェクトファイル内の同じ行を編集している。これは、コードがリポジトリにプッシュされたときに、マージの競合が発生します。
    - **黄色**：複数の開発者がプロジェクト内の同じファイルで作業しているが、ファイル内の行が異なる場合。これは、コードがリポジトリにプッシュされたときに、マージの競合が発生する可能性があります。
    - **緑色**：複数の開発者が同じプロジェクトで作業しているが、ファイルやフォームが異なっている場合。これは、コードがリポジトリにプッシュされたときにマージの競合が発生することはありません。

# 5.まとめ
Visualizerに追加された新機能"Automator"と"Collab"を紹介しました。2つの機能を使うことで、開発作業が円滑になり生産性が向上されると思いますので、慣れるまで大変かと思いますが是非積極的にご利用ください！
こちらで紹介した内容をより詳しく知りたい場合は、「6.参考」に添付のリンクからKony公式ドキュメントを確認してください。

# 6.参考
・Automatorについて
https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/TestAutomation.htm#Test
・Collabについて
https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Content/Collab.htm#Download
・Hikesについて
https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Default.htm#Hikes.htm
・Quantum IQについて
https://docs.kony.com/konylibrary/V9Preview/QV/visualizer_user_guide/Default.htm#Kony_IQ.htm

https://qiita.com/Kony_Team/items/64c2f910bcfe1874cf17