文档章节

JsTestDriver与Sonar集成

nirvanawgw
 nirvanawgw
发布于 2013/01/18 17:42
字数 1548
阅读 667
收藏 4

JsTestDriver是一个JavaScript单元测试工具,易于与持续构建系统相集成并能够在多个浏览器上运行测试轻松实现TDD风格的开发。当在项目中配置好js-test-driver以后,如同junit测试java文件一般,js-test-driver可以直接通过直接运行js文件,来对js文件单元测试。项目地址: http://code.google.com/p/js-test-driver/

JsTestDriver运行原理图(好像是同事画的,在此表示感谢):


Sonar是一个开源平台,用于管理源代码的质量。我们可以把JsTestDriver的测试结果在Sonar上展示出来。项目地址:http://www.sonarsource.org/

  • JsTestDriver配置

1.代码布局

source folder,代码路径,通常情况下就是src。
test folder,测试代码路径,例如src-test,unittest。
configuration file,配置文件。JsTestDriver配置文件,默认文件名为jsTestDriver.conf。

2.JsTestDriver文件

依赖包:JsTestDriver.jar, coverage.jar

配置文件:jsTestDriver.conf

启动脚本:shell

3.JsTestDriver配置文件

配置文件是YAML格式,很容易看懂,路径部分支持通配符,与junit完全类似。

server: http://localhost:9876    # JsTestDriver的server地址

load:                            # 源代码路径
  - src/*.js
test:                            # 测试代码路径
  - unittest/*.js

plugin:                          # 这里配置了一个插件,统计测试覆盖率
 - name: "coverage"              # 插件名称
   jar: "lib/coverage.jar"       # 插件jar包路径
   module: "com.google.jstestdriver.coverage.CoverageModule“
如果需要生成HTML测试报告,需要安装Icov,Ubuntu用户:
sudo apt-get install lcov
其它平台用户可以自行编译,项目地址: http://ltp.sourceforge.net/coverage/lcov.php

更多细节可以参考官方文档:http://code.google.com/p/js-test-driver/wiki/ConfigurationFile

4.JsTestDriver Server配置

下载最新的JsTestDriver.jar,地址:http://code.google.com/p/js-test-driver/downloads/list

启动server,端口9876:

java -jar JsTestDriver-1.3.5.jar --port 9876
浏览器打开: http://127.0.0.1:9876/ ,我们在本地启动,也就是localhost。


会看到两行字:

Capture This Browser
Capture This Browser in strict mode

一般情况下点第一个"Capture This Browser”,这里浏览器就会执行单元测试的代码,记得不要随手关掉哦。如图:

Capture之后的浏览器界面如下:

一些建议,可以使用--browser来制定浏览器,这样就不用手工去Capture了:

java -jar JsTestDriver-1.3.5.jar --port 9876 --browser firefox,chromium-browser
结合nohup,节约桌面空间:
nohup java -jar JsTestDriver-1.3.5.jar --port 9876 --browser firefox,chromium-browser &

也可以查看帮助获取更多参数:

java -jar JsTestDriver-1.3.5.jar help
 --browser VAR             : The path to the browser executable
 --browserTimeout VAR      : The ms before a browser is declared dead.
 --captureAddress VAL      : The address to capture the browser.
 --captureConsole          : Capture the console (if possible) from the browser
 --config VAL              : Loads the configuration file
 --dryRunFor VAR           : Outputs the number of tests that are going to be
                             run as well as their names for a set of
                             expressions or all to see all the tests
 --help                    : Help
 --port N                  : The port on which to start the JsTestDriver server
 --preloadFiles            : Preload the js files
 --raiseOnFailure VAL      : Whether jstd will throw an exception when a test
                             failure.
 --requiredBrowsers VAR    : Browsers that all actions must be run on.
 --reset                   : Resets the runner
 --server VAL              : The server to which to send the command
 --serverHandlerPrefix VAL : Whether the handlers will be prefixed with jstd
 --sslPort N               : The SSL port on which to start the JsTestDriver
                             server
 --testOutput VAL          : A directory to which serialize the results of the
                             tests as XML
 --tests VAR               : Run the tests specified in the form testCase.testNa
                             me
 --verbose                 : Displays more information during a run

 --plugins VAL[,VAL]       : Comma separated list of paths to plugin jars.
 --config VAL              : Path to configuration file.
 --basePath VAL[,VAL]      : Override the base path(s) in the configuration file. Defaults to the parent directory of the configuration file.
 --runnerMode VAL          : The configuration of the logging and frequency that the runner reports actions: DEBUG, DEBUG_NO_TRACE, DEBUG_OBSERVE, PROFILE, QUIET (default), INFO

官方文档地址:http://code.google.com/p/js-test-driver/wiki/CommandLineFlags

5.运行JsTestDriver单元测试

在JsTestDriver server启动并且Capture浏览器之后,就可以执行测试了:

java -jar JsTestDriver-1.3.5.jar --config jsTestDriver.conf --tests all --testOutput ./testreport/
也可以用--server 指定server地址:
java -jar JsTestDriver-1.3.5.jar --config jsTestDriver.conf --server http://localhost:9876 --tests all --testOutput ./testreport/

如果安装了Icov的话,可以生成HTML测试报告:

genhtml ./testreport/jsTestDriver.conf-coverage.dat -o ./testreport/output


  • Sonar Runner配置

(这里比较乱,并没有特定根据JsTestDriver来写,其它语言的项目与此类似)

Sonar由3个部分组成:

Database:参数配置和代码质量分析结果。

Web Server:展示分析结果和更改配置。

Client:运行代码质量分析并将结果写至Database。

Web Server和Database配置稍稍麻烦,将在下一篇blog详细写出。在这里主要写Client如何配置运行。

1.下载Sonar Runner

有几种Client可供选择,对外界环境依赖最少的莫过于Sonar Runner

首先下载Sonar Runner。下载地址:http://docs.codehaus.org/display/SONAR/Installing+and+Configuring+Sonar+Runner

2.环境变量配置

解压到任何一个地址并配置环境变量$SONAR_RUNNER_HOME,将$SONAR_RUNNER_HOME/bin加入PATH。

3.检查Sonar Runner是否配置成功

sonar-runner -h
环境变量配置正确会有输出:

usage: sonar-runner [options]
 
Options:
 -h,--help             Display help information
 -X,--debug            Produce execution debug output
 -D,--define <arg>     Define property
可参考官方文档: http://docs.codehaus.org/display/SONAR/Installing+and+Configuring+Sonar+Runner

4. 配置Sonar Server Databse地址

#----- Default Sonar server
#sonar.host.url=http://localhost:9000
 
#----- PostgreSQL
#sonar.jdbc.url=jdbc:postgresql://localhost/sonar
#sonar.jdbc.driver=org.postgresql.Driver
 
#----- MySQL
#sonar.jdbc.url=jdbc:mysql://localhost:3306/sonar?useUnicode=true&amp;characterEncoding=utf8
#sonar.jdbc.driver=com.mysql.jdbc.Driver
 
#----- Oracle
#sonar.jdbc.url=jdbc:oracle:thin:@localhost/XE
#sonar.jdbc.driver=oracle.jdbc.driver.OracleDriver
 
#----- Global database settings
#sonar.jdbc.username=sonar
#sonar.jdbc.password=sonar
 
#----- Default directory layout
#sonar.sources=src/main/java
#sonar.tests=src/test/java
#sonar.binaries=target/classes

数据库密码、地址,都懂。

以上Sonar配置看起来很复杂,但只需要配置一次。 环境变量也可以不用配置,缺点就是每次跑的时候要从server下载很多jar包。
把配置OK的Sonar Runner check-in到代码库中让大家共享,一劳永逸。

5.Sonar Runner项目配置

需要配置sonar-project.properties

# required metadata
sonar.projectKey=my:project                  # 项目key
sonar.projectName=My project                 # 项目显示名称 
sonar.projectVersion=1.0                     # 项目版本
 
# optional description
#sonar.projectDescription=Fake description   # 没什么用
 
# path to source directories (required)
sonar.sources=srcDir1,srcDir2                # 源代码路径,用英文逗号隔开
 
# path to test source directories (optional)
sonar.tests=testDir1,testDir2                # 测试代码路径,用英文逗号隔开
 
# path to project binaries (optional), for example directory of Java bytecode
# sonar.binaries=binDir                      # 没什么用

# optional comma-separated list of paths to libraries. Only path to JAR file and path to directory of classes are supported.
# sonar.libraries=path/to/library/*.jar,path/to/classes/dir,path/to/specific/library/myLibrary.jar,parent/*/*.jar
 
# The value of the property must be the key of the language.
sonar.language=js                            # 项目语言,重要
 
# Additional parameters
#sonar.my.property=value                     # 附加参数,依需求而定

官方文档中有多模块,多语言项目配置的介绍。地址: http://docs.codehaus.org/display/SONAR/Analyzing+with+Sonar+Runner

6.分析项目

直接执行:

sonar-runner
等执行完毕之后就能在Sonar上看到分析结果了。

© 著作权归作者所有

nirvanawgw
粉丝 2
博文 5
码字总数 4605
作品 0
西安
程序员
私信 提问
《编写可维护的 JavaScript》读书笔记第19章:自动化测试

YUI Test Selenium 引擎 略。 2. Yeti 略。 3. PhantomJS 略。 4. JsTestDriver JsTestDriver 是由 Google 工程师开发的与 Selenium 和 Yeti 类似的命令行工具。JsTestDriver 基于已安装的浏...

张前程
2014/01/06
198
0
sonar可以分别统计前后端代码的覆盖率吗?

我们的maven项目中前后端并在了一起,使用Junit 测试后端代码的UT,用jstestdriver测试前端代码,通过sonar 来查看覆盖率,但是mvn test 命令会同时把前后端的测试一起跑出来,然后sonar统计...

M镇长
2015/10/29
1K
2
使用JsTestDriver实现JavaScript单元测试

使用JsTestDriver实现JavaScript单元测试 大漠穷秋 一点点必要的废话 JavaScript的发展大体上经历了下面几个比较大的阶段: 第一阶段:石器时代。 基本上没有任何框架和工具,而且各种浏览器...

老鸟的空间
2014/07/09
71
0
高效 JavaScript 单元测试(转自IBM dev)

自动化 JavaScript 代码跨浏览器测试 Hazem Saleh, 高级软件工程师, IBM 简介: 能在一个浏览器上运行的 JavaScript 并不一定能在其他浏览器上运行。如果没有对代码进行单元测试,那么在决定...

Sam_yi
2011/12/02
345
0
高效 JavaScript 单元测试

简介: 能在一个浏览器上运行的 JavaScript 并不一定能在其他浏览器上运行。如果没有对代码进行单元测试,那么在决定升级或支持新浏览器的时候,组织就需要花钱测试或重新测试 Web 应用程序。...

鉴客
2011/11/29
400
0

没有更多内容

加载失败,请刷新页面

加载更多

程序性能checklist

程序性能checklist

Moks角木
昨天
2
0
VUE 计算属性

本文转载于:专业的前端网站▶VUE 计算属性 1、示例代码 <!DOCTYPE html><html lang="zh"> <head> <meta charset="UTF-8" /> <title>vue示例</title> </hea......

前端老手
昨天
2
0
快速搭建LNMT平台和环境部署 Tomcat详解

Tomcat部署的基本概念 1. CATALINA_HOME与CATALINA_BASE分别指什么?     CATALINA_HOME指的是Tomcat的安装目录     bin:\\Tomcat一些脚本存放目录,比如启动脚本startup.bat/start...

网络小虾米
昨天
2
0
float浮动

float浮动 float浮动概念及原理: 文档流:文档流是文档中可显示对象在排列时所占用的位置。 加浮动的元素,会脱离文档流,会沿父容器靠左或靠右排列,如果之前已经有浮动的元素,会挨着浮动...

studywin
昨天
2
0
实战项目-学成在线(一)

之前看的黑马程序员实战项目之一,打算以博客的形式写出来,也让自己重新温习一下。 1、项目背景 略(就是当前这东西很火,我们重点在开发,这些就略过) 2、功能模块 门户,学习中心,教学管...

lianbang_W
昨天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部