ライブラリをCDNからロードする
よく使われるライブラリは、誰でも利用できるように企業や団体などがCDN（ファイルを配信するための比較的大規模なネットワーク）にホスティングして公開している場合があります。有名なものとしてはjQueryをGoogle（Google Libraries API）やMicrosoft（Microsoft Ajax Content Delivery Network）がホスティングしています。自分のWebサイト上に設置したjQueryを使わずにこれらのCDNを使うメリットはいくつかあります。
ライブラリをCDNからロードすると、自分のサーバやネットワークの負荷を減らすことができるうえ、CDNにより世界中のユーザーに対して高速に配信されます。さらに、複数のサイトが同じCDNを使うとブラウザ側でファイルのキャッシュが効きます。他のサイトを訪れた際にキャッシュされたjQueryが別のサイトでも使えるため改めてダウンロードする必要がなく、ページのロードが速くなります。
jQuery 1.7.2でGoogleのCDNを使うには、jQueryの読み込み先を以下のURLに変更します。
jQueryのバージョンアップに従ってCDN側にも新しいファイルがアップされ、バージョンごとに独立したURLで利用できます。GoogleのCDNではjQuery UIなど他のライブラリも提供されています。利用できるライブラリの一覧はこちらを参考にしてください。
ブラウザでのテストを自動化する
Webサイトを開発したら、実際のブラウザで正しく動作するか検証する必要があります。ページのレイアウトだけならばブラウザを立ちあげてアクセスしてみればわかりますが、フォームの送信など複雑な操作を手動で毎回行うのは大変な作業です。幸いなことに、様々なアプローチでそのような操作を自動化する方法があります。
Selenium
Seleniumはブラウザの操作を自動化するツール群です。Selenium IDEというFirefoxのアドオンを使うとプログラムを1行も書かずにブラウザを操るプログラムを作れます。
Selenium IDEの使い方は次の通りです。ダウンロードページからSelenium IDEのFirefoxアドオンをインストールし、ブラウザのツールメニューからSelenium IDEを起動します。Selenium IDEのウインドウで右上の記録ボタンを押し、Webページに戻ってリンクのクリックやテキストの入力など記録したい操作を実際に行います。
ページ内のテキストを選択して右クリックし、verifyTextPresentをクリックすると、選択したテキストがページ内に含まれていることを確認するテストが作られます。
記録を停止するにはもう一度記録ボタンを押します。記録した操作は1つのテストケースとなります。テストケースを選択して実行ボタンを押すと、あたかも自分で操作しているかのようにブラウザの操作が自動で進みます。verifyTextPresentで指定したテキストが存在しないなど、期待通りの結果が得られなかった場合にはエラーで停止します。
記録したテストケースは、ファイルに保存して後で実行できるほか、RubyやJavaなどのプログラムとしてエクスポートすることもできます。エクスポートしたプログラムはSelenium Serverと組み合わせることでコマンドラインからテストを実行できます。
Selenium IDEを使ったテストの自動化は非常に手軽で、サーバーを用意したりプログラムを書いたりする必要がありません。比較的単純なテストであればSelenium IDEは非常に便利です。
Watir
Webサイトが大規模になりテストが複雑になると、Selenium IDEではカバーしきれなくなったり、テストケースのメンテナンス作業がかえって複雑化してしまうことがあります。複雑なテストは手動で作るのがベストです。
Watir（「ウォーター」と読む）というツールを使うと、Internet Explorer（以下、IE）やChrome、Firefox、Safari、Operaといった主要なブラウザをRubyスクリプトで制御して実行結果をテストできます。OSやブラウザは自分で用意する必要がありますが、非常に応用の幅が広いツールです。一時的や小規模な運用であればSeleniumで十分ですが、長期や大規模での運用となるとWatirの方が後々便利でしょう。
IE、Firefox、Chrome、Operaの各ブラウザについてはWatir WebDriverを使ってほとんど同じソースコードでテストできます。このWebDriverという機能はSafariではサポートされていないため、Safariでテストする時だけはSafariWatirというツールを使います。Watir WebDriverとSafariWatirのAPIは互換性はないものの、構造はかなり似ています。なお、SafariWatirはMacでのみ使えます。
例えばリスト3のようなスクリプトでFirefoxをリモートコントロールできます。
require 'rubygems' require 'watir-webdriver' browser = Watir::Browser.new :firefox browser.goto 'http://www.yahoo.co.jp/' # URLを開く browser.text_field(:name, 'p').set 'スカイツリー' # テキストを入力する browser.button(:id, 'srchbtn').click # ボタンをクリックする if browser.text.include? '東京スカイツリー' # ページ内に特定の文字列があるか確認する puts 'ok' else puts 'not ok' end
リスト3を実行すると実際にブラウザが起動し、人間が入力しているのと同じように操作が進みます。上記のソースコードの:firefoxの部分を:ieや:chrome、:operaと変えるだけで、各ブラウザでテストできます。
PhantomJSなどのヘッドレスブラウザとは違ってGUI環境は必須ですが、より精度の高いテストを実施することができます。
Watirの使い方はここでは詳しく解説しませんが、他のWebサイト等を参考にしてみてください。
