mochaの基本的な使用方法です。まず、ターミナル、あるいはコマンドプロンプトを起動します。その後、
cd <mochaの実行ファイルのあるディレクトリ>
と入力し、ディレクトリを移動します。移動先のディレクトリで、
./mchd
と入力し、mochaを起動します。すると、
mocha es-next-compiler(stand-alone)
usage -> run 'help'
>>
このようなプロンプトが表示されます。この状態で、pcのuserディレクトリを見ると、.mochaというディレクトリができているはずです。このディレクトリの中身は以下のような構成になっています。
.mocha
|_config.js
|_mocha.log
config.jsの中を見てみましょう。デフォルトでは以下のようになっているはずです。
config.set('compileSettingPath', './watch.js')
config.set('logFilePath', './mocha.log')
watch.jsが実装する必要のあるファイルです。.mochaの中にwatch.jsファイルを作ります。watch.js内では監視するjsファイルを、mochaの設定に追加していきます。以下がサンプルです。
var script = mocha.import('script');
script.watcher.addSetting('/home/foo/src/test.js', {
deployDir : '/home/foo/src/deploy',
deployName : 'test-deploy.js',
outputCharset : 'utf8',
inputCharset : 'utf8',
options : {
compress : false,
prettyPrint : true,
debug : true,
versions : [],
moduleDir : ['lib'],
libs : ['jQuery']
fileScope : true,
globalScope : true
}
})
上記の記述で'/home/foo/src/test.js'が監視されます。test.jsを修正するたびに、'/home/foo/src/deploy/'フォルダに、'test-deploy.js'という名前でコンパイル済みファイルが保存されます。その後、mochaのコンソールで、
>> .restart()
と入力し、watch.jsを読み込ませます。これでtest.jsの監視が始まります。
以上が基本的なステップです。
mochaが初回起動時に生成する<user_home>/.mocha/config.jsの解説です。
<user_home>は
C:\Document and Setting\<ユーザー名>\
C:\Users\<ユーザー名>\
/Users/<ユーザー名>
/home/<ユーザー名>
になります。
config.js内ではグローバルスコープにconfigオブジェクトが定義されます。このconfigオブジェクトに設定を追加することで、mochaの設定を行います。
以下にmochaの生成するデフォルトのconfig.jsを提示します。
config.set('compileSettingPath', './compile_setting.js');
config.set('logFilePath', './mocha.log');
mochaはcompileSettingPathとlogFilePathプロパティを設定するファイルを生成します。以下がconfigオブジェクトに設定可能な値です。
名前 | 説明 |
---|---|
compileSettingPath | jsファイルのコンパイル設定が記述されたファイルの場所です。 |
logFilePath | ログファイルが格納される場所です。 |
phantomInstallDir | phantomjsがインストールされている場所です。 |
コンパイルの設定を記述するファイルです。configオブジェクトのcompileSettingPathによって場所が設定されます。このファイルは起動時に指定された場所から自動で読み込まれます。デフォルトではwatch.jsというファイル名になっています。
サンプル
//scriptモジュールをインポート
var watcher = mocha.import('script').watcher;
//設定の追加
//対象のファイルネーム
watcher.addSetting("src/test.js", {
//deployするディレクトリ
deployDir : 'src/deploy',
//deployする際のファイルネーム
deployName : 'test-deploy.js',
//ファイルのエンコーディング
inputCharset : 'utf-8',
//出力されるファイルのエンコーディング
outputCharset : 'utf-8',
//コンパイルオプション
options : {
//人間の読みやすい形にする
prettyPrint : true,
//圧縮しない
compress : false,
//デバッグモードでコンパイル
debug : true,
//各ファイル単位でスコープの生成
fileScope : true,
//グルーバルスコープの生成
globalScope : true,
//
versions : ['foo'],
//
libs : ['jQuery'],
//
moduleDir : ['lib']
}
})
基本的にはscriptモジュールのwatcherオブジェクトのaddSetting関数にファイル名、設定を追加していく形になります。以下が設定のフォーマットです。
プロパティ名 | データタイプ | 説明 |
---|---|---|
deployDir | String | コンパイル結果を出力する場所です。 |
deployName | String | コンパイル結果のファイル名です。 |
inputCharset | String | 元ファイルのエンコーディングです。 |
outputCharset | String | 出力ファイルのエンコーディングです。 |
options | Object | コンパイルのオプションを指定します。 |
optionsの中身です。
プロパティ名 | データタイプ | 説明 |
---|---|---|
prettyPrint | Boolean | 出力をフォーマットします。 |
compress | Boolean | 出力を圧縮します。 |
debug | Boolean | デバッグモードで実行します。 |
moduleDir | Array | モジュールをロードするディレクトリを設定します。 |
versions | Array | バージョンを指定します。 |
fileScope | Boolean | ファイル単位でスコープを生成するかどうか指定します。デフォルトではtrueです。 |
globalScope | Boolean | グローバルなスコープを生成するかどうか指定します。デフォルトではtrueです。 |
libs | Array | |
prototypeExtensions | Boolean |
mochaは設定ファイルの追加の際にコマンド設定の追加も可能です。コマンドは以下の方法で追加できます。
mocha.addCommand('foo', function () {
console.log('test');
}, 'test command!!');
mocha.addCommandは第一引数にコマンド名、第二引数にコールバック関数、第三引数に説明を記述します。追加したコマンドは端末上から呼び出す事が可能になります。
先ほどのfooコマンドを呼び出すには以下のようにします。
>> .foo()
組み込みコマンド
mochaは以下のコマンドをデフォルトで持っています。
名前 | インターフェース | 機能 |
---|---|---|
watch | watch() | 監視を再開します。 |
unwatch | unwatch() | 監視を停止します。 |
restart | restart() | 再度設定ファイルを読み込みます。 |
deploy | deploy([predicate], [option]) | 指定したファイルをコンパイルします。predicateには関数か、文字列、正規表現を指定します。 |
test | test([predicate], [option]) | 指定したファイルをテストします。predicateには関数か、文字列、正規表現を指定します。 |
settingList | settingList([showDeploy], [showOpt], [predicate]) | mochaの監視下にあるファイルの一覧を表示します。showDeployが指定されるとdeploy情報を、showOptが指定されるとコンパイルオプションをそれぞれ追加で表示します。predicateには関数か、文字列、正規表現を指定します。 |
help | help() | コマンド一覧を表示します。 |
exit | exit() | mochaを終了します。 |
mochaはES Nextの文法に加え以下の独自拡張を持っています。
名前 | インターフェース | 機能 |
---|---|---|
@assert | @assert(expect, expression) | アサーションの実行です。versionにdebugが定義されている時のみコード生成されます。 |
@version | @version(version){...} | バージョン分岐ブロックを生成します。 |
@source | @source <filename> | |
@include | @include <filename> | ファイルを読み込み、その場所に展開します。いっさいのコンパイルは行われません。 |
@, _@ | @foo, @_bar |
@assert
test(x,y) -> x + y;
@assert(true, test(1,1) === 2);
//このように展開される
Runtime.assert(true, test(1,1) === 2, 'test(1,1) === 2', 'filename', 'linenumber')
@version
var x = 0;
@version(debug) {
x = 1;
}
@version(release) {
x = 2;
}
//デバッグモードの時はx = 1
//リリースモードの時はx = 2
@source
@source 'jQuery-min.js'
$(->{
...
})
//
@include
@include 'jQuery.js'
$(->{
...
})
//@includeの部分にjQueryのコードがそのまま挿入される
@, @_
class Test {
constructor() {
@publicMember = 200;
@_privateMember = 200;
}
public getPublicMember() -> @publicMember;
public getPrivateMember() -> @_privateMember;
}
//変換後は以下のようになります。
@publicMember => this.publicMember
@_privateMember => private(this)._privateMember;
mochahはphantomjsgがインストールされていれば、直接起動が可能です。phantomjsはコマンドラインから使用できるwebkitでcssやhtmlもフルで使用可能です。
phantomjsnの指定方法
config.js内に
cofig.set('phantomInstallDir', '<phantomjsのインストール先>');
の記述を追加します。あとは組み込みコマンドの.test()を使うと起動できます。.test()実行時にはversionsの値にtestという値が追加されます。
テスト
mocha自体はテスト機能を持たないのですが、既存のテストフレームワークを利用できます。jasmine,JsUnitなど。