AngularJSのテスト。Karmaの設定まわり。

npmとかgruntとかあまり理解せず、いきなりYeomon(Yo+Grunt+Bower)を使い始めたのでテスト環境がどうなっているのかわかりません。

GruntはGruntfile.jsを読み込んで各モジュールを実行しています。grunt build とか grunt server:dist等で各モジュールを起動させてます。(JSの縮小化とかやってくれてすごい！)

concat : ファイル連結
uglify: jsの縮小化
cssmin: cssの縮小化
clean: 不要なファイルの削除
watch: ファイルの更新を監視して、タスク実行
jshint: 構文チェック

今回見ているのはKarmaです。Gruntfile.jsの中身を見るとどうやって起動しているかわかります。

# in Gruntfile.js
267     karma: {
268       unit: {
269         configFile: 'karma.conf.js',
270         singleRun: true
271       }
... 
313   grunt.registerTask('test', [
314     'clean:server',
315     'concurrent:test',
316     'autoprefixer',
317     'connect:test',
318     'karma'
319   ]);

これを見ると、karmaは下記のように起動することがわかります。

$ grunt karma:unit  # or 
$ grunt test # at the last of sequence of tests

で、karmaの設定はkarama.conf.jsに記述されています。具体的なフォーマットは公式HPのConfigセクションに書いてあります。yo angularで作られたfileで見ておくのは下記でしょうか。

frameworks : テストフレームワークの指定
files: テストするファイルの指定
autoWatch: 自動読み込みの設定
singleRun: trueのときはテスト後exit

gruntでautoWatchを使うためにkarma:autoをGruntfile.jsに追加しました。

    karma: {
        unit: {
        configFile: 'karma.conf.js',
        singleRun: true
        },
    auto: {
        configFile: 'karma.conf.js',
        singleRun: false,
        autoWatch: true
        }
    },

で、

$ grunt karma:auto # automatic load

でテストファイルの更新を見て自動ロードしてます。

これで後はjasmineのテストを書くだけですね！

Debuginfo

思考とアウトプット

AngularJSのテスト。Karmaの設定まわり。