FED实验室 - 专注WEB端开发和用户体验

Karma+Jasmine实现自动化测试

AUTOMATION 煦涵 21728℃ 0评论

一、Karma和Jasmine介绍

1.Karma介绍
Karma是Testacular的新名字,在2012年google开源了Testacular,2013年Testacular改名为Karma。Karma是一个让人感到非常神秘的名字,表示佛教中的缘分,因果报应,比Cassandra这种名字更让人猜不透!

Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner)。该工具可用于测试所有主流Web浏览器,也可集成到CI(Continuous integration)工具,也可和其他代码编辑器一起使用。这个测试工具的一个强大特性就是,它可以监控(Watch)文件的变化,然后自行执行,通过console.log显示测试结果。

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

比较流行的有Qunit和Jasmine,如果你想更详细了解二者的区别,请狠狠的点击Javascript单元测试框架Qunit和Jasmine的比较

二、基本实现

1.环境安装

root@ubuntu:/var/www/yeomanProj# npm install -g karma

2.配置karma.config.js

root@ubuntu:/var/www/yeomanProj# 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 plugin.
Press tab to list possible options. Enter to move to the next question.
> no

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

What is the location of your source and test files ?
You can use glob patterns, eg. "js/*.js" or "test/**/*Spec.js".
Enter empty string to move to the next question.
> 

Should any of the files included by the previous patterns be excluded ?
You can use glob patterns, eg. "**/*.swp".
Enter empty string to move to the next question.
> 

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

Config file generated at "/var/www/yeomanProj/karma.conf.js".

3.安装集成包

root@ubuntu:/var/www/yeomanProj# npm install karma-jasmine

 

4.新建测试文件isInteger.js

root@ubuntu:/var/www/yeomanProj# vi isInteger.js 

/**
 * isInteger
 * @param {Number}
 * @return {Boolean}
 */

function isInteger(num) {
	if(typeof num !=="number") return false;
	var pattern = /^[1-9]\d*$/g;
	return pattern.test(num);
}

5.新建测试用例integerTest.js

root@ubuntu:/var/www/yeomanProj# vi isIntegerTest.js 

describe("This is a integer test!", function(){
	it("Is integer", function() {
		expect(true).toEqual(isInteger(20));
		expect(false).toEqual(isInteger("20"));
		expect(false).toEqual(isInteger(0));
	})
});

6.修改配置文件karma.config.js

root@ubuntu:/var/www/yeomanProj# vi karma.conf.js 

// Karma configuration
// Generated on Tue Jul 15 2014 08:34:25 GMT-0700 (PDT)

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

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',

    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],

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

    // list of files to exclude
    exclude: ["karma.config.js"],

    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },

    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],

    // web server port
    port: 9876,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,

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

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false
  });
};

7.运行测试

root@ubuntu:/var/www/yeomanProj# karma start karma.conf.js 
INFO [karma]: Karma v0.12.17 server started at http://localhost:9876/
INFO [launcher]: Starting browser Chrome
INFO [Chrome 31.0.1650 (Linux)]: Connected on socket SBOihLxtQbirXMCTxFB_ with id 5395451

8.查看测试结果及自动化

Chrome 31.0.1650 (Linux): Executed 1 of 1 SUCCESS (0.938 secs / 0.213 secs)
INFO [watcher]: Changed file "/var/www/yeomanProj/isIntegerTest.js".
Chrome 31.0.1650 (Linux): Executed 1 of 1 SUCCESS (3.503 secs / 0.494 secs)

上述测试环境中有文件增加或者改变都会随时监控并自动化测试。
karma-jasmine

三、参考链接

http://jasmine.github.io/1.3/introduction.html

下面是「FED实验室」的微信公众号二维码,欢迎扫描关注:

FED实验室

行文不易,如有帮助,欢迎打赏!

赞赏支持or喜欢 (12)or分享 (0)
捐赠共勉
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(4)个小伙伴在吐槽
  1. 你好,为什么我执行 karma start karma.conf.js 总是提示没有安装jasmine-core,我安装完后还是不行啊,还是提示有错误啊?
    明前行2017-05-21 09:03 回复
    • 先卸载然后重装试试呢
      Benjamin2017-05-21 10:41 回复
  2. 为什么isIntegerTest.js这个文件在哪执行?karma.conf.js里面也没写
    heekei2017-02-16 10:01 回复