CSS/XPathセレクターの使用

🚧

XPath/CSSセレクターの前に [Configure Find] を試してみる

XPathまたはCSSセレクターを使用してエレメントを検索する前に、[Configure Find] を使用して、検索するエレメントが持つべき属性を指定してみてください。たとえば、変数からのテキストを含むエレメントを見つけるように検索を設定できます。こうすることで、XPathまたはCSSセレクターのユースケースの多くを処理できると同時に、XPathまたはCSSセレクターの構文を理解する必要がないため、メンテナンスも容易になります。

mabl Trainerでは、アプリケーション内のエレメントを検索および操作するためにさまざまな戦略がテストで使用されますが、特定の検索に対してコントロールを強化することをお勧めします。mabl Trainerを使用すると、特定のCSSまたはXPathセレクターをテストのステップとしてすばやく追加できます。また、Trainerでは、ステップの作成時に選択中のエレメントが強調表示されるため、エレメントが正しく検索されることを確認できます。この機能を開始するには、以下の手順を実行します。

📘

mabl Trainerの使用に関する重要な情報

mabl Trainerの使用方法の詳細については、ドキュメント "mabl Trainerによるテストの定義(https://help.mabl.com/v1.0/docs/defining-a-journey-with-the-mabl-trainer)" を参照してください。

1. 1. ステップへのCSS/XPathセレクターの追加 (クリック)

  1. ウィンドウでmabl Trainerが開いていることを確認します。
  2. 画面下部のツールバーにある [Insert Step] +ボタンをクリックします。
598598
  1. [Find elements] ステップタイプを探してクリックします。
594594
  1. Trainerに [Find matching element] という新しい画面が表示されます。
  2. 最初のドロップダウンである [Find type] を使用して、目的の検索タイプを選択します。最初のエレメント、最後のエレメント、一致するエレメントの数で検索できます。
594594
  1. [Query type] というドロップダウンで目的のセレクタータイプを選択します。現在、CSSとXPathの両方がサポートされていますが、CSSクエリがデフォルトです。
  2. 見つかったエレメントに対して実行するアクションを選択します。現在、見つかったエレメントに対して実行できるのは、クリック、ダブルクリック、アサーション、テキスト入力、ホバー、または選択コントロールからの任意の項目の選択です。
  3. 最後に、CSSセレクターまたはXPathクエリを入力します。見つかった一致が強調表示されます。
594594 25302530
  1. 次に、Trainerの下部にある [OK] ボタンを押します。
  2. 表示がmabl Trainerのメインタブに戻ります。ステップが追加されています。

📘

CSSセレクターの使用に問題がある場合

CSS Masterclass Webinar (CSSマスタークラスウェビナー)! のビデオをご覧ください。また、便利な CSS Dinerゲーム, (@flukeoutの厚意により提供) もお試しください。

ステップへのCSS/XPathセレクターの追加 (クリック)

  1. 手順1~6を実行して、mabl Trainerの [Find matching element] の部分を再度開きます。[Action] のデフォルトとして [Click] がすでに設定されています。
  2. エレメントのCSS/XPathセレクターを [Query] フィールドに入力します。
594594 25302530
  1. 次に、Trainerの下部にある [OK] ボタンを押します。
  2. 表示がmabl Trainerのメインタブに戻ります。ステップが追加されています。

ステップへのCSS/XPathセレクターの追加 (テキスト入力)

  1. 手順1~6を実行して、mabl Trainerの [Find matching element] の部分を再度開きます。[Query type] を選択すると、[Query] フィールドに条件を入力できるようになります。
  2. [Action] ドロップダウンメニューを [Enter text] に変更します。
594594
  1. 使用するテキストを [Text to enter] フィールドに入力します。
594594
  1. 次に、Trainerの下部にある [OK] ボタンを押します。
  2. Trainerでステップを調べます。

ステップへのCSS/XPathセレクターの追加 (選択)

  1. 手順1~6を実行して、mabl Trainerの [Find matching element] の部分を再度開きます。[Query type] を選択すると、[Query] フィールドに条件を入力できるようになります。
  2. [Action] ドロップダウンメニューを [Select control - any item] に変更します。
594594
  1. 次に、Trainerの下部にある [OK] ボタンを押します。
  2. Trainerでステップを調べます。

📘

アサーションの詳細情報

詳細については、""is Present" アサーションの操作" で始まるドキュメント「アサーションの操作」を参照してください。

クイックスタートビデオガイドの次の章を見る


Related resources