[RealWorld Test Automation. Day 12] correct UI test automation by Ranorex


Outline

今回は、Ranorexを使ってWEBのE2E testを作成するときに、UIのテストを正しくすることに関して記述する。
これはRanorexに限らない。とくにWebDriverでjavaなどで作成するときに、陥りることがある。

UIのテストでマウスクリックによる処理を、ユーザー目線でtest automationのscriptが書けていますか?
ユーザーの操作ではできてないことが、test automationのscriptではできてしまうことがあります。
そのため、ユーザーの処理ではNGであるのに、test automationではOKになってしまう。

Example

https://keirin.kdreams.jp/
サンプルサイトとして、Kドリームスのサイトを用いる。

scenarioは以下の通り

1. 投票ボタンを押す
2. 競輪場一覧のボタンを押す
3. 競輪場一覧から”宇都宮”を選ぶ
4. レース番号の変更のボタンを押す
5. レース一覧から”5R"を選ぶ
6. 投票方法の変更のボタンを押す
7. 投票方法から、”通常投票”、”ベーシック投票”を選び、設定する

操作の動画は以下の通り ↓

このサイトの特徴として

  • AJAXによる非同期で情報取得
  • CSSによるパーツの表示をコントロール

ユーザー処理場正しくないが、テスト自動化が成功する例 LOADR編

ユーザー処理場正しくないが、テスト自動化が成功する例の動画 ↓

早すぎてなぜ正しくないのかがわかりにくいかもしれません。

例えば、レース番号を選択するシーンです。
以下の図のように、まだLOADERのアイコンが表示され、マウスではクリックできない状態です。
しかし、scriptの記述の仕方によっては、directにレース番号”6R"を選択することができます。

このため、処理が正常に進んでしまいます。
ただ、もしLOADERなどの処理に問題があり、ユーザーがマウスでクリックできない状態だったら、どうでしょうか?
本来であれば、テストは失敗であるべきである。
テスト自動化のscriptが成功しても、ユーザー操作(マニュアルテスト)は失敗するからである。
正しくは、LOADERが消えるまで待つべきである。

Ranorexで記述するとき、"Wait for - Not exists"を用いる

ユーザー処理場正しくないが、テスト自動化が成功する例 CSS制御編

CSSで表示が隠れてる状態でも、テスト自動化は成功し、ユーザー操作が失敗する例もあります。
レース番号の選択のモーダルの例です
このモーダルは、CSSのstyleでdisplayを制御しています。(display; blick;でモーダルを表示)

レース番号の選択のモーダルが非表示

レース番号の選択のモーダルが表示

RanorexのSPYでXPathを確認してみると

レース番号の選択のモーダルが非表示

レース番号の選択のモーダルが非表示

SPYでも一つのXpathに対して、どちらの画面でもreporitory itemが取れていることが確認できます。
ただし、レース番号の選択のモーダルが非表示の時のXpathはグレーになっています。
これは、Xpathは存在しているが、表示されていないことを示しています。

このreporitoy itemに対して、scriptでdirectに選択する記述をすると、モーダルが表示されてなくても選択でき、処理が成功してしまいます。

Ranorexでマウスクリックさせる処理でscriptを動かした例が以下の動画です。
Ranorexは、上記のようなXpath上存在するが、表示されないreporitory itemに対して、見当違い(0.0 position)の場所をマウスクリックするようです。これにより失敗してくれます。

上記を回避させるための一つの例として、RanorexのSPYでVisibleのoptionを付けることにより、reporitory itemが表示されるまでwaitさせることができます。
当然、表示されずにtimeoutすれば、scriptは失敗します(正しい動き)。

Summary

以上のように、ユーザー視点で操作ができるかどうかでテスト自動化を記載することが、テストとして重要である。
今回のサンプル例では、Ranorexを用いた場合以下のようにする

  • LOADERといったユーザー操作を妨害する状態の時は、waitさせる
  • CSSで表示を制御するときは、visibleの確認を行う

Ranorex以外のscriptingでも同じような考えで実装すれば対応は可能である。

Finally

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

back number