4. 要素を見つける¶
あるページ内の要素を見つけるには、さまざまな方法があります。あなたのケースに最も適したものを使用することができます。Seleniumは、ページ内の要素を見つけるための以下のメソッドを提供します。:
- find_element_by_id
- find_element_by_name
- find_element_by_xpath
- find_element_by_link_text
- find_element_by_partial_link_text
- find_element_by_tag_name
- find_element_by_class_name
- find_element_by_css_selector
複数の要素を見つけつには(これらのメソッドはリストを返します)
- find_elements_by_name
- find_elements_by_xpath
- find_elements_by_link_text
- find_elements_by_partial_link_text
- find_elements_by_tag_name
- find_elements_by_class_name
- find_elements_by_css_selector
上記のパブリックメソッドとは別に、ページオブジェクト内で要素を見つけるのに役立つかもしれない2つのプライベートメソッドがあります。find_element と find_elements の2つのプライベートメソッドです。
使用例:
from selenium.webdriver.common.by import By
driver.find_element(By.XPATH, '//button[text()="Some text"]')
driver.find_elements(By.XPATH, '//button')
By クラスで使用できる属性は次のとおりです:
ID = "id"
XPATH = "xpath"
LINK_TEXT = "link text"
PARTIAL_LINK_TEXT = "partial link text"
NAME = "name"
TAG_NAME = "tag name"
CLASS_NAME = "class name"
CSS_SELECTOR = "css selector"
4.1. ID属性で探す¶
要素の id 属性を知っている場合は使用しましょう。この戦略では、 位置に一致する id 属性値を持つ最初の要素が返されます。id 属性が一致する要素がない場合、 NoSuchElementException
が発生します。
たとえば、このページソースを考えてみましょう:
<html>
<body>
<form id="loginForm">
<input name="username" type="text" />
<input name="password" type="password" />
<input name="continue" type="submit" value="Login" />
</form>
</body>
<html>
フォーム要素はこのように見つけることが出来ます:
login_form = driver.find_element_by_id('loginForm')
4.2. Name属性で探す¶
要素の name 属性が分かっている場合に使用します。この戦略では、 位置に一致する name 属性値を持つ最初の要素が返されます。name 属性が一致する要素がない場合、 NoSuchElementException が発生します。
たとえば、このページソースを考えてみましょう:
<html>
<body>
<form id="loginForm">
<input name="username" type="text" />
<input name="password" type="password" />
<input name="continue" type="submit" value="Login" />
<input name="continue" type="button" value="Clear" />
</form>
</body>
<html>
ユーザー名とパスワードの要素は、このように見つけることが出来ます:
username = driver.find_element_by_name('username')
password = driver.find_element_by_name('password')
これは “ログイン” ボタンが “クリア” ボタンの前に取得されます:
continue = driver.find_element_by_name('continue')
4.3. XPathで探す¶
XPathは、XML文書内のノードの位置を特定するために使用される言語です。HTMLはXML(XHTML)を実装できるため、Seleniumユーザーはこの強力な言語を活用して、Webアプリケーションの要素をターゲットにすることができます。XPathは、id属性やname属性で簡単に検索する方法を超えて(サポートするだけでなく)拡張し、ページ上の3番目のチェックボックスの位置付けなど、あらゆる可能性を開拓します。
XPathを使用する主な理由の1つは、探したい要素に適切なIDまたは名前属性がない場合です。XPathを使用すると、絶対的な用語(アドバイスされていない)で要素を見つけることも、idまたはname属性を持つ要素に関連付けることができます。XPathロケータを使用して、idやname以外の属性を使用して要素を指定することもできます。
絶対XPathにはルート(html)からのすべての要素の位置が含まれているため、アプリケーションにわずかな調整しか加えられずに失敗する可能性があります。idまたはname属性(理想的には親要素)を持つ近くの要素を見つけることによって、関係に基づいてターゲット要素を見つけることができます。これは変更する可能性が低く、テストをより堅牢にすることができます。
たとえば、このページソースを考えてみましょう:
<html>
<body>
<form id="loginForm">
<input name="username" type="text" />
<input name="password" type="password" />
<input name="continue" type="submit" value="Login" />
<input name="continue" type="button" value="Clear" />
</form>
</body>
<html>
フォーム要素はこのように見つけることが出来ます:
login_form = driver.find_element_by_xpath("/html/body/form[1]")
login_form = driver.find_element_by_xpath("//form[1]")
login_form = driver.find_element_by_xpath("//form[@id='loginForm']")
- 絶対パス(HTMLがわずかに変更された場合には破損します)
- HTMLの最初のフォーム要素
- id という名前の属性と loginForm という値を持つフォーム要素
username要素はこのように見つけることが出来ます:
username = driver.find_element_by_xpath("//form[input/@name='username']")
username = driver.find_element_by_xpath("//form[@id='loginForm']/input[1]")
username = driver.find_element_by_xpath("//input[@name='username']")
- name 属性と username という値を持つ入力子要素を持つ最初のフォーム要素
- id 属性と loginForm という値を持つフォーム要素の最初の入力子要素
- name 属性と usernameと いう値を持つ最初の入力要素
「クリア」ボタンの要素は、このように見つけることが出来ます:
clear_button = driver.find_element_by_xpath("//input[@name='continue'][@type='button']")
clear_button = driver.find_element_by_xpath("//form[@id='loginForm']/input[4]")
- name 属性の値が continue のinput要素と type 属性の値が button のinput要素
- id 属性と loginFoem をもつformのinput要素の4番目の子要素
これらの例はいくつかの基本をカバーしていますが、詳細を知るために次の参考資料をおすすめします。:
- W3Schools XPath Tutorial
- W3C XPath Recommendation
- XPath Tutorial - with interactive examples.
また、要素のXPathを発見するのに役立つ、非常に便利なアドオンがいくつかあります。:
- XPath Checker - suggests XPath and can be used to test XPath results.
- Firebug - XPath suggestions are just one of the many powerful features of this very useful add-on.
- XPath Helper - for Google Chrome
4.4. リンクテキストでハイパーリンクを探す¶
アンカータグ内で使用されているリンクテキストを知っている場合に使用します。この戦略では、場所に一致するリンクテキスト値を持つ最初の要素が返されます。要素に一致するリンクテキスト属性がない場合、 NoSuchElementException
が発生します。
たとえば、このページソースを考えてみましょう:
<html>
<body>
<p>Are you sure you want to do this?</p>
<a href="continue.html">Continue</a>
<a href="cancel.html">Cancel</a>
</body>
<html>
continue.htmlリンクはこのように見つけることが出来ます:
continue_link = driver.find_element_by_link_text('Continue')
continue_link = driver.find_element_by_partial_link_text('Conti')
4.5. タグ名で要素を探す¶
タグ名で要素を検索する場合に使用します。この戦略では、指定されたタグ名を持つ最初の要素が返されます。一致するタグ名を持つエレメントがない場合、 NoSuchElementException が発生します。
たとえば、このページソースを考えてみましょう:
<html>
<body>
<h1>Welcome</h1>
<p>Site content goes here.</p>
</body>
<html>
見出し(h1)要素はこのように見つけることが出来ます:
heading1 = driver.find_element_by_tag_name('h1')
4.6. クラス名で要素を探す¶
クラス属性名で要素を検索する場合に使用します。この戦略では、一致するクラス属性名を持つ最初の要素が返されます。要素に一致するクラス属性名がない場合、 NoSuchElementException が発生します。
たとえば、このページソースを考えてみましょう:
<html>
<body>
<p class="content">Site content goes here.</p>
</body>
<html>
p要素はこのように見つけることが出来ます:
content = driver.find_element_by_class_name('content')
4.7. CSSセレクタで要素を探す¶
CSSセレクタ構文で要素を検索する場合に使用します。この戦略では、一致するCSSセレクタを持つ最初の要素が返されます。要素に一致するCSSセレクタがない場合、 NoSuchElementException が発生します。
たとえば、このページソースを考えてみましょう:
<html>
<body>
<p class="content">Site content goes here.</p>
</body>
<html>
p要素はこのように見つけることが出来ます:
content = driver.find_element_by_css_selector('p.content')
Sauce Labs には、CSSセレクタに関する優れたドキュメントがあります。