アイフラッグラボ
iFLAG Labs is a technical information site which iFLAG offers.
iFLAG Labs provides you with the opportunity to experience and evaluate new and emerging innovations, technologies, and service from iFLAG.

トップページ»  SeleniumIDE導入Tips»  拡張スクリプト(user-extensions.js)の作り方

拡張スクリプト(user-extensions.js)のつくり方

 

拡張スクリプト(エクステンション)の作り方その1

皆さんこんにちは。アイフラッグの品質管理チームKです。
今回はSelenium IDEの拡張スクリプト(user-extensions.js)のつくり方について、ざっとまとめておきたいと思います。

Selenium IDEでエクステンションを使えるように設定する方法は、こちらの記事の「エクステンションのインストール」を参照してください。
では実際にuser-extensions.jsの中身をどう書くのでしょうか。 サンプルを見てみます。

Selenium.prototype.doTypeToday = function(locator) {
    var date = new Date();
    year = date.getFullYear();
    month = date.getMonth() +1;
        if(month < 10){
            month = '0'+month;
        }
    day = date.getDate();
        if(day < 10) {
            day = '0'+day;
        }
    
    var restored = year + '/' + month + '/' + day;
    this.doType (locator,restored);
}

今日の日付をyyyy/mm/dd形式で指定した場所に入力する、という動作をする関数を作ってみました。

Selenium.prototype.do[オリジナルのコマンド名] と記載すると、Selenium IDEの「コマンド」として認識されオリジナルのコマンドを設定する事が出来るようになります。
function(locator)  locator という引数を指定すると、Selenium IDEの「対象」に指定した場所(id=○○など)を使用する事が出来ます(不要な場合は空欄で大丈夫です)。

this.doType オリジナルコマンド関数の中で別のSeleniumコマンドを使いたい場合、do[コマンド名]と記述すると利用できます。
ファイルを保存してSelenium IDEを起動し、動作を確認します(以下のテストケースは、Googleホームページを開き、検索窓に日付を入力します)。

open http://www.google.co.jp  
dateToday id=lst-ib  

正常にエクステンションが読み込まれていれば、dateTodayというコマンドが設定できるかと思います。実行すると、Googleホームページの検索窓に日付が入力されます。

少しカスタマイズしてみましょう。
例えば日付の区切り文字をテストごとに変更したい場合があるとします(Aテストではyyyy/mm/dd形式、Bテストではyyyy-mm-dd形式など)。
user-extensions.jsのサンプルスクリプトを以下のように書き換えます。

Selenium.prototype.doDateToday = function(locator,separator) {
    var date = new Date();
    year = date.getFullYear();
    month = date.getMonth() +1;
        if(month < 10){
            month = '0'+month;
        }
    day = date.getDate();
        if(day < 10) {
            day = '0'+day;
        }
    
    var restored = year + separator + month + separator + day;
    this.doType (locator,restored);

function(locator,separator) と言った感じで
オリジナルコマンド関数の第二引数に区切り文字(separator)を設定することによって、Selenium IDEの「値」入力欄の情報を持ってくる事が出来るようになりました。

user-extensions.jsを再度保存します。先ほど作成したSelenium IDEのテストケースに戻り、dateTodayコマンドの「値」に任意の区切り文字を入力します。

open http://www.google.co.jp  
dateToday id=lst-ib -

yyyy-mm-dd 形式で入力できれば成功です。非常に簡単で申し訳ありません。。

テスト対象のシステムに応じて、汎用化できる部分はuser-extensions.jsにまとめてしまうと効率が更に上がりますね。
ちなみにuser-extensions.jsを修正中に、頻繁に読み込みを行いたい場合は、設定>オプション>一般タブの
「アクティブに開発者向けツール」というチェックボックスをONにすると、拡張スクリプトパス入力枠の右側に「リロード」ボタンが表示されます。
修正後リロードを行って、user-extensions.jsの修正をすぐに反映させる事が出来ます。

皆様のお役に立てば幸いです。ありがとうございました。


2013/07/29
アイフラッグ担当 K


アイフラッグラボ(IFLAG Labs)とは

アイフラッグラボとは、アイフラッグが提供する技術情報サイトです。アイフラッグが提供するスモールビジネス向けのITサービスの開発実績から培った技術ノウハウを公開していきます。技術情報が皆さまのサポートになれば幸いです。