Articles /

Appium Inspector Tutorial – Part 1

Appium Inspectorは、Appium Tutorialシリーズの次の記事セットです。 これは、モバイルアプリの要素を識別するプロセスを学ぶのに役立つ4〜5回の記事のシリーズです。 5039>

What is Appium Inspection Process?

非常に簡単に言えば、Appium Inspector は、モバイルアプリの要素を識別または検索するために使用するプロセスです。

  • Step 1: 要素を一意に特定する
  • Step 2: 特定した要素にアクションを実行する

Appium の検査プロセスは、上記の最初のステップを解決するのに役立ちます。 例えば、ログイン画面を持つアプリがあるとします。 今、あなたのタスクは、この画面でユーザー名とパスワードを入力することです。 ここで、Appium の検査プロセスは、画面を「検査」して、テキストフィールドを一意に識別させるのに役立ちます。

これらの要素を検査するために使用できるツールを見てみましょう。

Different Appium Inspectors that help you identify elements in mobile app

モバイル アプリの要素を検査するのに役立つさまざまなツールがあります。 しかし、Appium チュートリアル シリーズでは、最も人気があり広く使用されている (そして Android または Appium によってサポートされている) ツールを取り上げることにします。 これらのツールは、 –

  • UIAutomatorViewerです。 これは、モバイルアプリの要素を検査することができますAndroid Studioによって提供されるツールです
  • Appiumデスクトップインスペクタ。 最新版のAppium GUI（Appium Desktop）には、インスペクタが付属しています。 このインスペクタは、AndroidとiOSの両方のアプリで使用できます（iOSアプリの場合は、Macが必要になります）

この記事では、UIAutomatorViewerの基礎から説明します。 このシリーズの次の数記事では、UIAutomatorViewer と Appium Desktop Inspector の両方を使用してモバイル アプリを検査するさまざまな方法について詳しく説明します。

UIAutomatorViewerの開き方

UIAutomatorViewer は Android Studio インストール パッケージに付属しています。 そのため、Android Studioをインストールすると、UIAutomatorViewerも一緒に自動的にインストールされます。 UIAutomatorViewerを開くには、2つの方法があります。

重要な注意: Appium チュートリアル ガイドに従い、最新バージョンの Android Studio をインストールし、Android 環境変数を正しくセットアップしていることを確認してください。

ステップ1.1.UIAutomatorViewerを開くには、以下の手順に従います。 コマンドプロンプトを開く

Step 1.2: uiautomatorviewerと入力してEnterキーを押す

数秒待ちます。 UIAutomatorViewerウィンドウは、次のように表示されます

方法2：そのフォルダ場所からUIAutomatorViewerを開く UIAutomatorViewerは、.batファイルとしてあなたのマシンにインストールされています。 この方法では、インストールされているフォルダーの場所に移動して、それを開くことになります。

手順2.1.この方法を使用するには、以下の手順に従います。 UIAutomatorViewerがインストールされているフォルダの場所を開きます。 一般的に、この場所は – C:\UsersAnishAppDataLocal﹑Android﹑toolsbin (Replace ‘Anish’ with the username that you have on your machine)

Step 2.2: このbinフォルダにuiautomatorviewerが含まれていることを確認する

Step 2.3: uiautomatorviewerをダブルクリックします。 UI Automator Viewerウィンドウが数秒で開きます。

上記で述べたように、UI Automator Viewerを開くには、これらの方法のいずれかを使用できます。

USBを使って携帯電話をマシンに接続する

モバイルアプリの要素を検査し始める前に、まず、USBでモバイルデバイスとマシンを接続する必要があります。

ステップ 1: USB 経由で携帯電話をマシンに接続する

ステップ 2: 携帯電話が正しく接続されていることを確認するために、コマンド プロンプトを開き、adb devices コマンドを実行します。

このコマンドを実行すると、携帯電話のデバイスIDが表示されます。

ステップ3: 次に、検査したいアプリを開く必要があります。 Appiumチュートリアルシリーズの以前の記事と同様に、今回もGoogle Playストアアプリを例として使用します。 そこで、携帯電話で Play Store アプリを開きます

Ispect mobile app using UI Automator Viewer

以下に示す手順に従って、UI Automator Viewer でモバイル アプリを検査します –

ステップ 1: 携帯電話が USB で正しく接続されていることを確認します。 また、ロックが解除され、Play ストア アプリが開いていることを確認します。

ステップ 2: 次に、UI オートメータービューアーのデバイス スクリーンショット アイコンをクリックします (これは、下の画像に示すように 2 番目のアイコンです)

注: クリックしたデバイス スクリーンショット アイコンの隣に他のアイコンがあることに気づいたことでしょう。 この記事では、これらのアイコンの機能を説明するつもりはありません。

Step 3: 以下のような進捗情報を示すポップアップメッセージが表示されます

Step 4: UI Automator Viewer が画面上のすべての情報を処理するまで数秒待ちます。 これが完了すると、UI AUtomator ビューアは、以下の画像

Step 5に示すように、あなたの携帯電話のスクリーンショットを読み込みます: 今、あなたのマウスポインタをデバイスのスクリーンショットの任意の場所に置きます。 いくつかの情報が右側のペイン

Let’s understand whats happening here

一時停止して、ここで何が起こったかを理解しようとすることがわかります。

  • 最初に、画面上に表示されているすべてのオブジェクトの詳細を XML 形式でキャプチャします。
  • 次に、モバイル画面のスクリーンショットを PNG 形式でキャプチャします
  • 上記の詳細がキャプチャされると、UI Automator Viewer は UI

Important Note: 技術的に言うと、UI Automator Viewer はモバイル画面をキャプチャするだけです。 したがって、デバイス上に表示されているものは何でも、UI Automator ビューアがキャプチャします。 5039>

UI Automator ビューアの 3 つのメイン セクション

下の画像から、UI Automator ビューアには 3 つのメイン セクションがあることがわかります –

1. 左側ペイン。 このペインには、デバイスのスクリーンショットが表示されます。 これはインタラクティブなイメージで、スクリーンショット上の任意の要素をクリックしたりマウス ポインターを合わせたりできます。

2. 右側のトップ ペイン。 このペインには、画面の XML 構造全体が表示されます。 この XML 構造には、コントロール名、テキスト (ある場合)、座標など、各コントロールに関する非常に基本的な詳細が表示されます。 これは、コントロールのすべての詳細を表示する重要なペインです。 スクリーンショットから選択したすべての要素について、そのテキスト、クラス名、パッケージ名など、その全詳細が表示されます。

ここまで、UI オートメータービューアの基本、ビューアの開き方、モバイルアプリのスクリーンショットをビューアに読み込む方法について説明してきましたが、いかがでしたでしょうか。 この記事はここで終了し、残りの部分は次回の記事で取り上げます。 Appiumで要素を識別する方法は複数あります。 Appium Inspectorに関する今後の記事で、そのすべてと多くを説明します。

Try it Yourself Activity: 上記のセクションの 1 つで、USB ケーブルを使用してモバイル デバイスをコンピューターに接続する必要があることを述べました。 これをワイヤレスモードでも行えることをご存知ですか？ WiFi経由でAppiumのテストスクリプトを実行する方法を示したこの記事をチェックしてください。 この記事を参考に、WiFi経由でモバイルデバイスを接続し、何か要素を検査できるか試してみてください。

上記のセクションで問題に直面した場合、または私たちに何かフィードバックがある場合は、お気軽にお問い合わせください。 私たちは、記事を改善し、すべての読者に役立つものにするために、あなたのフィードバックを聞くのが大好きです。

Appium Inspectorに関する次の記事群

  • UIAutomatorViewerを使って要素を検査する方法を学ぶ
  • モバイル自動化の制限を含むUI Automator Viewerについて学ぶ
  • AppiumデスクトップInspectorの基本について学ぶ
  • Appium Desktop Inspectorを使ってモバイル要素を検査する

Leave a Reply