拥抱JsUnit

最新推荐文章于 2024-04-10 10:31:16 发布
最新推荐文章于 2024-04-10 10:31:16 发布
阅读量175 收藏 1
点赞数
分类专栏： javascript 文章标签： junit Ant HTML 浏览器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/iteye_194/article/details/81643277
版权
拥抱JsUnit
以往在测试js的时候，都是以alert方式来检测错误，很不专业，今天发现竟然有jsunit这个测试工具，感觉非常不错。
废话不说了，是骡子是马拉出来溜溜再说。

1 简单入门实例
首先我们定义我们的函数
这里以最简单的加减乘除四个方法来进行测试
建立我们的js文件myjs.js 

function add(num1,num2){
	return num1 + num2;
}

function minus(num1,num2){
	return num1 - num2;
}

function multiply(num1,num2){
	return num1 * num2;
}

function divide(num1,num2){
	return num1 / num2;
}

建立我们的测试用例，mytest1.html
我们将建立四个测试方法，jsUnit的测试方法必须以test开头。
下面我们对myjs.js中的加减乘除四个函数进行测试,
下面是jsUnit给我们提供的断言方式 [comment] 是可选的 表示断言出错的时候给出的提示
assert([comment], booleanValue)
assertTrue([comment], booleanValue)
assertFalse([comment], booleanValue)
assertEquals([comment], value1, value2)
assertNotEquals([comment], value1, value2)
assertNull([comment], value)
assertNotNull([comment], value)
assertUndefined([comment], value)
assertNotUndefined([comment], value)
assertNaN([comment], value)
assertNotNaN([comment], value)
fail(comment) 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>testHtml</TITLE>
 </HEAD>
<script type="text/javascript" src="myjs.js"></script>
<script type="text/javascript" src="jsunit\app\jsUnitCore.js"></script>
<script type="text/javascript">
<!--
function testAdd(){
	var result = add(4,2)
	assertEquals(6,result);
}

function testMinus(){
	var result = minus(4,2)
	assertEquals(2,result);
}

function testMultiply(){
	var result = multiply(4,2)
	assertEquals(8,result);
}

function testDivide(){
	var result = divide(4,2)
	assertEquals("4 divide 2 is 2",2,result);
}

//-->
</SCRIPT>
 <BODY>

 </BODY>
</HTML>

我们通过jsunit给我们提供的测试运行器testRunner.html来进行测试

2 setUp()与tearDown()
JsUnit也支持setUp()和tearDown()。JsUnit与JUnit有一点是一样的，即setUp()和tearDown()是可选的，而且setUp()会在每个测试之前调用，tearDown()会在每个测试之后调用。
我们可以在测试页面中加入setUp()和tearDown()的方法。 

function setUp(){
	alert("setUp");
}

function tearDown(){
	alert("tearDown");
}

JUnit与JsUnit中setUp()和tearDown()方法的重要区别：
在JUnit中，每次测试运行会导致创建Test类的一个新实例，这说明，声明的所有实例变量在下一次测试运行时会“重置”。
JsUnit有所不同，它不会为每次测试运行重新加载测试页，所以变量状态会在多次测试之间保留。
还有一个重要区别与测试顺序有关，使用JUnit的话，测试执行的顺序是不能保证的。在JsUnit中，测试会按测试页中声明的顺序执行，先从最上面的测试开始。
虽然区别如此，但我们应该了解每个测试用例都是应该相互独立的，不能真的顺序来调整我们的用例

下面是一个具体例子。
这里我们将函数和测试用例都写在一起了，在实际测试中应该避免 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE></TITLE>
  <script type="text/javascript" src="jsunit\app\jsUnitCore.js"></script>
 </HEAD>

 <BODY>
    <script language="JavaScript">
		//原函数
		function addTwoNumbers(value1, value2) {
				return parseInt(value1) + parseInt(value2);
		}
		function addNumbers() {
            var val1 = document.getElementById("value1").value;
            var val2 = document.getElementById("value2").value;
            return addTwoNumbers(val1, val2);
        }
		//初始化测试数据
        function setUp() {
            document.getElementById("value1").value = "2";
            document.getElementById("value2").value = "2";
        }
		//测试方法
        function testValidArgs() {
            assertEquals("2 + 2 should equal 4", 4, addNumbers());
        }

		//清空测试数据
        function tearDown() {
            document.getElementById("value1").value = "";
            document.getElementById("value2").value = "";
        }
    </script>
    <form id="test">
        <input type="text" size="3" id="value1"/>
        <input type="text" size="3" id="value2"/>
        <input type="button" value="Add" onclick="addNumbers()"/>
    </form>
  </body>
</html>
 </BODY>
</HTML>


3 setUpPage()函数
setUpPage()函数只对每个测试页调用一次，即在所有测试函数调用之前调用。现在，你可能已经发现，这里很适合完成预处理，特别是在运行测试之前如果需要向页面加载一些数据，setUpPage()函数就非常有用。不同于setUp()和tearDown()函数的是，使用setUpPage()不只是把处理放在这个函数中就行了的。如果确实选择使用这个特性，一定要保证函数完成时要把setUpPageStatus变量设置为complete，这就告诉JsUnit可以继续，接下来可以执行测试页上的测试了。
我们更改第一个实例来看看结果 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>testHtml</TITLE>
 </HEAD>
<script type="text/javascript" src="myjs.js"></script>
<script type="text/javascript" src="jsunit\app\jsUnitCore.js"></script>
<script type="text/javascript">
<!--
function testAdd(){
	var result = add(arg1,arg2)
	assertEquals(6,result);
}

function testMinus(){
	var result = minus(arg1,arg2)
	assertEquals(2,result);
}

function testMultiply(){
	var result = multiply(arg1,arg2)
	assertEquals(8,result);
}

function testDivide(){
	var result = divide(arg1,arg2)
	assertEquals("4 divide 2 is 2",2,result);
}

function setUpPage(){
	arg1 = 4;
	arg2 = 2;
	setUpPageStatus = "complete";
}

//-->
</SCRIPT>
 <BODY>
 </BODY>
</HTML>


4 exposeTestFunctionNames()函数显示的声明我们的测试方法
JsUnit会自动发现测试函数，就像JUnit会发现所有测试方法一样。
有些操作系统/浏览器不能合作。如果你发现不能如你所愿地发现测试函数，使用exposeTestFunctionNames()方法就能解决这个问题。
在测试页面里定义exposeTestFunctionNames方法，jsunit运行器在执行时会寻找exposeTestFunctionNames方法，只执行在此方法内指定的方法；
我们还是已第一个例子为例
可以变为 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>testHtml</TITLE>
 </HEAD>
<script type="text/javascript" src="myjs.js"></script>
<script type="text/javascript" src="jsunit\app\jsUnitCore.js"></script>
<script type="text/javascript">
<!--
function testAdd(){
	var result = add(arg1,arg2)
	assertEquals(6,result);
}

function testMinus(){
	var result = minus(arg1,arg2)
	assertEquals(2,result);
}

function testMultiply(){
	var result = multiply(arg1,arg2)
	assertEquals(8,result);
}

function testDivide(){
	var result = divide(arg1,arg2)
	assertEquals("4 divide 2 is 2",2,result);
}

function setUpPage(){
	arg1 = 4;
	arg2 = 2;
	setUpPageStatus = "complete";
}

function exposeTestFunctionNames(){
	var tests = new Array();
	tests[0]="testAdd";
	tests[1]="testMinus";
	tests[2]="testMultiply";
	return tests;
}

//-->
</SCRIPT>
 <BODY>

 </BODY>
</HTML>



5 jsUnit的日志跟踪
jsUuit的日志跟踪有3各级别：warn、info和debug
看下面的例子就知道了 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>testHtml</TITLE>
 </HEAD>
<script type="text/javascript" src="myjs.js"></script>
<script type="text/javascript" src="jsunit\app\jsUnitCore.js"></script>
<script type="text/javascript">
<!--
function testAdd(){
	var result = add(arg1,arg2);
	warn("result", result);
	debug("result", result);
	info("result", result);
	assertEquals(6,result);
}

function testMinus(){
	var result = minus(arg1,arg2)
	assertEquals(2,result);
}

function testMultiply(){
	var result = multiply(arg1,arg2)
	assertEquals(8,result);
}

function testDivide(){
	var result = divide(arg1,arg2)
	assertEquals("4 divide 2 is 2",2,result);
}

function setUpPage(){
	arg1 = 4;
	arg2 = 2;
	setUpPageStatus = "complete";
}

function exposeTestFunctionNames(){
	var tests = new Array();
	tests[0]="testAdd";
	tests[1]="testMinus";
	tests[2]="testMultiply";
	return tests;
}

//-->
</SCRIPT>
 <BODY>

 </BODY>
</HTML>


在测试运行器中选择Trace level的级别就可以看到相应的日志信息了

6 测试套件(suit test)
测试集是为了把不同的测试页分组组织，其中可以包含测试页或其他测试集，他们会按照顺序执行。
注意点：
测试集中不能包含任何测试函数
必须包含一个返回 jsUnitTestSuite 对象的 suite 函数
有两个方法添加测试页：addTestPage(testPage) addTestSuite(testSuite), 在添加测试页时要注意路径，应是相对于testRunner.html的。
测试集的名称必须是suit() 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>suit test</TITLE>
 </HEAD>
<script type="text/javascript" src="jsunit\app\jsUnitCore.js"></script>
<script type="text/javascript">
<!--
function suite()
{
	var testSuite = new top.jsUnitTestSuite();
	//增加的测试页面的路径是相对于测试运行器的路径的（testRunner.html），而不是相对于当前的页面
	testSuite.addTestPage("../mytest1.html");
    //套件里还可以在包含套件
	testSuite.addTestSuite(Suite2());
	return testSuite;
}
function Suite2() //需要与suite定义在同一个页面中
{
	var testSuite = new top.jsUnitTestSuite();
	testSuite.addTestPage("../mytest2.html");
	return testSuite;
}

//-->
</SCRIPT>
 <BODY>

 </BODY>
</HTML>


7 通过浏览器完成自动测试
file:///D:/mytest/jsunit/testRunner.html?testPage=D:/mytest/mytest1.html&autoRun=true
个人感觉没有实际意义

8 采用ant方式完成自动测试
首先进入jsunit目录，build.xml是junit定义好的模板，我们只需要简单的添加就可以了。
配置property属性
browserFileNames：浏览器地址；多个可以用逗号隔开；
closeBrowsersAfterTestRuns：执行测试后，是否关闭浏览器；默认true
logsDirectory：日志存放目录
url：测试文件地址；如：
file:///c:/jsunit/testRunner.html?testPage=c:/jsunit/tests/jsUnitTestSuite.html
在控制台下进入相关目录运行ant standalone_test 即可。
standalone_test是在单机上行运行测试；
distributed_test：是分布式远程测试；
ant不能执行或者执行出错：
查看环境变量
path下是否有java与ant的bin
是否设置Java_Home
iteye_194
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript单元测试框架JsUnit基本介绍和使用
weixin_53341657的博客
01-27 962
XUnit framework XUnit是一套标准化的独立于语言的概念和结构集合,用于编写和运行单元测试(Unit tests). 每一个语言都有一个用于单元测试的XUnit框架,比如Java有JUnit, C++有CppUnit, PHP有PHPUnit, Oracle SQL有UTPL/SQL. JsUnit遵循XUnit的一些惯例: 单元测试在JsUnit中叫做Test Functions. est Functions所在的HTML页面叫做Test Page. 一个Test Page是一个包含js
JsUnit使用说明书(内含使用心得)
01-16
单元测试工具JSUNIT，用于测试javascript,内含安装方法、使用说明、功能介绍以及个人心得等，较全面。
18、JavaScript单元测试框架jsUnit
kaoa000的专栏——非淡泊无以明志，非宁静无以致远
04-27 809
1、JavaScript编码规范：通常在Javascript不希望外界访问的成员和方法名以下划线开始 2、jsUnit测试函数的要遵循的规则与JUnit3.8类似（比如说测试函数名以test开头等） 想要使用jsUnit，要引入jsUnit库jsUnitCore.js，使用如下语句：     test function add(num1
uint-js:任意精度无符号整数的Javascript实现
05-30
用户界面 这是一个简单的 JavaScript 库，用于处理精确宽度的无符号整数类型的操作子集。 我们开发了此库，以帮助使用底层网络和设备类型。 它不是一个任意精度的整数库。 但是，如果您正在处理网络地址、执行路由查找或尝试在一系列无符号整数宽度上进行按位逻辑运算，则该库可能对您有所帮助。 示例用法 var Broadcast = new UInt({ bits: 48}); // Ethernet MAC address Braodcast.value('0xffffffffffff'); // Set to the Braodcast address console.log(MAC.toString()); // Output the string version // IPv4 network and mask address, construct
JSUnit单元测试
06-21
前台单元测试材料，适合初学者对前台测试的了解和学习。
jsunit.rar
09-16
JavaScript Unit Testing，通常简称为JSUnit，是一种针对JavaScript代码进行单元测试的框架，类似于Java中的JUnit工具。在软件开发过程中，单元测试是确保代码质量、可维护性和避免bug的重要环节。JSUnit允许开发者...
JsUnit-开源
04-24
**JsUnit 开源详解** JsUnit 是一个针对 JavaScript 语言设计的单元测试框架，它的灵感来源于 Java 领域中的著名测试工具 JUnit。JsUnit 的出现，为 JavaScript 开发者提供了一种强大的、结构化的测试工具，使得在...
JsUnit单元测试框架
12-16
**JsUnit单元测试框架** JsUnit是一款专门为JavaScript代码设计的单元测试框架，它借鉴了Java领域中的JUnit测试框架的理念，为JavaScript开发者提供了一种结构化、自动化测试的工具。单元测试是软件开发过程中的...
JSunit2.2(上)
11-25
很好的JavaScript测试工具,呵呵,首次发表望多多支持.
JsUnit测试JS
清风抚白杨
11-17 6660
为什么要用JsUnit，因为项目不是WEB项目，JS代码无法用网页测试，同样无法通过alert测试，所以采用JsUnit来测试编写的JS代码。 准备工作：下载JsUnit相关资源：www.jsunit.net 解压后如下图： JsUnit的核心文件（jsUnitCore.js、jsUnitTestManager.js等 ）都在app文件夹中，testRunner.html是
jsunit
张议的博客
02-06 411
文章目录 javaScript 单元测试（jsUnit）：http://www.jsunit.net/ JavaScript 编码规范：通常在 JavaScript 不希望外界访问的成员和方法名以下划线开始。 jsUnit 测试函数的要遵循的规则与 JUnit 3.8 类似（比如说测试函数名以 test 开头等） 一定要记住testRunner.html一定要用IE浏览器打开，并且要在本地打开不...
JS 的二进制家族一
花铛
04-12 1695
历史上 JavaScript 是没有读写二进制数据能力的，但随着 es5 中 Blob 对象的引入以及 es6 中 ArrayBuffer 对象、TypedArray 和 DataView 对象的规范化， JS 处理二进制数据的能力大幅度增强，也能直接处理文件流，网络流等二进制 Buffer 数据了。Node.js。
js 处理带符号 32 位正数 unit32
weixin_42286658的博客
09-26 615
js 处理带符号 32 位正数 unit32
js int 和 uint8array ，相互转换
最新发布
weixin_42575028的博客
04-10 559
请注意，这些方法都假设输入的Uint8Array每个元素不会大于255，并且Uint8Array的长度在int能够表示的范围内。方法一：使用TypedArray的reduce方法。方法三：使用BigInt对象进行转换。方法二：使用for循环和位运算符。需要翻转unit8array。
菜鸟学习第二十四天，js单元测试之jsUnit
qjw1314520的博客
05-10 257
1. javaScript编码规范：通常在javaScript不希望被外界访问的成员和方法名以下划线开始，JUnit是java的单元测试，JsUnit是javaScript的单元测试 **2.**编写自己的测试用例： 第一步，如果某个页面包含了jsUnitCore.js文件，那么这个页面就是jsUnit的测试页面，所以必须要将jsUnitCore.js文件引入到需要测试的页面： <scri...
JS中ArrayBuffer和Uint8Array区别
热门推荐
qq_34754747的博客
01-20 3万+
1. ArrayBuffer又称类型化数组。 ArrayBuffer Uint8Array数组 存储内容 放0和1组成的二进制数据 放数字、字符串、布尔值以及对象和数组等 存储位置 数据放在栈中（所以取数据较快） 放在堆中 存储大小 初始化后固定大小 数组则可以自由增减 2. ArrayBuffer构造函数 var arra...
JsUnit入门
rainyspring4540的专栏
02-09 1372
感谢 http://blog.csdn.net/sdyy321/article/details/6981912 http://blog.csdn.net/sdtsfhh/article/details/1640279 和官网demo：https://github.com/pivotal/jsunit/blob/master/testRunner.html 下载后的目录 入门看
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值