第6回オープンソーステクノロジー勉強会 −開催のご報告−

2006年8月24日(木)、国際大学グローコムにて、第6回「オープンソーステクノロジー勉強会」が開催され、約80名の方にお越しいただきました。

第一部では、株式会社ケイビーエムジェイ取締役最高技術責任者の笠谷真也氏にご講演いただき、Seleniumの歴史、活用事例、Selenium IDEの拡張などについてお話をいただきました。

（発表資料はこちら、デモを含む資料はこちら）。

1.jpg

第二部ではグリー株式会社の岩崎 匡寿が、SelenuimのGREEでの活用事例について紹介させていただきました。

（発表資料はfileこちら）。

2.jpg

また、懇親会も前回同様盛況となりました。ご参加いただいた皆様、誠にありがとうございました。

来月の勉強会は、9月下旬を予定しております。近日ご案内を掲示いたしますので、ぜひとも奮ってご参加ください。

参加者からのご報告

参加者の皆さんのブログや日記のエントリーをご紹介します。こちらで確認し次第、随時更新いたします。今回の勉強会について書かれた方は、「オープンソーステクノロジー勉強会」という言葉を入れてご記入いただければ、追加いたします。

講演資料(1) 「Selenium徹底活用」

podcast
音声ファイル(mp3 59,389,075バイト)
RSSフィード(podcast対応)
講演資料
http://labs.gree.jp/presentation/20060824/slides/selenium.html (デモを含む資料はこちら)

勉強会前の雑談

  • Selenium recorder はテストを作るのが面倒だから作った
  • Selenium IDE は Seleinum 開発者の方々に誘われて
  • 去年夏ぐらいから試行錯誤しながら使っている
  • 実際に運用に乗せて使えるようになるまでは?
    • ここ最近社内で作っているパッケージ製品の開発に使っている
    • 3 ヶ月くらいかかった
  • 受託、パッケージ、それぞれの活躍する場は?
    • どちらでも使えるはず。

自己紹介

  • 名前: 笠谷 真也 <kasatani ａｔ gmail.com>
  • KBMJ 取締役 CTO
  • 受託開発、サービスの構築
  • 普段は RoR、Java で Web アプリケーションの開発を行っている
  • Selenium IDE の開発者

Agenda

  • Selenium 紹介
  • 活用事例
  • Selenium IDE を使い倒す

Selenium紹介

  • Webアプリケーションテストツール、実際のブラウザを駆動してテストをする。
  • デモ (足し算アプリ)
    • テキストフィールドが2つ、結果が表示される。
    • TestRunner (Selenium テストの実行画面)
    • テストケースを読み込む

Seleinum ファミリー

  • Selenium Core
    • JavaScript で書かれた Selenium の中心部分
    • 主要なブラウザで動作 (FireFox, IE, Safari, Opera.)
    • テストケースは HTMLのテーブルで作成。
      • HTML の行ごとにコマンドを書く。
      • 最初のカラムにコマンド名、二番目のカラムにパラメータを書く。
    • テストケースに記述できるコマンド
      • action (open: URLを開く,type: 入力を行う)
      • assertion (verifyText) - 状態確認
      • accessor
    • 問題点
      • ループや条件分岐を HTML のテーブルで表現するのが困難。
      • Selenium Core やテーブルをサーバに置いておく必要がある。
      • 自動でテストを定期的に実行できない。
  • Seleinum IDE
    • テストを書くのが面倒くさい
    • FireFox の拡張機能として動作
    • ブラウザ上の操作を記録、テストケースとして保存できる。
    • デモ
  • Seleinum Remote Control
    • Seleinum Core の問題点を解決するためのもの
      • Java, .NET (C#, VB), Ruby, Perl, Python といった言語で Selenium をブラウザを操作可能.
      • さまざまな言語に簡単に対応するため、サーバとクライアントに分かれている。

他の Web アプリケーションテストツール

  • リクエストをシミュレートするもの (WWW::Mechanize, JWebUnit, Canoo Web Test etc.)
    • 問題点
      • JavaScript に対応していない
      • 実際にブラウザを起動したほうが楽しい
    • よい点
      • ブラウザを起動しないで良い分、短時間でテストを気軽に実行できる。
  • ブラウザ上の操作をシミュレート
    • Watir (Ruby で IE を操作)
    • Watij (Java で IE を操作)
    • mechanize.js (JavaScript で IE を操作)
    • Sahi (Java + JavaScript で実装されている)
  • Selenium ほど多くのブラウザ・OS・言語に対応しているテストツールは無いはず。

Selenium Core / RC で対応中の問題

  • フレームに対応できていない。
    • TestRunner 自体がフレームでできているため、target="_top" をされるとテストにならない (フレームを廃止する方向で開発中)。
  • 複数ドメインにまたがるテストができない (開発中)。
  • Selenium RC の SSL 対応ができていない (開発中)。

活用事例 - KBMJ の SNS パッケージ

  • RoR で開発。
  • Seleinum on Rails を利用してテストを実行。
  • 開発の流れ
    • Test Driven Development
    • Seleinum は TDD というよりむしろ動作確認に使用。画面を作ってから Selenium で記録することが多いので。
    • 手作業でテストを記録するのが面倒な場合はテストを先に書くこともある。
  • Seleinum on Rails
    • Rails アプリケーションに Seleinum Core を使ってテストを統合する
    • HTML よりもエディタで書きやすい、wiki ライクなフォーマットでテストを書ける。
    • Ruby でも書ける。
    • Seleinum RC のようにリアルタイムで実行するのではなく、HTML を吐き出して TestRunner にa走らせる。
  • テスト作成のポイント
    • 複雑な Xpath による element locator を振るのは避け、適宜 id を振る。
    • データベースの初期化
      • テストを再現させるため、まずは setUp する。
      • RoR では fixtures という仕組みが用意されているので、これを Seleinum on Rails でも利用する
    • メールのテスト
      • 会員登録画面 etc. メールアドレスを入力すると確認のメールが届くようなパターン
      • サーバ側でメールを読んで URL を表示するようなコントローラを RoR で作成
      • URL らしきものを取り出して表示する
      • open コマンドでそのコントローラをたたいて、表示内容を assert する。
    • Continuous Integration
      • Continuum というツールを利用
      • 新しいリビジョンがコミットされたタイミングで、コミットフックでテストを実行
      • 失敗したら開発メーリングリストにメールを送信する
      • テスト自体には 12 分などかかるので、開発者がその都度はしらせていたら時間の無駄、Continuous integration tool にまかせる。

Seleinum IDE を使い倒す

  • Selenium IDE の拡張機能を使う
    • Selenium IDE 0.8.0 から、ユーザが自由に JavaScript のコードを追加できるようになった。
    • Seleinum 自体も user-extension.js を使って自由にカスタマイズできる。
    • Seleinum IDE の記録できないイベント (onmouseup / onmousedown) などを記録する拡張を作る (for AJAX, etc.)
  • ハンドラの種類
    • Event Handler - 操作によって発生したイベントをハンドルする
      • 例: ClickAndWait
    • Locator Builder
      • Event Handler や Command Builder でコマンドを生成する際、要素を指し示す element locator を生成する部分。
      • できるだけ neat な element locator を決定するようにする。
      • どういう locator を生成するか、優先順位は笠谷さんの主観によって決まっている。
    • Google Calendar によるデモ
      • Selenium IDE はクリックを Click アクションとしてしか記録しなiいので、マウスをクリックした位置により、挙動が変わるようなアプリケーションをテストする場合には不十分, 代わりに ClickAt アクションを記録するような拡張を施してみる。
      • AJAX アプリケーションでは、クリックしてから、次にターゲットすべき要素が現れるまでにタイムラグがある場合、期待通りにテストが動かないことがある。手でテストを細工する必要がある。
      • Drag and Drop を記録する拡張を施してみる - onmousedown イベントが発されたときの座標値を記録しておき、onmouseup イベントが発されたときの座標値とを比較して、変わっていたら dragdrop アクションを記録するような拡張。

Selenium IDE の過去と未来

  • 2005/08 Seleinum Recorder 0.1、ちょくちょくバージョンアップ
  • 2005/11 Seleinum Recorder 0.6、最後のリリース。似たようなツールの Seleinum Editor があり、マージするという話になっていたころに OpenQA に移動
  • 2006/2 Seleinum IDE (0.7) 最初のリリース
  • 2006/6 Seleinum IDE (0.8) 最新版
  • 2006/9 Seleinum IDE (0.8.1) バグ修正、RC への対応強化、ヘルプ etc.
  • 2007初頭? Seleinum IDE (0.9) テストスイート作成機能強化

質疑

  • Seleinum IDE が 1.0 にならないのは?
    • 今の時点で 1.0 にしてしまうと、Selenium 本体を追い越してしまうので (笑)
  • 英語が堪能なようだが、背景を聞きたい
    • 小学生までイギリスに住んでいた
    • それからはブランクがあり、情報発信も大変だったが、慣れてくると大丈夫
    • PodCast を聞いたりしている
  • IE でのテストはどうやっているか?
    • Seleinum Core だけを走らせたりしている
    • FireFox から IE をコントロールしたりする妄想をしている (笑)
  • どうやって RC はブラウザをコントロールできるのか?
    • HTTP でコントローラから Selenium Server にコマンドを投げる
    • ブラウザは Selenium Server にリクエストを投げる
    • Selenium Server はコントローラからリクエストを受け取ったタイミングでブラウザにコマンドを送信。
  • PHP の対応状況は?

講演資料(2) 「Selenium@GREE」

podcast
音声ファイル(mp3 32,760,477バイト)
RSSフィード(podcast対応)
講演資料
filegree_study_20060824_selenium_gree.pdf

導入のきっかけ

  • 2005/11のデザインリニューアルはデスマーチだった。
  • 運営をきちんと反省したうえで、惨劇を繰り返さないために。
  • Webデザインパターン
  • 仕様のドキュメント化
  • テスト体制の整備(UnitTestと、Seleniumによるテスト)

テストツールの選定条件

  • コードを書かずにすむ事。

SeleniumIDEの存在

  • ブラウザを扱うことができればいい。
  • 様々なブラウザで動作。

課題

  • リグレッションテストへの対応
    • リグレッションテストとは？
      • システムの変更による過去のバグの再現を防ぐ。回帰テスト、退行テスト。
      • リグレッションテストは、Seleniumテストを利用して実現可能
      • テストを充実させる、つまりカバー率あがればあがるほどいい
  • テスト環境整備(再現性の確保)が必要
    • テストの実行条件をそろえる
    • DB、memcache、画像サーバetc... 初期化させるのは難しい
    • ある程度のところまでは初期状態を確保できるようつとめている
    • ユーザー情報、キャッシュ、各種画像
    • DB
      • ユーザー1人の状態から、招待を繰り返し、さまざまなパターンの5,6名を登録しておく。
    • メモリキャッシュはクリアしておく。
    • 実環境と同等のテストが望ましいが、難しい。できるだけ実環境に近づけてはいる。
    • 動作環境のパッケージ化
      • 必要なソフトウェアをdebパッケージ化
      • apt-get一発で環境構築が可能にする。
    • VM Ware上にテスト環境を構築
      • 無料化したという事も後押し。
      • 独立したテスト環境を構築可能。
  • テストガイドラインの確立
    • 動いていてもWarning,Noticeがでているかもしれず、それらを全て補足するのは困難。
    • なにをテスト成功にするか
    • あまり複雑にすると、テスト構築コストがかかる
    • Flickrから3つのガイドラインを拝借。
      • 基本的な機能を識別する
      • 理想的なパスを使う(正常系シナリオ)
      • 境界チェック
    • シナリオベース
      • 一般的ユーザーの手順を想定したテストを記録
      • たとえば、ログインして、受信箱を開いて、未読メールを読んで、受信する。

テスト立案の流れ

  • 初期化スクリプト
  • SeleniumIDEで操作記録
  • 初期化
  • 一度動くかチェック
  • TestSuiteに組み込み
  • TestSuiteでチェック
  • TestSuiteをcommit
  • TestRunnerからTestSuiteを実行可能
    • DBなどの環境初期化・終了処理をPHPアプリで書いておく。
    • それを呼び出すようにTestSuiteに組み込む。

導入例

  • メールシステムの再構築時に導入。
  • すべてのメール関連操作に影響
  • 送信者と受信者の組み合わせで4通りのテストパターン
  • 各パターンですべてのテストをパスする必要があり、人手では辛い。
  • （ムービーでのデモ)

メリット

  • 非常に安心感をもってコードを変えることができる
  • 手動で行うより高速で正確。
  • カバーされている範囲だけだが、バグに気づきやすい
  • テストケースが事実上動作仕様になるので、要求仕様との整合を確認できる

今後の課題

  • 本アプローチの啓蒙
  • 環境の整備
  • テストしやすい設計
    • 時刻依存ではなく、上からn番目というような画面設計ができるようにする。
    • コードは書かないが、考える必要有り
  • テスト実行時間
  • テスト専用機とか、夜間バッチでやる必要があるかもしれない。
  • どこまでテストすればいいのかを考える必要あり
  • テスト自体膨大になるので、どう管理していくか
  • デザインの異変を検出できないか

質疑応答

  • selenium以外のテストはどのように行っているか。
    • エンジニアが手で実施している。
    • 基本的なライブラリはUnitTestがあるが、他の運用はこれから。
  • UnitTestとSeleniumテストの連携は？
    • まったく別として考えている
    • UnitTestはTestFirstでやっている
    • Seleniumはできている画面にたいして。あと、きちんとカバーできるかという問題ある。
    • 既に画面ができているところからという面でUnitTestとは別。
  • ブラウザのカバレッジ
    • ブラウザ依存するようなことはしていない機能だったので、Firefoxでのみおこなった
  • 異常系テストも有効だと思うが(XSSとかインジェクションとか)、やっているか？
    • HTMLタグなどを入力しているテストもあるが、基本的にXSSについてはSeleniumとは別にテストを行っている。
  • スクリーンショットをとるタイミングとテストのタイミングの同期をしっかりしなければならない。
    • SeleniumRemoteControlをHackして、適当なところでhookするような機能を追加してみた