JSTAPdのチュートリアル見ながらJavaScriptのテストをしてみるよ

JavaScript perl JSTAPd

最近JSTAPdに関するつぶやきを見て
「そうだ！触ろうと思ってインストールしたまま触ってないや！」
と思ったので実際に触ってみた流れとハマった所のメモ。



基本的には

perldocjp JSTAPd::Tutorial::JA

とかやってチュートリアルを見ればいい。
日本語だし簡単ですね！ブラウザで見てもいいと思うよ！
この記事の内容もチュートリアルまんまだよ！


テスト用のディレクトリを作成する

 jstapd -n ＜適当なディレクトリ名＞

でテスト用ひな形ディレクトリが作成できる


cd ＜作成したディレクトリ名＞

で中に入って、

jstapd -d .

で現在のディレクトリ内にあるテストを実行できる。
既にサンプルのテストファイルが用意されているので、ブラウザが立ち上がり
http://127.0.0.1:1978/____jstapd/
が表示されると思います。
なので、make testボタンを押せばOK。
（これは試しで使っただけで、実際のテストの時はproveでやっちゃう気がします）


実際にJavaScriptのライブラリを作ってテストしてみる

（さっきのページは閉じてしまって、ここからはテストを書きながら実際にライブラリの作成。）



まず、ライブラリをファイルとして作成したいのでそのための下準備をする。
ここで、簡単に話をすすめるために、

  • 作成するライブラリファイル：my-library.js
  • my-library.jsを作成するディレクトリ：＜今居る場所＞/jslib

としましょう。



ブラウザからmy-library.jsへアクセスできるようにconf.plにマッピング処理を追記する。
まず、$config内のapiurlにjslibを追加。

    apiurl        => qr{^/(?!____jstapd(?:__api)|jslib/)},

次に、urlmapに実際に存在するディレクトリへのマッピングを書く。

$config->{urlmap} = [
    { qr!^/jslib/! => 'jslib/' },
];

（conf.plが置いてあるディレクトリが基準になるのでjslib/と書いてます）
基本的にはコメントアウトしてあるものを少しいじるだけなので簡単ですね！



あと、今回はsafariで確認したかったので、

$config->{auto_open_command} = 'open -g -a Safari %s';

のコメントアウトも外しました。
（-gを付けるとバックグラウンドでブラウザが起動してくれてフォーカスが当たらないので嬉しい）


さて、conf.plに書いたマッピング処理に合うようにディレクトリを作成してmy-library.jsを作る準備。

mkdir jslib


01_base.tに、そのjsファイルをincludeするための記述をする。

sub include {
    qw(
          /jslib/my-library.js
    );
}

また、一つだけテストをしたいのでテストの数を1とします。

sub tests { 1 }

あとは01_base.jsにテストを記述していきます。

ok(MyLibrary(), 'ok MyLibrary');

（01_base.tにsub client_scriptを定義して、そっちに書いていっても良い）



この状態で試しに

prove -v 01_base.t

と実行してみると、ブラウザがローディング状態のままになりますね。
これはMyLibraryがなくてエラーになっちゃってるからです。
Ctrl-Cして抜けてMyLibraryを作りましょう。



（とりあえずテストだけ試したいのでcatでファイル作成しちゃいます）

% cat > jslib/my-library.js
var MyLibrary = function() { return true };
# ctrl-Dで抜ける

これでtrueを返してくれるMyLibraryができました。



最後にもう一度proveで実行すると、さっきと違いサッとブラウザが出てきてサッと消えて気持ちよくなれます。

% prove -v 01_base.t
01_base.t .. 
1..1
ok 1 - ok MyLibrary
ok
All tests successful.
Files=1, Tests=1,  0 wallclock secs ( 0.03 usr  0.01 sys +  0.36 cusr  0.08 csys =  0.48 CPU)
Result: PASS

ハマった所。

最後に書いた通り、

prove -v 01_base.t

とかやるとサッとブラウザが出てきてサッと消えて、しかもsuccessfulとかなって超気持ちいのだけど、
JavaScriptにundefinedになったりエラーになる場所があるとブラウザがローディング状態になったままになるので、
読み込み中なのかエラーなのかわからなくてちょっとハマった。
（まぁ普通に考えてエラーです。SyntaxErrorが起こってないか確認しましょう。）



あとは、テストの所にも書いたけど.tファイルに

sub tests { 2 }

とか書いているのに、1個しかテストが書いてなかったりすると頑張って2個テストしようとローディング状態になるのでそこも気をつけましょう。


まとめ

チュートリアル通りできて簡単だね！
書き方わからなくなったらチュートリアルに書いてある通りサンプルを見たらいいよ！

cpanm --look JSTAPd
cd eg/simple
jstapd -d .

とかで確認できるよ！