対象読者
- JavaScriptの基本をある程度理解している方
- テストコードをこれから書こうと考えている方
複数のブラウザでのJavaScriptのテスト
前回までは、主にテストコードの書き方について説明してきました。今回からは、テストの実行環境についての説明をします。
JavaScriptの実行環境は、クライアントサイドはブラウザ、サーバサイドは例えばnode.jsです。サーバサイドは実行環境を決めてしまえばその環境だけで動作しますが、クライアントサイドは多くのブラウザそしてバージョンが存在し、ユーザに選択権があります。また、それぞれの環境でJavaScriptの実行結果に差異があることもあり、ユーザが選択しうる環境それぞれで可能な限りテストを行う必要が出てきます。
そこで、js-test-driverを使用すると、JavaScriptのテストコードを複数のブラウザで一気に実行できる環境を作ることができます。js-test-driverは、図1のとおり、サーバを立ち上げ各ブラウザから接続し、サーバ側でテスト実行コマンドを実行することで、接続したすべてのブラウザでテストが実行され、その結果をサーバ側で取得できます。処理の流れを要素ごとに見ていきましょう。
1）Sources
JavaScriptのプロダクトコードとテストコードです。
2）Config
js-test-driverの設定ファイルです。読み込むJavaScriptファイル、テストコード、サーバ情報などを設定できます。
3）Client
コマンドラインでの実行を示しています。サーバの立ち上げとテストコードの実行はコマンドラインから行います。
4）Server
js-test-driverのサーバです。テストを動作させるブラウザを接続し、テストを実行します。
5）Browsers Slaves
テストを実行させるブラウザです。js-test-driverのサーバにURLを入力して接続し、処理画面を表示させておきます。表示させておくだけで、コマンドラインからテスト実行の指示が出されると、接続しているブラウザでテストを実行します。
通常ブラウザでのテスト実行は、テスト実行ページにアクセスし、実行結果を確認するというプロセスですが、js-test-driverを使用することにより、一度に複数のブラウザで実行でき、コマンドで実行結果を確認することができます。Jenkinsのようなツールと組み合わせ、継続的インテグレーション（CI）を行うことも可能になります。継続的インテグレーションとは、継続的にビルド（統合）を行っている状態をいい、コンパイルやサーバデプロイと共に自動テストも組み合わせて行います。また、js-test-driverにはカバレッジ取得など、プラグインで機能を追加できる仕組みも提供されています。