「レコーダー」と「追跡セッションウィンドウ」で登録したUI要素の違い！

UI要素の登録方法によるセレクターの違い

「レコーダー」機能で作成したフローは不安定なことがある。

UI要素の登録方法には2つの方法があります。

Power Automate for desktopのレコーダー機能は大変便利な機能です。ユーザーの操作をくみ取ってアクションを自動で追加することでフロー作成の手助けをしてくれます。

しかし、レコーダーで作ったWebスクレイピング系のフローは動作が不安定になる場合があります。理由はレコーダーで追加したアクションのパラメータとして自動的に追加されるUI要素にあります。

2つの方法でUI要素を登録して比較してみます。

追跡セッションウィンドウの使い方はこちら

▲追跡セッションウィンドウを使ったUI要素の登録方法は上の記事が参考になるかと思います。

レコーダーの使い方はこちら

▲レコーダーを使ったUI要素の登録方法は上の記事が参考になるかと思います。レコーダーを使う場合、UI要素を追加するというよりもアクションを追加していく中でアクションのパラメーターとしてUI要素が同時に追加されます。今回は「Webページのリンクをクリックします」アクションをレコーダーで追加して確認します。

取得したUI要素の比較

２つを比較してみると、同じUI要素を登録したにもかかわらずセレクターが全然違うことがわかります。

インデックスだけを使ったUI要素は何が問題なの？

Webサイトのデザイン変更に弱い

インデックスだけを使ったセレクターの問題点について先程のデモ用Webサイトにデザインを変更を加えて確認します。先程はfruitsとvegetableのセクションだけでしたが、その前にmeatというdivセクションを追加してみました（上図の赤枠部分）。デザイン変更後のWebサイトで、先程取得したUI要素を使って「Webページのリンクをクリックします」アクションを実行してみたいと思います。

結果は次のようになりました。

何故レコーダーで登録したUI要素では狙った結果にならないかというと、Webサイトのデザイン変更によってターゲットとなるUI要素を内包するdivの順番が変わってしまったためです。再びmelonをクリックするためには上の図のようにセレクターのインデックス番号を書き変える必要があります。

このようにインデックスを使ったセレクターですとデザインの変更の度にUI要素を登録し直さなければならない可能性があります。デザイン変更に限らず、状況によってレイアウトが変化するWebサイトでも同様の対応が必要な場合があります。

一方でID属性やクラス属性はWebサイトにもよりますが変更される可能性はそこまで高くありません。このためセレクターはなるべく属性値（特に使えるならID値）を使って登録してくれる追跡セッションウィンドウを使って登録するか自分で編集した方が良いかなと思います。

インデックスを使うことが良くないというわけではありません。ID属性やクラス属性を使ってセレクターを登録したほうがWebサイトのデザインの変化に対して柔軟なフローが作成できるということです。

UI要素におけるその他の違い

レコーダーで追加したUI要素は、ビジュアルセレクタービルダーが使えない

その他の違いとして、レコーダーで追加したUI要素はビジュアルセレクタービルダーを使うことができません。その為セレクターの編集の際はカスタムセレクタービルダーで手入力によって編集する必要があります。

まとめ

Power Automate学習教材

Microsoft 365/ Power Automate / Power Platform / Google Apps Script…