AngularJS自动化测试之karma+jasmine单元测试

前端之家收集整理的这篇文章主要介绍了AngularJS自动化测试之karma+jasmine单元测试前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

单元测试专门用于测试小型、独立的代码单元,单个函数,或者较小的功能,其主要难点在于划分小的功能块。

本位主要介绍AngularJS的单元测试的环境搭建。

Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner)。该工具可用于测试所有主流Web浏览器,也可集成到CI(Continuous integration)工具,也可和其他代码编辑器一起使用。

Jasmine (茉莉)是一款 JavaScript BDD(行为驱动开发)测试框架,它不依赖于其他任何 JavaScript 组件。它有干净清晰的语法,让您可以很简单的写出测试代码。对基于 JavaScript 的开发来说,它是一款不错的测试框架选择。

环境搭建
  1. 安装NodeJSJavaScript运行环境)(https://nodejs.org/en/
  2. 安装npmJavaScript包管理工具)(npm is installed with Node.js)
  3. 安装karmaJavaScript测试运行器)(npm install-g karma)
  4. 安装jasmine(测试框架)(npminstall -gjasmine-core
  5. 代码覆盖率统计插件npminstall -gkarma-coverage

  • What is npm?

npmmakes it easy for JavaScript developers to share and reuse code,and makes iteasy to update the code that you're sharing,so you can build amazing things.

如何衡量测试脚本的质量呢?其中一个参考指标就是代码覆盖率(coverage)。
什么是代码覆盖率?简而言之就是测试中运行到的代码占所有代码的比率。

项目配置
You can use(npm init)in the root of your package in order to get you started with a pretty basic package.jsonfile.

项目文件结构


index.js

function  isNum(num) { 
	if (typeof num === 'number') {
	 	return true;
 	}
 	else {
	 return false;
 	}
 }

test.spec.js

describe('index.js: ',function() {
  it('isNum() should work fine.',function() {
    expect(isNum(1)).toBe(true)
    expect(isNum('1')).toBe(false)
  })
})

创建测试配置文件
karma init test/karma.conf.js



karma-coverage配置
修改配置文件karma.conf.js



启动单元测试
karma starttest/karma.conf.js

注:karma.conf.jsautowatch设置为true 时每次代码有变化时,自动运行 单元测试。

代码覆盖率(test/coverage/index.html)




Reporter that dynamically shows tests results at debug.html page.


安装:

npminstallkarma-jasmine-html-reporter-g

修改 karma.conf.js相应部分:

reporters:['progress','coverage','kjhtml']

启动测试:
karma starttest/karma.conf.js

启动测试:karmastart test/karma.conf.js



原文链接:https://www.f2er.com/angularjs/145267.html

猜你在找的Angularjs相关文章