您的位置：首页 > Web前端 > JavaScript

QUnit 初见面--JavaScript单元测试框架

2013-03-26 15:27 856 查看

第一次做JS的单元测试，以前在网页里只用看显示和跳转什么的就好了，应该属于黑盒测试。

刚开始用QUnit，也只是大概知道如何开始用。应该还有更多的东西需要去了解。先小记一下。比较优缺点的暂时还做不到。可能对于从来没接触过单元测试以及这类工具的人来说，最重要的是先小试一下，建立一个初始的印象。傻瓜级步骤：

1 http://docs.jquery.com/Qunit 下载所需要的文件。

首先下载QUnit的开发包，解压后我们只需要qunit目录下的qunit.css和qunit.js文件即可。然后创建一个HTML文件将这两个文件引用进来即可，HTML代码如下：（实例是转其他博客的呦）

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>QUnit Test Suite</title>
<link rel="stylesheet" href="../qunit/qunit.css" type="text/css" media="screen">
<script type="text/javascript" src="../qunit/qunit.js"></script>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
<h1 id="qunit-header">QUnit Test Suite</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture">test markup</div>
</body>
</html>

下面这两句话：
<link rel="stylesheet" href="../qunit/qunit.css" type="text/css" media="screen">
是引用已有的显示的样式，把下载的CSS文件的路径导入即可
<script type="text/javascript" src="../qunit/qunit.js"></script>
是引用qunit的已有的库的，不一定是和这一句的文件名一样哦，看你自己的文件的路径和名字。

2 测试脚本最好放在一个名为test的文件夹里，假设文件夹和html文件同一级（不这样放也可以，后来引用的时候写清路径就好了），文件要引入到html文件中。

引入方法：

<script type="text/javascript" src="test/youtestname.js"></script>（写清test脚本的路径就可以）

3 同样的方法引入源代码，建议放在名为src的文件夹中。

4 下面就可以开始写TEST脚本啦。可以利用已有的API。

API相关知识我是从另一个博客学习而来的，地址是：/article/2932618.html

5 需要自己写或者改的地方，除了自己写的测试脚本，只有HTML文件中引入的文件，其他的都不用我们来处理。对于博主这种小菜鸟，也算极其简便的。

6 结果的显示：

绿色的为通过项，红色的代表未通过~如果代码出问题还可能直接挂掉....后面的都不会再运行了。

还在摸索中，希望有人一起探讨~

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航