UnittestJS でクロスブラウザテスト

2009-01-04 15:27
Prototype

Prototype のテストまわりのライブラリが、12月頃 UnittestJS に置き換えられた。「置き換え」というか「既存のテストまわりに名前をつけて独立させた」というほうが正確。レポジトリも独立した

Prototype のテストを実行する

UnittestJS がどんなものかは Prototype のテストを実行してみるのがわかりやすい。

% git clone git://github.com/sstephenson/prototype.git
...
% cd prototype
% git submodule init
Submodule 'vendor/caja_builder' (git://github.com/tobie/unittest_js_caja_builder.git) registered for path 'vendor/caja_builder'
Submodule 'vendor/unittest_js' (git://github.com/tobie/unittest_js.git) registered for path 'vendor/unittest_js'
% git submodule update
Initialized empty Git repository in /Users/kzys/prototype/vendor/caja_builder/.git/
...
Submodule path 'vendor/caja_builder': checked out 'aeda517c2e82db92bc88d56ed68fa4ce05f487a9'
Initialized empty Git repository in /Users/kzys/prototype/vendor/unittest_js/.git/
...
Submodule path 'vendor/unittest_js': checked out 'd0d28f58f127796c9cf916bd4f1c95f90b9a3fdc'
% rake test
(in /Users/kzys/prototype)

Skipping Chrome, not supported on this OS.

Started tests in Firefox.
......................
Finished in 34.785718 seconds.
349 tests, 2238 assertions, 0 failures, 0 errors.

Skipping Internet Explorer, not supported on this OS.

Skipping Konqueror, not supported on this OS.

Started tests in Opera.
.....F..............F.
Finished in 15.284949 seconds.
  Failures: /tmp/dom_test.html, /tmp/selector_test.html
311 tests, 2005 assertions, 6 failures, 0 errors.

Started tests in Safari.
......................
Finished in 12.315652 seconds.
358 tests, 2299 assertions, 0 failures, 0 errors.

%

端末上はこんな感じだけど、実際に実行してみるとブラウザ (Mac だと Firefox, Opera, Safari) が順に起動して、localhost に Web サーバーが起動して、サーバーからテストが記述された HTML を読み込んで、テストの結果をサーバーに投げて、とかなりさわがしい。

そのさわがしいクロスブラウザでの JavaScript の実行が「rake test」だけでできるのは便利そうだ。

自分のコードをテストする

自分のコードのテストもこの上で実行したい、というわけで独立した UnittestJS を使ってみる。

Prototype の Rakefile をみながら、サーバーを起動する Ruby スクリプトを書く。これを a.rb とする。

require 'unittest_js'

runner = UnittestJS::WEBrickRunner::Runner.new(:test_dir => '.')
runner.add_test('a.html')
UnittestJS::Browser::SUPPORTED.each do |browser|
  runner.add_browser(browser.to_sym)
end
runner.run

a.html はこんなかんじ。成功するものをひとつ、失敗するものをひとつ書いておく。

<html>
<body>
  <div id="testlog"></div>
  <script src="assets/prototype.js" type="text/javascript"></script>
  <script src="assets/unittest.js" type="text/javascript"></script>
  <script type="text/javascript">
    new Test.Unit.Runner({
        testFoo: function(){
            this.assertEqual('foo', 'foo');
        },
        testBar: function(){
            this.assertEqual('bar', 'foo');
        }
    });
  </script>
</body>
</html>

実行してみる。

% git clone git://github.com/tobie/unittest_js.git
...
% cd unittest_js
% vi a.rb
...
% vi a.html
...
% ls
LICENSE         a.html          assets/         templates/
README          a.rb            lib/
% ruby -I lib a.rb

Skipping Chrome, not supported on this OS.

Started tests in Firefox.
F
Finished in 0.545872 seconds.
  Failures: /unittest_js/a.html
2 tests, 1 assertions, 1 failures, 0 errors.

Skipping Internet Explorer, not supported on this OS.

Skipping Konqueror, not supported on this OS.

Started tests in Opera.
F
Finished in 0.599746 seconds.
  Failures: /unittest_js/a.html
2 tests, 1 assertions, 1 failures, 0 errors.

Started tests in Safari.
F
Finished in 0.334798 seconds.
  Failures: /unittest_js/a.html
2 tests, 1 assertions, 1 failures, 0 errors.

%

2テスト x 3ブラウザが無事実行できた。

テストは Ruby に依存しません

ちなみに、Ruby とかを持ち出さず a.html をそのままブラウザで開いてもテストは実行される。この場合テスト結果が端末に出力されたりはしない。

Ruby から UnittestJS::WEBrickRunner::Runner を起動した場合、ブラウザ側では「http://localhost:4711/unittest_js/a.html?t=1231051048.106773&resultsURL=http://localhost:4711/results」のような URI が読み込まれる。unittest.js の Test.Unit.Runner は、この resultsURL が与えられた場合だけ、テスト結果をそこに投げている。

それ Selenium で

できるんでしょうか? 調べていないです。

Leave a Reply