安装和使用因果报应-茉莉 一个JavaScript测试工具

1.1 .因果报应介绍

因果报应是《圣经》的新名字。2012年，谷歌开放了Testular，2013年Testular更名为Karma。因果报应是一个很神秘的名字，在佛教中是命运和因果报应的意思，比卡珊德拉更不可预测！

Karma是一个基于Node.js的JavaScript测试执行过程管理工具这个工具可以用来测试所有主流的Web浏览器，也可以集成到CI(Continuous integration)工具中，还可以和其他代码编辑器一起使用。这个测试工具的一个强大功能是它可以观察文件的变化，然后自己执行，并通过控制台显示测试结果

2.入门2。茉莉

Jasmine (Jasmine)是一个JavaScript BDD(行为驱动开发)测试框架，不依赖任何其他JavaScript组件。它有干净清晰的语法，所以你可以很容易地编写测试代码。对于基于JavaScript的开发来说，这是一个很好的测试框架。

受欢迎的是库奈特和茉莉。如果你想详细了解区别，请点击Qunit和Jasmine的对比，Javascript单元测试框架。

我们善意提醒大家注意以下几点：本文中karma的数据链接和插件安装可能需要翻$ wall才能正确实现。

步骤1:安装节点。JS(版本：v0.12.4，windows-64)。

Karma运行在Node.js上，所以我们需要先安装Node.js。去https://nodejs.org/download/下载你的系统需要的NodeJS版本。我下载了windows 64位的msi版本。

下载后，双击node-v0.12.4-x64.msi运行安装。我就不细说了。我只需要继续进行下一步。当然，最好是换个目录。

图1(选择安装内容，默认):

第二步：安装因果报应。

运行Node.js: Node.js命令提示符的命令行程序：

图2(在“开始-所有程序-节点. js”中):

图3(我们将在E:\Karma的路径下安装):

输入安装因果报应的命令：

复制代码如下： NPM安装karma-save-dev。

图4(4后(安装了Karma):

第三步：安装Karma-jasmine/Karma-chrome-启动器插件。

输入npm命令安装karma-jasmine和karma-chrome-launcher插件：

复制代码如下： NPM安装karma-jasmine karma-chrome-启动器-保存-开发。

图5(5后(安装了karma-jasmine和karma-chrome-launcher):

第四步：安装karma-cli。

Karma-cli用于简化Karma的称呼。安装命令如下，其中-g代表全局参数，以便将来可以非常方便地使用karma:

复制代码如下：npm install -g karma-cli。

图6(6之后(安装了karma-cli):

因果报应-茉莉被安装：

图7(安装后，E:\Karma文件夹下会有一个node_modules目录，里面包含了Karma，karma-jasmine，karma-chrome-launcher，当然还有jasmine-core的目录)；

打开因果报应：

输入命令：

复制代码如下：karma start。

图8(运行后出现一行INFO信息，如图，没有其他提示和动作，因为此时我们还没有配置karma的启动参数。后面会添加Karma.conf.js，这样Karma会自动启动浏览器并执行测试用例):

图9(手动打开Chrome，输入localhost:9876，如果看到这个页面，就证明已经安装成功):

因果茉莉配置：

执行命令init命令来配置：

因果报应初始化

图10(所有默认配置问题):

描述：

1.测试框架：我们当然选择茉莉。

2.添加Require.js插件？

3.选择浏览器：我们选择Chrome。

4.测试文件路径设置，文件可以匹配通配符，例如，*。js匹配指定目录下的所有JS文件(实践中发现这个路径是karma.conf.js文件的相对路径，具体见下面给出的实际测试配置和描述)。

5.在测试文件路径下，需要排除的文件

6.是否允许因果报应监测文件是的表示当测试路径下的文件变化时因果报应会自动测试

我在虚拟机上测试的例子：

图11(测试文件和NodeJS处于E盘根目录下，karma.conf.js处于文件夹NodeJS的根目录下):

以下是karma.conf.js的完整内容：

//因果报应配置//生成于Fri时间5月：(格林尼治时间中国标准时间)模块。exports=function(config){ config。set({//将用于解析所有模式（例如，文件，排除)的基本路径： './TestFiles '，//要使用的框架//可用的框架： https://npmjs.org/browse/keyword/karma-adapter框架： ['茉莉']，//要在浏览器文件中加载的文件/模式列表： [ '*。js' ]，//要排除的文件列表： [ ],//在将匹配的文件提供给浏览器之前对它们进行预处理//可用的预处理程序： https://npmjs.org/browse/keyword/karma-preprocessor预处理程序： { },//测试结果报告程序使用//可能的值："点"、"进度"//可用的报告程序： https://npmjs.org/browse/keyword/karma-reporter报告程序： ["进度"]，//网页服务器端口端口：//启用/禁用输出（报告程序和日志)颜色： true，//级别LOG_DISABLE ||配置LOG_ERROR ||配置LOG_WARN ||配置LOG_INFO ||配置日志_调试日志级别：配置LOG_INFO，//每当任何文件更改autoWatch: true，//启动这些浏览器//可用浏览器启动： https://npmjs.org/browse/keyword/karma-launcher浏览器： ['Chrome']，//连续集成模式//如果为真的，因果报应将捕获浏览器，运行测试并退出单次运行： false })；};说明：

若所有测试文件均处于同一个目录下，我们可以设置basePath(也是相对于karma.conf.js文件的相对路径),然后指定文件，此时文件则为基本路径目录下的文件相对路径；

当然你也可以不设置basePath，直接使用相对于karma.conf.js文件的文件相对路径，如本例中，我们若保持基本路径默认为空，则文件配置应为：

文件： ['./TestFiles/jasmineTest.js '，'./TestFiles/test.js' ] test.js内容：函数TT(){返回“ABC”；} jasmineTest.js内容：描述('一套基本函数、function () { it('test ')、function () { expect('abc ')).托凯尔(TT())；});});启动因果报应：

karma start karma.conf.js

由于这次加上了配置文件karma.conf.js，因此因果报应会按照配置文件中指定的参数执行操作了，由于我们配置的是在铬中测试，因此因果报应会自动启动铬实例，并运行测试用例：

图12(左侧的铬是因果报应自动启动的，右侧的Node.js命令提示符窗口中，最后一行显示了执行结果):

图13(如果我们点击图12中的调试按钮，进入debug.html并按F12打开开发者工具，选择安慰窗口，我们将能看到茉莉的执行日志):

若此时，我们将jasmineTest.js中对于调用电汇方法的期望值改为abcd '(实际为ABC’):

描述('一套基本函数、function () { it('test ')、function () { expect('abcd ').托凯尔(TT())；});});由于我们在karma.conf.js中设置了自动观察为真：

自动观察：真

因果报应将自动执行测试用例，由于本例测试用例未通过，因此在屏幕上打印出了错误信息铬合金的安慰窗口中的日志信息需要刷新debug.html后显示。

图14(因果报应自动检测到文件变化并自动重新执行了测试用例):

代码覆盖率：

如果你还想查看测试的代码覆盖率，我们可以安装因果报应报道插件，安装命令为：

复制代码代码如下：npm安装因果报应-覆盖范围

图15(安装因果报应报道的过程):

修改karma.conf.js，增加覆盖率的配置：

图16(主要是变动了以下三个配置节点，其他的配置内容不变):

//在将匹配文件提供给浏览器之前对它们进行预处理//可用的预处理程序： https://npmjs.org/browse/keyword/karma-preprocessor预处理程序： { './TestFiles/test。js ' : ' coverage ' }，//测试结果报告器使用//可能值： '点'，'进度'//可用报告器： https://npmjs.org/browse/keyword/karma-reporter报告器： ['进度'，'覆盖率']，覆盖率porter : { type : ' html '，dir: './TestFiles/coverage/' }，变动如下：

在记者中增加覆盖率预处理程序中指定射流研究…文件

添加覆盖率波特节点，将覆盖率报告类型类型设置为html，输入目录目录指定到你希望的目录中

此时完整的karma.conf.js如下：

//因果报应配置//生成于2015年5月29日Fri时间19:30:26格林尼治时间0800(中国标准时间)模块。exports=function(config){ config。set({//将用于解析所有模式（例如，文件，排除)的基本路径： ' ',//要使用的框架//可用的框架： https://npmjs.org/browse/keyword/karma-adapter框架： ['茉莉']，//要在浏览器文件中加载的文件/模式列表： ['./TestFiles/jasmineTest.js '，'./TestFiles/test.js' ]，//要排除的文件列表： [ ],//在将匹配的文件提供给浏览器之前对它们进行预处理//可用的预处理程序： https://npmjs.org/browse/keyword/karma-preprocessor预处理程序： { './TestFiles/test。js ' : ' coverage ' }，//测试结果报告器使用//可能值： '点'，'进度'//可用报告器： https://npmjs.org/browse/keyword/karma-reporter报告器： ['进度'，'覆盖率']，覆盖率porter : { type : ' html '，dir: './TestFiles/coverage/' }，//web服务器端口端口： 9876,//启用/禁用输出（报告程序和日志)颜色： true，//日志记录级别//可能值：配置.LOG_DISABLE ||配置LOG_ERROR ||配置LOG_WARN ||配置LOG_INFO ||配置日志_调试日志级别：配置LOG_INFO，//每当任何文件更改autoWatch: true，//启动这些浏览器//可用浏览器启动： https://npmjs.org/browse/keyword/karma-launcher浏览器： ['Chrome']，//连续集成模式//如果为真的，因果报应将捕获浏览器，运行测试并退出单次运行： false })；};执行命令：

复制代码代码如下：karma start karma.conf.js

图17(执行命令后，在配置文件覆盖率波特节点中指定的目录中，我们将找到生成的覆盖率报告因果报应报道还生成了一层子文件夹，对应于执行测试的浏览器版本号操作系统版本):