【UiPath】セレクター取得で悩まない！実践的な解決策6選

# はじめに
UiPathを使って業務を自動化していくとどうしてもクリックや文字の取得ができないUI要素に遭遇することがあります。今回はそのようなUI要素を認識させる方法をご紹介します。

# 認識させたいUI要素

今回は例として、SAP GUIでよく見かけるテキストボックスの右にある入力ヘルプのアイコンをクリックしたいとします。

<img width="500px" alt="image.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/caf5fcc5-f800-ffe6-d7b3-6b032a779bbf.png"><br />

`クリック`アクティビティなどで要素を認識させようとするとこのようにテキストボックスを含めてセレクターが認識されてしまいアイコン部分だけ個別に要素を認識させることができません。

<img width="200px" alt="image.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/61c89782-2433-e7d3-24f4-ce0f8cb91b1e.png"><br />

ちなみにアイコンをクリックするとこのような入力補助のダイアログボックスが表示されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/70024bca-4026-35e7-3cda-5479cf826669.png)

それでは対処法を見ていきましょう。

# 試してほしいこと
## ① 既定以外のUIフレームワークを使う
UiPathではUI要素を独自の技術を用いて特定しています。ほとんどのケースではこのUiPathの独自技術で問題なくUI要素を特定できますが、もしできない場合はUIフレームワークを変更することで認識できなかったUI要素が認識できるようになることもあります。

UIフレームワークは、セレクターを取得する画面で`F4`キーを押すことで変更できます。`F4`キーを押す以外でも、選択オプションの右上のドロップダウンからも変更できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/a53e6a70-f7d1-53c9-4ca7-0daf6902a014.png)

Active AccesibilityとUIオートメーションの詳細は以下のMicrosoft社提供のドキュメントをご確認ください。

[UI オートメーションと Microsoft Active Accessibility](https://learn.microsoft.com/ja-jp/dotnet/framework/ui-automation/ui-automation-and-microsoft-active-accessibility)

:::note info
UiPath.UIAutomation.Activitiesのv23.4.xからUIフレームワークの初期値が「既定」から「自動」に代わり、適切なUIフレームワークが自動的に選択されるよう変更されています。
:::

:::note info
今回のUI要素ではUIフレームワークを変えても認識できませんでした。
:::

## ② 最新のUiPath.UIAutomation.Activitiesのバージョンを使う
現在ご利用のバージョンでは認識できなかったUI要素が新しいバージョンでは認識できる可能性もあります。アクティビティパックをバージョンアップいただける環境の場合は、UI AutomationアクティビティパックをバージョンアップしてUI要素が認識されるかお試しください。

[UI Automation のアクティビティ - リリースノート](https://docs.uipath.com/ja/activities/other/latest/ui-automation/release-notes-uipath-uiautomation-activities)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/6cfeb5d4-c16b-4ec7-21d0-97b45b514947.png)

:::note info
今回のUI要素ではUIAutomationアクティビティパック v23.4.x以降を使うと認識するようになりました。
:::

## ③ ショートカットキーを使う
ショートカットキーを使うことでクリックするのと同じ結果を得られる場合は`キーボードショートカット`アクティビティでクリックを代替します。

今回の例では、テキストボックスにフォーカスがある状態で`F4`キーを押下することで入力補助のダイアログボックスを表示できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/28d8d21a-555d-8118-f9b8-db320e6b0519.png)

今回のケースでは使えませんが、`Tab`キーで対象要素に移動して、`Enter`キーでクリックするという方法もあるかと思います。

## ④ クリックのオフセットを使う
要素が特定できない場合でも、クリックする位置を指定することができます。セレクターを取得する画面で要素を選択すると下のように緑で要素が囲われます。デフォルトでは緑枠の真ん中がクリックされますが、真ん中にある丸いアイコンを動かすことでクリックしたい位置を指定することができます。この仕組みを利用することで要素を特定できない場合でもクリックさせることができます。

<img width="500px" alt="image.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/dd2c4d23-39a4-b1cb-d788-bc1bd5909334.png"><br />

:::note info
入力モードがシミュレートの場合はクリックのオフセットを利用することができません。ハードウェアイベントまたはChromium API（ブラウザーの場合）を選択してください。
:::

:::note warn
ウィンドウの表示サイズによってサイズが変わるようなUI要素の場合はオフセット位置がずれて使えない可能性があります。その場合は別の方法を検討してください。
:::

クリックのオフセットはアクティビティのプロパティからピクセル単位で変更できます。アンカーポイントで基準となる位置を指定して、横位置（X）と縦位置（Y）で相対位置を指定します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/cf7f1c12-faa2-54f2-df9b-afb8616eeb38.png)

## ⑤ Computer Visionを使う
Computer Visionは機械学習に基づいてUI要素を特定する画像認識の仕組みです。Comupter Visionを使うことで通常のセレクターでは認識できないUI要素を認識することができます。

:::note info
Automation Cloudを利用していないなどの理由でComupter Visionを利用できない場合は、Computer Visionローカルサーバーの利用を検討してください。

[Computer Vision ローカル サーバー パッケージについて](https://docs.uipath.com/ja/activities/other/latest/ui-automation/about-the-computer-vision-local-server-pack)
:::

### 統合ターゲットのComputer Visionを使う
セレクターを取得する画面に表示される選択オプションのCPUのようなアイコン（下のスクリーンショットの赤枠箇所）をクリックすることでComputer Visionを有効化できます。

:::note info
UiPath.UIAutomation.Activitiesのv23.4.xから統合ターゲットにComputer Visionが組み込まれました。v23.4.x以前のアクティビティパッケージをご利用の場合はComupter Visionアクティビティをご利用ください。
:::

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/30eff189-ded8-b40f-a269-b444261818c9.png)

Computer Visionを有効化して「すべてのCV要素を表示」をクリックすることで、Computer VisionがUI要素として認識している箇所を確認することができます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/c5665770-a186-18cb-0e51-5da6abd017da.png)

目的の要素が認識されている場合はComputer Visionを使ってUI要素を特定させることができます。要素を選択して、「ターゲット」内のチェックを「Computer Vision」のみとします。

<img width="360px" alt="image.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/2c556aac-5a2b-f895-59cd-f400b0ad354a.png"><br />

### Computer Visionアクティビティを使う
統合ターゲットのComputer Visionが使えない、使えるが要素を認識できなかった場合は、Computer Vision用のアクティビティを使うことで解決する可能性があります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/ded2e7a3-782c-92df-904e-6a5409dfaebb.png)

Computer Vision用のアクティビティは必ず`CV画面スコープ`アクティビティを置いて、その中に`CVクリック`や`CVテキストを取得`等のUI操作系のアクティビティを配置して使います。

<img width="400px" alt="image.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/1b81fa83-f604-0451-e079-693a6aece0f9.png"><br />

`CV画面スコープ`アクティビティを配置したら、「画面上で指定」をクリックして操作対象のウィンドウを指定します。

<img width="500px" alt="image.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/644008bd-8fc3-c347-e898-4fa908a6d92f.png"><br />

続いて、`CVクリック`アクティビティを`CV画面スコープ`アクティビティの中に配置します。配置したら、「スコープで指定」をクリックして要素を選択します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/c57a1a83-096a-f865-391b-88d25ffd4cf2.png)

すると、このようにアイコン部分だけ認識させることができました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/4680b276-be24-160c-9f53-f0b66191a7cd.png)

## ⑥ 画像認識を使う
UI要素を画像として認識させる方法です。Computer Visionも画像認識の技術ですが、こちらは機械学習を使わない純粋な比較をします。

:::note warn
画像認識は操作対象アプリケーションのUI変更や表示サイズの影響を受けやすく安定性に不安がある方法です。そのため、上記①から⑤を試してうまく行かなかったときの最後の手段としてご利用ください。
:::

セレクターの取得時にマウスの左ボタンをクリックしたまま認識させたいUI要素を囲うことでUI要素を指定します。UI要素を選択すると、選択オプションのターゲットに「画像」のみが表示されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322296/368b431e-bf62-0d60-6354-70ce127039e9.png)

# さいごに
どうしても認識させることができないUI要素に遭遇したときは自動化をあきらめずに上記を是非お試しください。