皆さん、こんにちは。
今回は、「Katalon Recorder」というツールを使って、Webブラウザのテスト自動化についてご紹介したいと思います。
こちらは、SeleniumIDEと似ているツールです。
Seleniumを過去に使用されている方であれば、すぐに操作を覚えることが可能です。
また、テスト自動化を初めて取り組む方でも、使いやすいツールとなっていますので、これを機に、是非テスト自動化を取り組んでみてはいかがでしょうか。
Katalon Recorderの1回目の記事として、以下内容を述べていきたいと思います。
「記事内リンク」
・Step1.Katalon Recorderの紹介
・Step2.導入
・Step3.各メニュー項目の紹介
・Step4.実際にテストページを使用してのレコード方法
■ Step1.Katalon Recorderの紹介
Katalon Recorderは、Webブラウザでの簡易的な操作をレコード、または組み立てることで、Web操作の自動化が行えます。
これは、Webコンテンツのリグレッションテスト（回帰テスト）に向いています。
リグレッションテストは、Webコンテンツのリリースがあったとして、リリース分の他、既存部分に問題が無いかのチェックを行います。
リリース前に行うことで、デグレードやバグが発生しないかのチェックを行うことができます。
しかし、毎回リリース時に、同じ操作を手動（マニュアル）で実行するのには、時間やリソースを一定数確保しなければなりません。
それでは、効率的にあまりよくありません。
同じ事を繰り返し行うのならば、それはツールに行ってもらうのが一番でしょう。
そのような繰り返し行うケースは、Katalon Recorderで行うことができます。
Katalon Recorderでは、以下の機能や特徴があります。
（別途参考として、今後紹介するKatalon Studioの特徴も述べています。）
■ Step2.導入
Katalon Recorderの導入は、とても簡単です。
それは、Chromeブラウザ、またはFireFoxブラウザの拡張機能として追加することで使用できるからです。
以下の手順で、導入することができます。
今回は、Chromeブラウザをベースに述べていきたいと思います。
1.以下、Chromeウェブストアにアクセスします。
https://chrome.google.com/webstore/detail/katalon-recorder-selenium/ljdobmomdgdljniojadhoplhkpialdid
2.追加ボタンでChromeに追加します。
3.ChromeのMenu→拡張機能⇒Katalon RecorderをONに設定します。
4.Chrome画面の右上にアイコンが表示されますので、それを選択します。
5.Katalon Recorderが起動します。
■ Step3.各メニュー項目の紹介
Katalon Recoderが起動すると、以下の画面が表示されると思います。
各メニュー、アイコンごとに紹介していきます。
①ツールバー
②テストケース エクスプローラー
③テストケース詳細ビュー
④トップメニュー
⑤フッターメニュー
⑥その他メニュー
①ツールバー
ツールバーはKatalon Recorderの基本となる項目です。
①Newボタン
テストケースを作成します。
②Recボタン
Web操作内容を記録します。
③Playボタン
選択した単一のテストケースを実行します。
④P.Suiteボタン
選択したテストスイートを実行します。
⑤P.Allボタン
全てのテストスイートを実行します。
⑥Pauseボタン
テストの再生を一時停止します。
⑦Reportボタン
KatalonのTestOpsCenterにテスト結果のレポートをアップします。
⑧Exportボタン
現在のテストスイート/テストケースをさまざまなスクリプト言語およびフレームワークにエクスポートします。
②テストケース エクスプローラー
テストケースエクスプローラーは、テストスイートとそのテストケースの構造が表示されます。
テストケースファイルの読み込み、テストケースファイルの編集が行えます。
①ファイル読み込みボタン
一度作成し、保存したKatalonRecorderのテストファイルを読み込むことができます。
②新規テストスイートボタン
新規にテストスイートを作成します。
テストケースをまとめる”ハコ”と考えていただくと、とらえやすいです。
③テストスイートのメニューボタン
テストスイート作成後、テストスイート名の右側のメニューボタンを押すと以下の操作が行えます。
・テストスイートの別名保存
・選択テストスイートのfile Close
・すべてのテストスイートのfile Close
・テストケースの新規作成
・テストスイートの名前変更
④テストケースのメニューボタン
テストケース作成後、テストケース名の右側のメニューボタンを押すと以下の操作が行えます。
・テストケースの新規作成
・テストケースの削除
・テストケース名の変更
・選択しているテストケースの実行
③テストケース詳細ビュー
Katalon Automation Recorderは、RecボタンによるWeb操作の記録登録、また記録をベースに、Web操作のコマンドを組み立てて、テストケースを作成することができます。
テストケース詳細ビューでは、その各コマンドを視覚的に確認することができます。
ユーザーガイドの解説では、Katalon Automation Recorderは、一般的なSeleniumコマンドのほとんどをサポートしています。
①-1テストステップの追加アイコン
テストステップを追加します。
①-2テストステップ削除アイコン
テストステップを削除します。
①-3テストステップコピーアイコン
テストステップをコピーします。
①-4テストステップペーストアイコン
テストステップをペーストします。
②-1コマンド設定
テストステップ作成後、コマンドを設定することができます。
②-2ターゲット設定
コマンドに対するターゲットを設定することができます。
例として、コマンドに「Open」を設定している場合、ブラウザ上で表示するURLを設定することができます。
②-3Value設定
テキストボックスにテキストを入力するコマンドを設定する場合、テキストボックスに入力するテキストを指定することができます。
②-4要素選択
Web操作のテストステップを組み立てる際、Web要素を選択することで、Target項目に設定することができます。
②-5要素のハイライト
選択したテストステップをハイライト表示にします。
④トップメニュー
①Speedアイコン
テスト実行の速度を調整します。
②設定アイコン
ユーザーがKatalon Studioがアクティブなブラウザーと通信するために使用するデフォルトのポートを変更できます。
③Helpアイコン
ユーザーマニュアルのページ、ビデオ、コミュニティサイト、Katalonページのリンク項目が表示されます。
④githubアイコン
githubページに遷移します。
⑤フッターメニュー
①Log
テスト実行を行うと、こちらにログが出力されます。
テストステップが問題なく行われたか、エラーが起きたかの確認が行えます。
②Screenshots
テストコマンド「captureEntirePageScreenshot」のステップで撮ったキャプチャが表示されます。
③Variables
現在選択されているコマンドの詳細情報が表示されます。 ユーザーは、テストの実行中に、このタブでコマンド名、ターゲット、および値を表示できます。
④Data Driven
ユーザーガイド表記なし。基本的に使えません。
⑤Extension Scripts
ユーザーガイド表記なし。基本的に使えません。
⑥Reference
選択したコマンドの詳細なドキュメントが表示されます。 これにより、ユーザーはコマンドの正しいタイプとパラメーターの数を確認できます。
⑥その他メニュー
①TestOpsボタン
Katalon analyticsのページに遷移します。
Katalon analyticsは別途、紹介いたします。
②保存ボタン
ファイルをHTML形式で保存します。
③削除ボタン
テスト実施を行った際のログ等削除します。
④折り畳みボタン
フッターメニューの領域を折りたたみます。
■ Step4.実際にテストページを使用してのレコード方法
では、実際にWebページの操作をレコードして、テストの自動化を体験してみましょう。
当ブログサイトで、Webブラウザのテスト用に以下ページを用意しました。
このページでは、以下要素の確認が行えます。
・テキスト入力
・ラジオボタン選択
・チェックボックス選択
・プルダウン選択
・URLリンククリック
今回はこちらのページを使って、レコードしてみましょう。
（事前準備）
事前準備として、ブラウザで、以下テストページを開いておきましょう。
https://susakiworks.com/softwareesting/testpage/test_page_no1/
Step1.
ツールバーから「+New」ボタンで、テストケースを作成し、名前を設定します。
Step2.
一度、Ctrl＋SでHTML形式でテストデータを保存します。
Step3.
「Recod」ボタンを選択します。
Step4.
Web操作の一例として、以下操作を行います。
①「名前」、「ニックネーム」「今日の日付を入力してください」の各テキストボックスクリック後、テキストを入力
②ラジオボタン選択
③チェックボックス選択
④プルダウンで、任意の季節を選択
⑤URLリンクボタンをクリック
Step5.
一通りのWeb操作が終わったら、Katalon Recoderに戻り、「Stop」ボタンを選択します。
STep6.
レコードが問題なく行えているかチェックを行います。
①トップMenu①Speedアイコンを選択し、スライダーでスピードを調整します。
（デフォルトの場合、最速の設定になっていますので、中間、遅めに設定します。）
②Playボタンを選択します。
レコードを行った一通りの操作が問題なく実施（各テストステップがグリーン表示）できていればOKです。
(Log結果)
■ 最後に
如何でしたでしょうか。
今回はKatalon RecorderでのWeb操作レコードについて述べてみました。
次回は、レコードではなく、テストステップを追加登録してテストケースをくみ上げていく内容を述べたいと思います。
最後まで見て頂いてありがとうございました。
Selenium実践入門 ――自動化による継続的なブラウザテスト WEB+DB PRESS plus
Pythonをおぼえたらブラウザ操作を自動化しよう: Seleniumで操作してBeautifulSoupで解析をする
