JavaScriptテストの基礎知識と使えるフレームワーク6選フレームワークで実践! JavaScriptテスト入門(1)(1/3 ページ)

しっかりとJavaScriptの“テスト”を行うために、最近のJavaScript事情やテストを取り巻く環境、今注目のテストフレームワークを6つ紹介する

» 2012年09月05日 19時32分 公開
[佐伯純,TIS コーポレート本部 戦略技術センター]

JavaScriptでもテストを書こう

 @ITの読者の方たちのほとんどは、どのような言語を主に利用しているのかなどの違いはあるにせよ、日常的にプログラムを書いている方たちが多いかと思います。

 アプリケーションを作る、ライブラリを作成する、オープンソースプロジェクトに貢献するなど、皆さんがプログラムを書く場面はそれぞれいくつかあるはずです。それらプログラムを書く場面に共通して大切な習慣の1つとして、「作成するプログラムに対しては必ずテストコードを書く」ことがあるのは、誰にでも同意してもらえることでしょう。

 1回だけで使い切り、もう2度と使わないようなプログラム以外、通常あらゆるプログラムは最初に作成されてから、さまざまな修正や変更が加えられます。

 さらに、そのような修正・変更を行うのは、そのプログラムを最初に作った人とは限りません。プログラムの仕様に従って、どんな動作をするように書かれたものなのかを保証するテストコードがなければ、「常に動作する状態を保ちながら、誰がどんなタイミングで、そのプログラムに変更を加えても大丈夫」という環境を作ることは困難です。

 また、「テストコードが書きやすいプログラムか」、さらには「常にテストコードが書きやすい状態にプログラムを保てているか」が、そのプログラムが良い構造・設計で作られているかを判断するための1つの指標にもなります。それぞれの処理が適切な大きさに分割され、その処理で何を実現しようとしているのかを的確にとらえて設計されていれば、テストコードを書くこと自体も容易なはずです。

 その他にも、テストコードを書くことの有用性・重要性については、皆さんいくつも思いつくのではないでしょうか?

 ここでは本題と外れますので、テストコードを書くということのみについて、さらに踏み込んでお話しすることは避けますが、たまには普段の自分たちのプログラミング、開発活動を思い返してみて、「ちゃんとテストコードを書く習慣ができているかなぁ?」「テストコードがちゃんと書ける良い設計のプログラムを書けているかなぁ?」ということを振り返ってみるのもいいかもしれません。

 さて、そんな振り返りをしてみて、特にWebアプリケーションの開発をしている人たち(この連載の筆者たちもそうですが)には、「はてさて、あそこもテストコードあった方が良いのは分かってるんだけど、なかなか手を付けられないんだよなぁ」と、共通して思い当たるところがあるのではないでしょうか? そう、JavaScriptで書かれた部分です。

最近のJavaScript事情

 一口にJavaScriptといっても、最近ではその利用が多岐に渡っています。ここで少しだけその点について述べたうえで、今回の連載で扱う範囲をお話しします。

 もはや、あらためて書くまでもないことですが、ネットスケープ社で「LiveScript」として産声を上げた当初から、JavaScriptはWebブラウザ上で動作し、クライアントサイドでWebページに動的な要素や機能を追加するために使われてきました。一時期のWebブラウザ間の実装差異による互換性のなさが、ECMAScriptとして仕様が標準化されていく過程で徐々に解消されるようになってからは、容易に使えることもあって、利用が広まりました。

クライアントサイドJavaScriptは、Ajax→jQuery→HTML5という大きな流れ

 「Ajax」という技術的な再発見がなされてからは、それがさらに加速しました。その利用の広がりに従って、便利でよくできたライブラリなども多数作成されるようになりました。例えば、皆さんがよく利用しているものだとjQueryなどは好例でしょう。

 さらに、今後のHTML5の利用を想定すると、JavaScript利用の主戦場の1つがクライアントサイドであることに変わりはないでしょう。

サーバサイドもJavaScriptで

 一方で、例えば「node.js」を代表とするようなサーバサイドでのJavaScriptの利用も広がっています。もともと、Webブラウザ上でのJavaScriptの実行パフォーマンスを向上させるために改良が重ねられてきた実行エンジンが、今では単独でも利用できるような形で提供されています。例えばnode.jsでも利用されているグーグルの「v8」は良い例でしょう。

 エンジンが単独で利用できるような形で提供されるようになると、JavaScriptがもともと持っている言語的な特徴としての柔軟性もあって、単にWebページを動的にするのに留まらず、バックエンドの処理まで含めた実装への応用が始まりました。

スマホ/タブレットのアプリもJavaScriptで

 また、最近のもう1つのJavaScript利用の重要な流れとして、モバイルへの応用が広まりつつあることが挙げられます。スマートフォンタブレットが普及するにつれ、本格的なマルチデバイス・マルチスクリーンの時代が到来しています。

 それらデバイスやプラットフォームの差異を吸収するクロスプラットフォームな開発技術が必要となってきています。そこで、Webの技術を利用していくことが考えられるわけですが、それに伴い、HTML5を応用したり、「Titanium Mobile」「PhoneGap」などのフレームワークや、「jQuery Mobile」などのライブラリを使うことで、モバイル向けにJavaScriptの利用が進んできています。

クライアントサイドJavaScriptはテスト環境が整ってきた

 さて、ざっと最近のJavaScript事情を概観したところで、今回の連載ではどの部分にフォーカスするかですが、やはりWebブラウザ上で動作する部分、クライアントサイドでのJavaScriptの実装に対するテストについてをまとめてみようと考えています。

 「なぜ、クライアントサイドなのか」には2つ理由があります。

 サーバサイドでの利用の広まりなど、やや事情が異なる面も出てきてはいても、先ほど述べた通り、WebアプリケーションにおけるJavaScriptの主な活躍の場がモバイルへの応用も含めたクライアントサイドであるという点が1つです。

 クライアントサイドのJavaScriptは、その動作にWebブラウザが必要で単純にテストコードを書いてテストをするという具合にはいきませんでした。しかし、最近のテスティングフレームワークの中には、その点を克服しつつ、クライアントサイドを含めたJavaScriptのテストを行いやすくするものが出てきているからというのが、もう1つの理由です。

 本連載では、いくつかのテストのためのフレームワークについて、特徴と実際の使い方をまとめます。今回は連載第1回目なので、JavaScriptのテストに関する概観とクライアントサイドのテストを行う場合の手法・テスティングフレームワークの種類、連載の中で扱うフレームワークの簡単な紹介を次項以降でお話しします。

 本連載では扱いませんが、もちろんサーバサイドJavaScriptのテストを行いやすくしてくれるテスティングフレームワークにもいくつか良いものがあります。すでにご存じな方も多いかもしれませんが、興味がある方はそちらも合わせて調べてみると、より良いJavaScriptライフが送れるはずです。

       1|2|3 次のページへ

Copyright © ITmedia, Inc. All Rights Reserved.

スポンサーからのお知らせPR

注目のテーマ

Microsoft & Windows最前線2025
AI for エンジニアリング
ローコード/ノーコード セントラル by @IT - ITエンジニアがビジネスの中心で活躍する組織へ
Cloud Native Central by @IT - スケーラブルな能力を組織に
システム開発ノウハウ 【発注ナビ】PR
あなたにおすすめの記事PR

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。