Locating one element
WebDriver を使用する際に学ぶべき最も基本的なテクニックの 1 つは、ページ上の要素を見つける方法です。
例に見られるように、WebDriver での要素の検索はWebDriverfindElement(By)WebElement を返します。
-
WebDriverは、ブラウザを表します -
WebElementは、特定のDOMノード（リンクや入力フィールドなどのコントロール）を表します。
「見つかった」ウェブ要素への参照があれば、そのオブジェクト インスタンスに対して同じ呼び出しを使用することで、検索の範囲を狭めることができます
これができるのは、WebDriver と WebElement の両タイプが SearchContext インターフェイスを実装しているからです。 WebDriver では、これをロールベースのインターフェイスと呼びます。ロールベースのインターフェイスでは、特定のドライバー実装が特定の機能をサポートしているかどうかを判断することができます。 これらのインターフェースは明確に定義されており、責任のある単一の役割のみを持つことを遵守しようとしています。
その結果、上記で使用した By インターフェースは、いくつかの追加ロケーター戦略もサポートしています。
パフォーマンスを少しでも向上させるには、より具体的なロケーターを使用してみましょう。 WebDriver は CSS ロケーターによる要素の検索をサポートしているため、以前の 2 つのロケーターを 1 つの検索にまとめることができます。
複数の要素の検索
作業しているドキュメントが、一番好きなチーズの順番を変えたリストを持っている可能性があります。
<ol id=cheese> <li id=cheddar>… <li id=brie>… <li id=rochefort>… <li id=camembert>…</ol>チーズが多ければ多いほど良いというのは議論の余地がありません。 チーズを検索するための優れた手法は、複数化されたバージョン findElements(By) を利用することです。 このメソッドは、ウェブエレメントのコレクションを返します。 1つの要素しか見つからなかった場合でも、（1つの要素の）コレクションを返します。 ロケータにマッチする要素がない場合は、空のリストが返されます。
要素選択ストラテジー
WebDriverには8種類のビルトイン要素ロケーションストラテジーがあります。
| ロケータ | ディスクリプションth | ||
|---|---|---|---|
| クラス名 | Locates | ||
| cssセレクタ | CSSセレクタにマッチする要素を探します | ||
| id | L> | id | ID属性が検索値と一致する要素を表示します |
| name | NAME属性が検索値と一致する要素を表示します | ||
| link テキスト | 可視テキストが検索値と一致するアンカー要素を探します | ||
| パーシャルリンクテキスト | 可視テキストに検索値が含まれるアンカー要素を探します。 複数の要素が一致した場合は、最初の要素のみが選択されます。 | ||
| タグ名 | タグ名が検索値と一致する要素を探します | ||
| xpath | XPath式に一致する要素を探します | ||
| xpath |
セレクタを使用する際のヒント
一般的には。 HTML IDが利用可能で、ユニークで、一貫して予測可能であれば、ページ上の要素を探すのに適した方法です。
ユニークな ID が利用できない場合は、要素を探す方法として、よく書かれた CSS セレクタが好ましいでしょう。 XPath は CSS セレクタと同様に機能しますが、構文が複雑で、デバッグが困難な場合があります。
linkText と partialLinkText に基づいた選択ストラテジーは、link 要素でしか動作しないという欠点があります。
タグ名は、要素を探すのに危険な方法です。
タグ名は、要素を探すのに危険な方法です。同じタグの複数の要素がページに存在することがよくあります。これは、要素のコレクションを返す findElements(By) メソッドを呼び出すときに役立ちます。
相対ロケータ
Selenium 4 では、以前はフレンドリー ロケータと呼ばれていた相対ロケータが導入されました。 この機能は、他の要素の近くにある要素を見つけるのを助けるために追加されました。Available Relative Locators are:
- above
- below
- toLeftOf
- toRightOf
- near
findElementメソッドは、RelativeLocatorを返す新しいメソッドwithTagName()を受け付けるようになりました。
仕組み
Seleniumは、JavaScriptの関数getBoundingClientRect()を使用して、相対的な要素を見つけます。
相対ロケータを理解するために、以下の例を考えてみましょう。
above()
指定された要素の上に表示されるWebElementを返します
below()
指定された要素の下に表示されるWebElementを返します。
toLeftOf()
指定された要素の左にあるWebElementを返します。
toLeftOf()
指定された要素の左に現れる WebElement を返します
near()
指定された要素から最大で 50px 離れた位置にある WebElement を返します。