ロケータを追加して要素を指定する

AutifyのメンテナンスAI(以下AI)は、ページ内に変化があっても継続的に要素を選択できるよう、要素が持つ複数の特徴から総合的に判断し、最も一致度の高い要素を見つけ出します。しかし、 AIに頼らずに 特定の要素を選択したいケースが発生する場合があります。

たとえば以下のようなケースがあります。

• テスト実行のたびにデータが変わるテーブルやリストで、常にN番目の要素を選択したい場合。
• 要素の他の特徴に左右されることなく、常に特定の属性（classやIDなど）を持つ要素を指定したい場合。
• 以下のような理由で、AIが誤った要素を見つけやすい場合。
  • 同じclassやidなどの属性を持つ要素が複数存在する。
  • 要素にclassやidなどの属性の設定がない。
  • 要素に付与されたclassやidなどの属性の値がたびたび変動する。

このような場合には ロケータ を使いましょう。ロケータでは、CSSセレクターもしくはXPathを利用して要素を選択できます。テスト内容に応じていずれかをご利用ください。

ロケータの使いかた

1. シナリオをレコーディングします。

2. ロケータを使いたいステップの詳細を開き、「ロケータを追加」をクリックします。
   

3. プルダウンメニューより、「CSSセレクター」か「XPath」を選択します。
   

4. 入力欄にCSSセレクター/XPathを記入します。CSSセレクター/XPathは、テスト対象のページの構造にあわせて記入してください。
   

CSSセレクターの例を以下にいくつか挙げます。

CSSセレクターは、できるだけ短く、かつ一意に要素を特定できるものを指定するのがポイントです。

ロケータ利用時の注意点

• ロケータを使用したステップでは、AIによるメンテナンスが効かなくなります。ロケータの利用は最小限に留めましょう。
• 指定したCSSセレクター/XPathに複数の要素が該当した場合には、一番初めの要素が選択されます。
• 指定したCSSセレクター/XPathに該当する要素が見つからない場合は、「対象要素が見つかりませんでした。」というエラーが発生し、ステップは失敗します。
• ShadowDOM内の要素について
  • CSSセレクター: shadow-root内における要素を指定して選択いただけます。ただし、指定されたCSSセレクターに一致する要素が通常のDOM内で見つかった場合には、通常のDOM内の要素が選択されます。
  • XPath: ShadowDOM内の要素を選択することはできません。

関連記事

• テーブルやリストで意図した要素を操作するにはどうしたらいいですか？
• CSSセレクターを使いこなす
• CSSセレクター | MDN