利用Karma、Jasmine 做前端单元测试

<一> 使用技术

  • karma

  • jasmine

  • karma-coverage


<二> 安装插件

1.nodejs

2.安装karma

  • npm install -g karma 

  • npm install -g karma-cli 

3.安装jasmine

  • npm install -g jasmine

4.安装karma-coverage

  • npm install -g karma-coverage


<三>跑起一个程序

1.项目的目录结构:

     利用Karma、Jasmine 做前端单元测试_第1张图片

2.add.js 文件

function add (a, b) {
    return a + b;
}

3.add-test.js

describe("my great and huge math lib", function () {
  it("should perfectly complete complex addition", function () {
    var result = add(3, 5);
    expect(result).toEqual(8);
  });
});

4.conf 文件

可以这样,在karma-my-proj 目录下

karma init pro-conf.js

5.启动程序

karma start pro-conf.js

根据提示,选择js目录、chrome、jasmine等

6.也可以编辑conf.js 如下:

<1>.files

 // list of files / patterns to load in the browser
    files: [
      'js/**/*.js',
      'test/**/*.js'
    ],

<2>.coverage

// test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress','coverage'],
    preprocessors : {'js/**/*.js': 'coverage'},
    coverageReporter: {
        type : 'html',
        dir : 'coverage/'
    },


<四> 运行结果:

1.终端:

利用Karma、Jasmine 做前端单元测试_第2张图片

2.浏览器

3.覆盖报告:

利用Karma、Jasmine 做前端单元测试_第3张图片


你可能感兴趣的:(利用Karma、Jasmine 做前端单元测试)