Shadow DOM標準を使用したウェブアプリを自動化する
- 最終更新日2024/10/30
Shadow DOM標準を使用したウェブアプリを自動化する
特定のモダンウェブアプリケーションは、再利用可能なコントロールのスタイルと動作のカプセル化を提供するために、Shadow DOM標準を使用しています。これにより、これらのコントロールのスタイルやスクリプトがページの他の部分と干渉しないようになります。 通常のDOMを介してShadow DOMオブジェクトへの直接アクセスを制限します。
レコーダー は、シームレスな自動化を確保し、自動化の失敗のリスクを最小限に抑えるために、現代のアプリケーションのオブジェクトベースの自動化をサポートします。
このようなオートメーションをサポートするには、次のプロパティを使用できます。
- [Shadow-Root パス]: シャドウルートパス プロパティを使用して、シャドウ DOM 内の要素を特定し、アクセスします。 このプロパティは、レコーダー がカプセル化されていて標準DOMを通じて直接アクセスできない要素を正確に特定し、自動化することを可能にします。 これは、レコーダー がターゲット要素を検索する境界を定義する文字列形式のすべてのシャドウルート要素の JSON 配列リストとして表されます。 変数は使用できますが、ワイルドカード文字（*）はサポートされていません。 これは、Shadow DOM 内にある要素のデフォルトプロパティです。注: シャドウルート要素を自動化するために、Shadow-Root path プロパティを選択してください。 ウェブページ内のシャドウルート要素を自動化する際、レコーダー は最初に ID で特定の要素を検索し、その後 CSSセレクタ で検索します。
- CSSセレクター: CSSセレクターは、DOMXPathに似た形でウェブページ上の要素を特定し、操作するために使用されます。 CSS Selector プロパティを使用して、クラス、ID、またはタグ名などのCSSセレクタ構文を使用してDOM内の要素を選択します。 CSSセレクタ-は、属性に基づいて要素をターゲットにするために使用されます。 要素がシャドウDOM内にある場合、CSSセレクタはShadow-Root Pathプロパティと併用する必要があります。 変数は使用できますが、ワイルドカード文字（*）はサポートされていません。注: このプロパティはすべてのHTML要素で利用可能です。重要: CSS セレクタは、レコーダー パッケージ の最新バージョン (3.3.1-20241001-095119) を使用していなくても正しく機能します。ただし、Google Chrome 拡張のバージョンが 3.3.0.0 以上である必要があります。 しかし、Google Chrome 拡張バージョンが 3.3.0.0 よりも前の場合、オートメーションが正常に実行されるように CSS セレクタプロパティの選択を解除してください。
シャドウ DOM 内で以下の要素をキャプチャして自動化できます:
- テキスト ボックス
- コンボ ボックス
- チェックボックス
- ボタン
- ラジオボタン
- リンク
- ラベル
- リスト ビュー
- テーブル
サポート可能性
- この機能は、Google Chrome および Microsoft Edge ブラウザでサポートされています。
- フレームとIフレーム（同一およびクロスドメイン）がサポートされています。
- 次のアクションで、[オブジェクトが存在します] および [オブジェクトが存在しません] 条件がサポートされます。 もし, アクション, と アクション.
- すべての既存のHTMLコントロールとそれに対応する アクション をサポートします。
- VMware Horizon、Citrix XenApp、および XenApp (CR) から XenApp (ビジネスアプリケーション) をサポートします。
既知の動作
- DOMXPath プロパティを使用してシャドウルート要素を自動化することはサポートされていません。
- 閉じたシャドウルート要素内の要素にはアクセスできません。
- すべてのアルゴリズムによる検索要素はサポートされていません。
- ネストされたクロスドメインIFrame内のシャドウルート要素の自動化はサポートされていません。
- プロパティを取得する アクション を使用する際、シャドウルートパス プロパティは値を表示しません。