CircleCIでkarmaのカバレッジを出力する

RailsをAPIサーバにしてクライアントコードをRailsとは完全に切り離してAngularJSで構築しているプロジェクトにおいてテストを自動化するためにCircleCIを使っています。

そこで、カバレッジを出力するのにrspecの場合は下記を参照して簡単にできるのですが、クライアントコードのカバレッジの出力に若干工夫が必要だったので、ここで簡単にやり方をご紹介します。

上記のURLだと"../../../"でカバレッジのHTMLの出力先を指定しており、これだとややっこしいのでディレクトリをデフォルトの出力先ディレクトリを変更しました。

また、上記のrspecの場合は、spec_helper.rbでCircleCI環境時に出力先を指定しているのですが、karmaでは開発時に使用しているgruntのtestとは別にCircleCI用にtest:ciというタスクを用意して、CircleCI用の設定ファイルを別途作成するようにしました。

circleci.yml

test:
  post:
    - cd client && grunt test:ci

general:
  artifacts:
    - "~/coverage"

もとのタスクにtest:ciを登録しました。

client/Gruntfile.coffee

grunt.registerTask "test", (target) ->
  if target is "ci"
    grunt.task.run([
      "clean:server"
      "concurrent:test"
      "autoprefixer"
      "connect:test"
      "karma:ci"
      "protractor"
    ])
  else
    grunt.task.run([
      "clean:server"
      "concurrent:test"
      "autoprefixer"
      "connect:test"
      "karma"
      "protractor"
    ])

さらにkarmaの設定ファイルを下記の通り指定します。

client/Gruntfile.coffee

karma:
  unit:
    configFile: "test/karma.conf.coffee"
    singleRun: true
  ci:
    configFile: "test/karma_ci.conf.coffee"
    singleRun: true

karmaの設定ファイルでCircleCIでテスト実行時にカバレッジが出力されるディレクトリを指定します。

client/test/karma_ci.conf.coffee

coverageReporter: 
  type: "html"
  dir: process.env['CIRCLE_ARTIFACTS'] + "/coverage"
 
reporters: ['spec','coverage']

以上です。