Help us understand the problem. What is going on with this article?

karma、jasmine、PhantomJSでDISCONNECTDが頻発する問題の対処

More than 5 years have passed since last update.

jenkinsからangularJSのテストをするためにヘッドレスブラウザであるPhantomJSを利用してテスト環境を作成したところ、karma実行時にPhantomJSにつながらないことが頻発しました。
ローカルのmacでは問題ないものの、CUI環境上で実行すると問題が発生するという状況。

同じようなエラーも見つけたのですが、どれも解決には至りませんでした。
https://github.com/karma-runner/karma/issues/598

試行錯誤で解決したのでその内容を書いておきます。

エラー内容

エラーは以下の様な感じ。
もちろんbrowserNoActivityTimeoutを10000msから長くしても同じでした。

$ node_modules/karma/bin/karma start test/karma.conf.js
INFO [karma]: Karma v0.12.25 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9.8 (Linux)]: Connected on socket EiJL2QiyEcBk_CO-O07G with id 42119278
WARN [PhantomJS 1.9.8 (Linux)]: Disconnected (1 times), because no message in 10000 ms.

成功するときもあってそのときは以下の感じになります。

$ node_modules/karma/bin/karma start test/karma.conf.js
INFO [karma]: Karma v0.12.25 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9.8 (Linux)]: Connected on socket BpBiH9n1-Wqb12M2PB5V with id 20828307
PhantomJS 1.9.8 (Linux): Executed 1 of 1 SUCCESS (0.036 secs / 0.003 secs)

エラーの再現方法

angularのチュートリアル (https://docs.angularjs.org/tutorial) を利用して以下の様な感じで再現させることができます。

$ git clone --depth=14 https://github.com/angular/angular-phonecat.git
$ cd angular-phonecat/
$ git checkout -f step-0

karma.conf.jsを書き換えます。

test/karma.conf.js
module.exports = function(config){
  config.set({

    basePath : '../',

    files : [
      'http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.js',
      'http://cdnjs.cloudflare.com/ajax/libs/velocity/0.7.0/jquery.velocity.js',
      'http://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js',
      'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.js',
      'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-route.js',
      'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-mocks.js',
      'http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.compat.js',
      'app/js/**/*.js',
      'test/unit/**/*.js'
    ],

    autoWatch : true,

    frameworks: ['jasmine'],

    browsers : ['PhantomJS'],

    plugins : [
            'karma-phantomjs-launcher',
            'karma-jasmine'
            ],

    junitReporter : {
      outputFile: 'test_out/unit.xml',
      suite: 'unit'
    },

    singleRun : true,
    colors : false

  });
};

必要なnpmとかは適宜インストールしてください。

エラーの原因と対処法

どうやらfilesの中にCDNのURLが多くあったのが原因みたいでした。
数が少ないと大丈夫なことが多いのですが、多くなるとコケることが出てきます。
コケた場合はリトライはしないみたいで、どれだけタイムアウトの時間を長くしてもタイムアウトする模様。
対処法としては全部wgetでダウンロードして、ローカルに保存しました。

$ mkdir app/lib/
$ cd app/lib/
$ wget 'http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.js'
$ wget 'http://cdnjs.cloudflare.com/ajax/libs/velocity/0.7.0/jquery.velocity.js'
$ wget 'http://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js'
$ wget 'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.js'
$ wget 'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-route.js'
$ wget 'http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-mocks.js'
$ wget 'http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.compat.js'

karma.conf.jsを書き換えます。

test/karma.conf.js
module.exports = function(config){
  config.set({

    basePath : '../',

    files : [
      'app/lib/jquery.js',
      'app/lib/jquery.velocity.js',
      'app/lib/jquery.cookie.js',
      'app/lib/angular.js',
      'app/lib/angular-route.js',
      'app/lib/angular-mocks.js',
      'app/lib/lodash.compat.js',
      'app/js/**/*.js',
      'test/unit/**/*.js'
    ],

    autoWatch : true,

    frameworks: ['jasmine'],

    browsers : ['PhantomJS'],

    plugins : [
            'karma-phantomjs-launcher',
            'karma-jasmine'
            ],

    junitReporter : {
      outputFile: 'test_out/unit.xml',
      suite: 'unit'
    },

    singleRun : true,
    colors : false

  });
};

この対処法で今のところエラーは出なくなりました。

toshikimiyagawa
テニス/麻雀/料理
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away