[RealWorld Test Automation. Day 11] choose nice XPath for durable and speedy test automation by Ranorex

# Outline

今回は、Ranorexを使ってUI変更に強く、またテスト実行のスピードを落とさずに実装する方法に関して執筆する。

test scriptを作成するにあたってオブジェクト(RanorexではRepository itemと呼ぶ）を特定する必要がある。
これはRanorexに限ったことではない。
Selenium WebDriverなどで performanceやchangeable UIに困ったときに参考になると幸いです

# XPath とは

他の記事でよくまとまっているので、そちらを参考にしてください。
<A HREF="https://qiita.com/rllllho/items/cb1187cec0fb17fc650a">クローラ作成に必須！XPATHの記法まとめ</A>

Ranorexでは、XpathをSPYで簡単にとることができます

Sample
<A HREF="https://keiba.rakuten.co.jp/">楽天競馬</A>のトップページのログインボタンを例にとる

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/d9478dca-fc41-7647-b846-54fc105e71b4.png)

このログインボタンをRanorexのSPYを使ってXPathを取ってみる。

<IMG SRC="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/bbcf6b6c-f3ec-2151-4b09-946b611141d0.png" WIDTH=50%><IMG SRC="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/064ae4fa-65ef-1abc-9943-9b8239fa589d.png" WIDTH=50%>

左がHTML構成
右がそれから取得できる最適化されたXPATH

# XPathを編集して、performanceやdurabilityを検証

## optimize XPath

先ほどのSPYで取得した時のデフォルトのXPATH

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/83465378-55dd-3b63-8504-75f6f60b43e7.png)

- １層目のdom[@domain='keiba.rakuten.co.jp'] はブラウザで、keiba.rakuten.co.joのドメインを指しているタブを指す
- ２層目のdiv[#'rakutenMembership'] はログインボタンを含めている、楽天の会員枠と呼ばれるエリアを指す
- 最後の a[@innertext='ログイン'] は今回対象としている、ログインのリンク

このようなXPathを定義することで、”ログイン”リンクのRepository itemを早く特定することができる。
また、UI変更で、このログインのリンクが変更になる場合、div[#'rakutenMembership']の楽天会員枠ごと移動する場合、変更になってもテスト自動化には影響しない

以下のように、chromeのdeveloper toolを使って、楽天会員枠を移動してみる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/9a2152ac-c06b-8e41-95ec-5f400a19ebf5.png)

変更後も、Xpathに修正加えずに、”ログイン”のリンクが取れることが確認できる。
また、検索速度も変わらない。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/268a7735-e69e-079d-06de-8ad5f238ff7e.png)

UIに依存するため、一概には言えないが、楽天のケースでは、今回のような楽天会員枠といった、いくつかのエリアでページが構成されている。
このエリア単位でXpathを最初の層で定義すると、このエリア単位でUI変更が行われても自動化のスクリプトの修正が必要ない。
当然、RanorexのSPYは完ぺきではない。そのためSPYで取得後、自分で最適な取り方になっているか、パフォーマンス的にも問題がないかを確認しながら、XpathをFIXすることを勧める。

## un-optimize XPath (long)

次はXPathの悪い例その１
下図の通り、ほぼHTMLの階層と同じにXPathを定義する。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/c0c0d965-7274-cd56-c539-12633ff13c7d.png)

この場合、”ログイン”のリンクを検索するのは、先ほどのoptimizeされたものより速いと思う。
ただし、これはUI changeにはとても弱いXpathである。
先ほどのように、楽天会員枠を移動すると、たちまちrepository itemが取れなくなる。

## un-opmize XPath (short)

今度は極端にXpathを最小限にしたパターン
a[@innertext='ログイン'] だけを定義したもの。
これも、"ログイン"のリンクを正しく取ることはできる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/8b38d679-9a87-deb9-6456-7647172113e6.png)

以下のように、SPYで"ログイン"のリンクを検索してみると、時間がかかり１０秒かかってしまった。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/ffaad053-99f0-6dbe-1b8e-d5411b82574f.png)

尚、このXpathでUI変更を行ってみた。
このXpathはUI変更にはとても強かった。
先ほどの例と同様に、楽天会員枠をヘッダの下に移動した。
それでも、Repository Itemは正しく取れることが確認できる。
ただし、先ほどと同じように、検索するのに時間がかかる

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267085/d1f414d5-fefd-c6bd-213f-1f36d03dd283.png)

# Summary

- RanorexはXpathでオブジェクト(Repository item)を定義する
- SPYを使い、XPathを取得、編集可能
- XPathの定義の仕方で、UI changeableへの耐性、Performanceが変わってくる


# Finally


次は10月??日（金）頃配信予定です。
引き続き、test automationのreal worldでのtipsを考えています


# back number

- <A HREF="https://qiita.com/emurin/items/af7b91b979159e27286a">[Lesson Test Automation. Day 01] What's Test Automation</A>
- <A HREF="https://qiita.com/emurin/items/750983107471386ea10a"> [Lesson Test Automation. Day 02] Test Layer and Tool</A>
- <A HREF="https://qiita.com/emurin/items/27f057b83bb2206868d3"> [Lesson Test Automation. Day 03] introduce test automation</A>
- <A HREF="https://qiita.com/emurin/items/34eea5255b414b3d1585">[Lesson Test Automation. Day 04] Test Automation Code Design vol.01</A>
- <A HREF="https://qiita.com/emurin/items/7feedeee162d205a1ed8">[Lesson Test Automation. Day 05] Test Automation Code Design vol.02</A>
- <A HREF="https://qiita.com/emurin/items/bb0e79fac43a569ad823">[Lesson Test Automation. Day 06] Test Automation Code Design vol.03</A>
- <A HREF="https://qiita.com/emurin/items/e9d7f26262eb599a2c7f">[Lesson Test Automation. Day 07] Test Automation Code Design vol.04</A>
- <A HREF="https://qiita.com/emurin/items/7aaa3f481cc57a340188">[Lesson Test Automation. Day 08] Test Automation Operation</A>
- <A HREF="https://qiita.com/emurin/items/b81241d159e69ab5c74e">[RealWorld Test Automation. Day 09] To reduce Jenkins operation set disable/enable in bulk</A>
- <A HREF="https://qiita.com/emurin/items/d4e8de6eec9f5b354548">[RealWorld Test Automation. Day 10] create test automation script for Travel booking by Ranorex</A>