こんにちは, 今回は Selenium IDE の Locator についてです。前回までに Selenium IDEの簡単な使用方法と, コマンドについて述べました。 これでコマンドの利用方法は, わかりましたが 実際にテストするときには, DOM 要素からinner のテキストをとってきたり, とあるボタンをクリックしたり, リンクをクリックしたりします。
ここで登場するのが, ターゲット(対象) たとえば <input id="marikosama" type="button"/> といった要素を
特定して, クリック。 この要素を特定するのが, Locators です。
Locators : コマンドが参照するHTML要素を特定するもの。Elementを探してテストに使用する
Selecnium IDEで用意されているのは, 以下の5つです。
1. ID属性
2. name 属性
3. link ( <a>のhref のこと)
4. XPath
5. CSS
1. ID 属性
DOM の id="" ID属性のことです。 Selenium IDE 上では,
| コマンド | 対象 | 値 |
|---|---|---|
| clickAndWait | id=marikosama |
のように id=ID名を書きます。(上のボタンの場合)
2. name 属性
DOM のname 属性のことです。 <input name="ske" type="button" value="栄"/>
この場合
| コマンド | 対象 | 値 |
|---|---|---|
| click | name=ske |
となります。
3. link いわゆる href
DOMの<a> タグの href つまり, リンク先のURLのことです。
<a href="http://www.blogger.com">Bloggerだぜ</a>
とすると,
| コマンド | 対象 | 値 |
|---|---|---|
| click | link=Bloggerだぜ |
となります。
※ jQuery も高速になることですし, id属性をしっかり活用しましょう。
4. Xpath
ここまで来ても, やはり 複雑な要素は特定できません。table の(4,5) をクリックしたいんだ
とか, <div> の中の<p> のその中の... のような場合は, このXpath が便利です。
※個人的には, CSSより, XPathがいいなと思います。
XPath の記法の詳細は, 他で参照していただければと思います。
| コマンド | 対象 | 値 |
|---|---|---|
| click | /html/body/div[2]/div[3]/input |
こんな感じです。 <html><body> の中の 2番目の<div>の中の3番目の<div>の input をclick
他の例)
//div[@id='find'] div で id属性が find のもの
//table[4]/tbody/tr[2]/td/table/tbody/tr/td[2]/img 4つめの<table>の<tbody>の2番目の<tr>の中の
<td> の中の<table>の中の<tbody>の中の <tr>の中の2番目の<td>の中の <img>
とかなり複雑な対象を選択する方法が可能です。
5. CSS
CSSの記法でDOMを特定します。
ex)
input[value='chocolate'] <input> タグで, valueがchocolateのもの
こちらも, XPath同様に, 複雑な選択ができます。
ここで余談ですが, 4, 5の方法で書く場合, Firefinder という Firefox の Firebug というツールの
アドオンがあります。 これで, Web ページの XPath や, CSSを正しくかけているかをチェックすることができます。(Version 1.1 )
次回以降で使い方を説明しましょう。
以上で今回の内容は終了です。実際に筆者はできるだけ 1 を使うように, まぁ jQuery のセレクタを高速化するためにもできるだけ, id 属性を入れるようにして, テストもしやすく一石二鳥としています。
また, どうしてもだめな場合は, 一度 IDE で記録しておいて, XPathの記法をチェックして, その記法をまねして他のテストにも活用しています。 最後に, Firefinder でチェックして, テストケースの完成です。
※Firefinder ですが, Firefox 10 - Firebug 1.9 では動作しなくなってしまいました。 どうやら,8, 9 あたりかららしいです。
0 件のコメント:
コメントを投稿