PHPプロジェクトのTravis CIにeslintとkarmaのタスクを追加した時のメモ

最終的な.travis.ymlはこのようになりました。
https://github.com/ryota-murakami/daily-tweet/blob/a7f40a21a11bc023ca028c626d8f8d7dd5875d33/.travis.yml

1. `.travis.yml`にnodejsを追加、npmパッケージインストール

Travis CIのlanguageをnodejsに設定している場合はこのような記述でバージョンを指定できます。

language: node_js
node_js:
  - "6"
  - "6.1"
  - "5.11"
  - "0.6"
  - "iojs"

しかし以下のようにPHPプロジェクトとして登録している場合は記法を変える必要があります。

language: php

php:
    - 7.0

# ここ
before_script:
    - nvm install 6
    - nvm use 6
    - npm install

参考: PHP プロジェクトの Travis CI で Yarn を使う - Qiita

余談

.travis.ymlへ以下のように2つ言語を指定する事は出来ないようです。

language: [php, node_js]

travis lintコマンドで.travis.ymlのバリデーション

ryota.murakami@murakami ~/r/daily-tweet> travis lint
Warnings for .travis.yml:
[x] in language section: does not support multiple values, dropping nodejs

script:
    - npm run lint

2. eslintタスクの追加

eslintの設定は割愛するとして、開発環境と同じコマンドをscriptに追加するだけでOKでした。

script:
    - npm run lint

npm scriptに定義したタスクは自動的にnode_modulesへパスが通るのでnode_modules/.bin/eslintと書く必要はありません。

参考: npm で依存もタスクも一元化する - Qiita

3. karmaタスクの追加

ローカルではnpm scriptに"test": "karma start"と定義して実施していますがCIで行う場合は–single-runオプションが必要です。

script:
    - node_modules/karma/bin/karma start karma.conf.js --single-run

更にCIコンテナにGUIは無いのでXvfbを使いchromeを設定します。

before_install:
    - export CHROME_BIN=chromium-browser
    - export DISPLAY=:99.0
    - sh -e /etc/init.d/xvfb start

最後にkarma.conf.jsにTravisCIで実行した時のchrome設定を追加

module.exports = function (config) {
    config.set({
       // ...

        customLaunchers: {
            Chrome_travis_ci: {
                base: 'Chrome',
                flags: ['--no-sandbox']
            }
        }
    })
    if(process.env.TRAVIS){
        config.browsers = ['Chrome_travis_ci']
    }
}