ソフトウェアテスト: SeleniumとXPathのまとめ１

エレメントロケーターって？

Seleniumを使い始めたときに、まず最初につまづくのがElementLocatorです。

ElementLocatorとは、Selenium実行時にElement（HTMLの要素）を特定するための方法のことです。

Domで指定したり、FormのIDで指定したりといろいろな指定方法があるのですが、やはり一番便利なのはXPathです。

XPathを使えば、特定のテキストに部分一致する要素をピンポイントで抽出したり、

並列に並んだ要素の最後から2番目を持ってくるなど、特殊な条件で位置の特定が可能です。

欠点は慣れるまでに少し時間がかかることと、HTMLの構造をある程度理解している必要がある点です。

今回紹介するのは、FirebugとSeleniumIDEを使った超簡単なXPathの確認方法です。

１．Firefoxで位置を調べたいページを開きます
２．Firebugを起動（F12）してHTMLタブを選択状態にします

３．Firebugの左上虫アイコンの右にある「カーソル選択」アイコンをクリック

4．位置を特定したい部分をクリックすると該当のHTMLが選択状態になります

５．Firebugの窓で、選択されたHTMLの部分にカーソルを移動して右クリック
６．「xPathをコピー」を選択します

すると、こんな感じのPathが取れます。

/html/body/div/div[2]/div[3]/div/div/div[2]/div/div/ul/li/a

７．次にSeleniumIDEを起動します（自動保存はOffにします）

８．コマンドリストの一番上の部分をクリック

９. コマンドには何も入力しないで「対象」に対象に先ほどのPathをコピーします

１０．そのままだとエラーになるので /html/body の部分を / に変更します。
結果例→ //div/div[2]/div[3]/div/div/div[2]/div/div/ul/li/aとなります。

１３．SeleniumIDEの対象の右にある検索ボタンをクリックすると
Yahooトップページのトピックの最上位の部分が点滅します。

これだけです。

HTMLの構造を一切意識しないでXPathを使うことができました。

XPathは相対指定ができるので、例えば

//div/div[2]/div[3]/div/div/div[2]/div/div/ul/li/a/../../li[2]
のように書くと、トピックの最上位の<a>を起点に
2階層移分上に移動した場所にある、2番目の<li>（トピックの2番目）が選択範囲になります。

まれにHTML構造上の理由から、上記の方法では期待する位置が特定できない場合もあります。

そのときは、XPathの最後の要素をひとつずつ消しながらIDEの「検索」ボタンと押すと、

Locatorがどこを見ているのか一目で分かります。

目当ての要素が選択範囲に含まれたら、今度はFirebugのHTMLタブをみながら、

要素をひとつひとつ追加していくと、最後には目当ての要素にたどり着くことができます。

属性を指定したり、テキスト部分一致を利用したXPathの書き方に関しては、また後日まとめたいと思います。