jasmine
karma

CentOS7 karma ChromeHeadless jasmine

More than 1 year has passed since last update.

Centos7 karma ChromeHeadless jasmine

概要

JavaScriptのユニットテスト環境の構築

前提

下記の内容がすでに完了している
- Vagrant上にCentos7を用意
- nodeのインストール
- npmのインストール

packege.jsonの生成

対話形式でpackege.jsonを設定する。

内容はすべてEnterで進む(初期値のまま)

packege.jsonの生成
$ npm init

karmaのインストール

karmaのインストール
$ npm install --save-dev karma

karmaの設定ファイル生成

karmaの設定ファイル生成
$ node_modules/karma/bin/karma init

Which testing framework do you want to use ?
Press tab to list possible options. Enter to move to the next question.
> jasmine

Do you want to use Require.js ?
This will add Require.js adapter into files.
Press tab to list possible options. Enter to move to the next question.
> no

Do you want to capture a browser automatically ?
Press tab to list possible options. Enter empty string to move to the next question.
> Chrome
>

Which files do you want to test ?
You can use glob patterns, eg. "js/*.js" or "test/**/*Spec.js".
Enter empty string to move to the next question.
> js/*.js
> test/*Spec.js

Any files you want to exclude ?
You can use glob patterns, eg. "**/*.swp".
Enter empty string to move to the next question.
>

Do you want Testacular to watch all the files and run the tests on change ?
Press tab to list possible options.
> yes

生成したkarma.conf.jsの編集

今回はChromeHeadlessを使用するので
browsersの項目を変更

karma.conf.jsの編集
$ vi karma.conf.js

karma.conf.js
    ...

    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['ChromeHeadless'],

    ...
}

テストファイルと被テストファイル用のディレクトリを用意

ディレクトリ作成
$ mkdir js
$ mkdir test

chrome-launcherのインストール

chrome-launcherのインストール
$ npm install --save-dev karma-chrome-launcher

chromeのインストール

$ sudo yum install epel-release

  • chrome.repoの作成
chrome.repoの作成
$ sudo vi /etc/yum.repos.d/chrome.repo

  • 以下の内容でchrome.repoを作成する
[google-chrome]  
name=google-chrome
baseurl=http://dl.google.com/linux/chrome/rpm/stable/$basearch  
enabled=1  
gpgcheck=1  
gpgkey=https://dl-ssl.google.com/linux/linux_signing_key.pub
  • yumでインストール
yumでインストール
$ sudo yum info google-chrome-stable

mesa-libOSMesaのインストール

mesa-libOSMesaのインストール
$sudo yum install -y mesa-libOSMesa mesa-libOSMesa-devel

  • シンボリックリンクの設定
シンボリックリンクの設定
$ sudo ln -s /usr/lib64/libOSMesa.so.8.0.0 /opt/google/chrome/libosmesa.so

フォントもインストール

フォントもインストール
$sudo yum install liberation-mono-fonts liberation-narrow-fonts liberation-sans-fonts liberation-serif-fonts

jasmineのインストール

jasmineのインストール
$ npm install --save-dev jasmine karma-jasmine

テストの実行

プロジェクト構成
.
├── karma.conf.js
├── node_modules
├── package.json
├── test
│   └── sampleSpec.js
└── js
    └── sample.js
  • 被テストファイル
js/sample.js
function add(x, y) {
  return x + y;
}
  • テストファイル
test/sampleSpec.js
describe("加算", function() {
  it("1足す2が3であること", function() {
    expect(add(1, 2)).toBe(3);
  });
});

/* その他matcher
describe('Jasmine の使い方', function(){
  it('同一オブジェクトである', function(){
    var obj = {};
    var obj_ = obj;
    expect(obj_).toBe(obj);
    expect({}).not.toBe(obj);
  });

  it('値が等しい', function(){
    var obj = {};
    expect({}).toEqual(obj);
  });

  it('正規表現にマッチ', function(){
    expect('abc').toMatch('^[a-z]+$');
  });

  it('真偽値', function(){
    expect(true).toBeTruthy();
    expect(false).toBeFalsy();
  });

  it('値を含むかどうか', function(){
    expect([1,2,3]).toContain(1);
  });

  it('値の大小', function(){
    expect(1).toBeGreaterThan(0);
    expect(-1).toBeLessThan(0);
  });

  it('値が近い', function(){
    expect(0.001).toBeCloseTo(0);
  });

  it('例外を投げること', function(){
    var myfunc = function(){
      myUndefinedVar;
    };
    expect(myfunc).toThrow();
  });

  it('undefined であるかどうか', function(){
    expect(undefined).toBeUndefined();
  });

  it('null であるかどうか', function(){
    expect(null).toBeNull();
  });

  it('NaN であるかどうか', function(){
    expect(parseInt("str")).toBeNaN();
  });

});
*/

  • package.jsonにテストコマンドを記述
package.json
{
  
  "scripts": {
    "test": "node_modules/karma/bin/karma start"
  },
  
}
  • 実行
コンソール
$ npm test

  • 結果 テストが成功することを確認
WARN [karma]: No captured browser, open http://localhost:9876/  
INFO [karma]: Karma v1.7.0 server started at http://0.0.0.0:9876/  
INFO [launcher]: Launching browser ChromeHeadless with unlimited concurrency  
INFO [launcher]: Starting browser ChromeHeadless  
INFO [HeadlessChrome 0.0.0 (Linux 0.0.0)]: Connected on socket 77pv-qzaLu4efHnuAAAA with id 64642908  
HeadlessChrome 0.0.0 (Linux 0.0.0): Executed 1 of 1 SUCCESS (0.008 secs / 0.003 secs)