はてなブックマーク - Selenium IDEでスクリーンショットをとりながらテストする
    このエントリーをはてなブックマークに追加

    こんにちは、はじめまして。Fusicの働く母ちゃんフクダリナです。弊社ではテストや取説作成などの作業を担当しています。

    Fusic Advent Calendarを何事もなく終わって余裕かましてたらご指名をいただいてしまいました。

    心の準備が出来ておりません・・・

    今回は弊社小山からの要望があり、Selenium IDEでスクリーンショットを取りつつ 連続でテストする方法を書きたいと思います。

    Selenium IDEでテスト

    Selenium IDEを使うと 何度も同じテストが出来ます。また、同じようなテストを大量に行う場合にとても便利です。

    でも、やっぱり目視することで発見する問題もあると思います。

    そんなときにテストしている内容をスクリーンショット撮れたら便利です。

    TestSuiteをポチッとして帰宅すれば 朝テストが出来あがっている。あとはスクリーンショットを眺めておかしいところがないかなーって確認するということも可能になります。(途中でこけてたら泣きますが・・・)

    スクリーンショットを撮る準備

    Selenium IDE」の他にスクリーンショットを撮るツール「Screengrab!」をインストールします。

    テストしてみる

    試しに「ZENPREのサイトで間違ったログイン情報の場合に、正しくエラーメッセージが表示されるか」というテストをしてみます。

    スクリーンショットを撮るには、「captureEntirePageScreenshot」というコマンドを使用します。

    このコマンドの対象にファイル名をフルパスで指定すれば、スクリーンショットが撮れてしまいます。

    コードはコチラ

    <table border="1" cellspacing="1" cellpadding="1">
    <thead>
    <tr>
    <td colspan="3">New Test</td>
    </tr>
    </thead>
    <tbody>
    <!--==ZENPRE使ってテスト==-->
    <!-- Zenpreのページを開きます-->
    <tr>
    <td>open</td>
    <td>http://zenpre.net/</td>
    <td></td>
    </tr>
    <!-- ログインをクリック-->
    <tr>
    <td>clickAndWait</td>
    <td>//div[@id='header_right']/div[1]/a[1]/img</td>
    <td></td>
    </tr>
    <!-- test/testでログイン-->
    <tr>
    <td>type</td>
    <td>login</td>
    <td>test</td>
    </tr>
    <tr>
    <td>type</td>
    <td>password</td>
    <td>test</td>
    </tr>
    <tr>
    <td>clickAndWait</td>
    <td>//input[@type='image']</td>
    <td></td>
    </tr>
    <!-- エラーメッセージが正しく表示されているか確認-->
    <tr>
    <td>verifyTextPresent</td>
    <td>ログインID、または、パスワードが違います</td>
    <td></td>
    </tr>
    <!-- スクリーンショットを撮ります-->
    <tr>
    <td>captureEntirePageScreenshot</td>
    <td>C:\test\test01.jpg</td>
    <td>background=#FFFFFF</td>
    </tr>
    </tbody>
    </table>

    実行したらこんな感じ

    これで、実行結果が正しいかSelenium IDEの結果とスクリーンショットから判断ができますね。

    同様にして、複数のテストを一つのTestSuiteとして実行することも可能です。

    ここで一つ問題が。

    スクリーンショットのファイル名指定が絶対パスって使いづらくね?

    絶対パスにしてしまうと、他のテスターがそのテストケースを使おうと思ったときに、変更作業が発生したりします。

    そこで、storeコマンドを使って、パスの指定を一か所にまとめてしまいます。

    storeコマンドでパスを一か所にまとめる

    Selenium IDEで新しくTestCaseを追加して、以下のように記述します。

    <table border="1" cellspacing="1" cellpadding="1">
    <thead>
    <tr>
    <td colspan="3">CapturePath</td>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>store</td>
    <td>C:\test\store</td>
    <td>pref_path</td>
    </tr>
    </tbody>
    </table>

    そして、先ほどのTestCaseに以下を追加

    <!-- storeのパスでスクリーンショットを撮ります-->
     
    captureEntirePageScreenshot
    ${pref_path}001.jpg
    background=#FFFFFF

    これで実行すると

    スクリーンショット

    無事、スクリーンショットのファイルが出来ています。これで、TestCaseが幾ら増えてようとも、storeコマンドの対象を変えるだけでよくなりますね。

    おしまいに

    技術ブログというものを初めて書いたので、至らない点が多々あるかと思います。何かありましたら、Fusicフクダまでご指摘ください。

    次回は手抜きおいしいおでんの作り方とかにしてもらえると助かります。

      はてなブックマーク - CakePHP Clickinit Pluginが意外に便利
      このエントリーをはてなブックマークに追加

      Fusic Advent Calendar発起人の小山です。
      最近はPortisheadばかり聴いています。
      さて、Fusic Advent Calendarもクリスマスバージョンが無事終わり(自分は見事に当たりませんでした)、
      エクストラステージ「日本式アドベントカレンダー」に突入しております。
      「も〜うい〜くつね〜る〜と〜」のあれです。

      ブラウザから確認

      Webシステムを作成していると、やっぱりブラウザから挙動をテストをしたりしますよね。
      その時に、便利なのがSeleniumです。
      簡単な挙動確認ならば、Selenium IDEで操作の記録をすることで、何度も同じ操作の確認を行うことができます。

      では、ユーザの新規登録はどうしますか?

      さらにメールアドレスを登録して、確認メールが来るようなテストはどうしていますか?

      一度登録してしまうともう一度そのメールアドレスは登録できなかったりしますよね。

      ブラウザから初期化

      方法はいろいろあると思います。
      データベースを直接操作してもいいですし、そもそもSeleniumを使っているならば、Selenium RCなどを利用する際にデータベースを初期化してもいいかもしれません。
      ただ、ブラウザからちょっと簡単に操作したいと思ってCakePHPのPluginを作成してみたので紹介したいと思います。

      Clickinit Plugin

      Clickinit Pluginはブラウザ側からサーバサイドで処理を実行するためのプラグインです。

      github.com/k1LoW/clickinit

      以下のようにAppContollerの$componentsに登録するだけで、まずは設置完了です。

      次に、実際にサーバサイドで行う処理を書いたスクリプトをapp/vendor/shells/に設置します。
      その時に、ファイル名の先頭には数字を付与してください。これは実行すべきファイルの判別と、実行順序を判定するために利用しています。
      (例:00-initdb.php, 01-clearcache.php)

      あとはページの左上に表示されたタブをクリックするだけで、すべてのスクリプトを実行することができます。
      スクリプトの実行はrequire()を利用しているので、CakePHPの定数やクラスなども使えます。

      たったこれだけのプラグインです。
      Clickinitはサーバのスクリプトを実行するスイッチ的なものです。
      たったこれだけですが、意外に便利です。
      例えば、データベースの初期化だけでなく、CakePHPのキャッシュを一旦削除して挙動を確認するときにも便利です。

      ブラウザから操作ができるので、開発時のSelenium IDEのテストケースに追加してもいいかもしれません。

      注意

      Clickinit Pluginはあくまで開発時に使うプラグインです
      特にサーバ内スクリプトを動かすものになりますので、デプロイ時には外すようにしましょう

      まとめ

      ブラウザからサーバ内スクリプトを実行するClickinitを紹介しました。

      ブラウザから初期化ができるだけで、意外に効率もあがります。
      もし良かったら皆さんも試してみてください。

        はてなブックマーク - すごく分かりにくい方法でメリークリスマス
        このエントリーをはてなブックマークに追加

        Fusic 平田です。
        extraってどこのやりこみ系のゲームですか。
        ていうか22日と23日と25日が当たるってひどいですよね。。。

        というわけで聖なる夜にちゃきちゃきblog書いています。

        そう、聖夜です

        てことで、クリスマスを祝う画像を用意しました。
        (クリックで拡大)
        すごく祝っていますね。

        分かりにくいとのことなので

        プログラムでお祝いします。

        >+++++++++++[<++++>-]>>+++++++++++[<+++++++>-]<>>>++++++++++[<++++++++++>-]<+<<.>>.>+++[<++++>-]<+..+++++++.<<<<.>+++[<---->-]<.>>+++++++++++.>>>+++[<---->-]<.<+++[<+++>-]<.>>>++[<+++>-]<.<<<<+.

        やっぱりすごく祝っています。

        解説(コード)

        先に後者。
        説明する間でもありませんが、Brainf*ckのコードです。
        # ちゃちゃっと書いたので洗練されていない点はご勘弁を。
        ここの「Program:」のところにコピペして貼りつけて「Run」を押してみてください。
        ちゃんとお祝いしているはずです。

        解説(画像)

        で、画像のほうはPietです。
        この画像自体がプログラムなんです。
        Brainf*ckからPietへの変換はbf2pietを使いました。
        動作確認はnpietで行っていますが、若干あやしい部分もあるので追検証とかしてくれるとすごく助かります。
        まあそんな暇な人はいないでしょうけど。。。

        てことで

        書いてて悲しくなってきたのでこのくらいでいいでしょうか。
        もうちょっとだけ続くらしいですよ。