JavaScript 单元测试框架：Jasmine 初探（1）简介

look_w

简介        随着互联网浪潮的逐渐兴起，各种基于互联网的云战略也不断涌现，各个公司对云平台的理解和实现不尽相同，而云+端的模式越来越多受到关注。其中的端可以理解为终端用户手中的各种终端，包括 PC、手机、平板等不一而足。        而越来越多的用户愿意在自己的设备上使用轻量级的基于浏览器的应用。这类应用的安装部署可以是通过插件的方式安装，也有可能是直接以网页的形式访问而无需安装，相对于富客户端的下载安装，对用户来说更加简单方便，用户体验也更好。
        这类应用对开发人员来说，需要一些互联网相关的技术，其中必不可少 HTML CSS 和 JavaScript 技术。而 JavaScript 作为一种客户端脚本语言，和传统编程语言 Cpp、Java 等相比，没有诸如 Eclipse、Visual Studio 等集成开发调试环境，其调试和测试是对开发人员都是一项挑战。
        目前 JS 单元测试框架有丰富的选择，比如 Buster.js、TestSwarm、JsTestDriver 等。而 Jasmine 作为流行的 JavaScript 测试工具，很轻巧只有 20K 左右，而功能丰富，让我们可以容易的写出清晰简洁的针对项目的测试用例。对基于 JavaScript 开发的项目来说，是一款不错的测试框架选择。
搭建环境获取安装包        可以在开源社区网站下载最新的 Jasmine 安装包, 目前的 Standalone 的最新版本是 1.3.0. 下载地址：        https://github.com/pivotal/jasmine/downloads
配置安装下载后的.zip 文件包解压缩，如下的目录结构：
图 0.目录结构其中 lib 文件夹中包含 Jasmine 的源代码。采用如下相对路径可以包含 Jasmine，进而开发基于 Jasmine 的测试用例。

1 2 3 4

<link rel="shortcut icon" type="image/png" href="lib/jasmine-1.3.0/jasmine_favicon.png"> <link rel="stylesheet" type="text/css" href="lib/jasmine-1.3.0/jasmine.css"> <script type="text/javascript" src="lib/jasmine-1.3.0/jasmine.js"></script> <script type="text/javascript" src="lib/jasmine-1.3.0/jasmine-html.js"></script>

        spec 和 src 和 SpecRunner.html 是 Jasmine 的一个完整示例，用浏览器打开 SpecRunner.html，即可看到执行的结果。       
基本概念describe        describe 是 Jasmine 的全局函数，作为一个 Test Suite 的开始，它通常有 2 个参数：字符串和方法。字符串作为特定 Suite 的名字和标题。方法是包含实现 Suite 的代码。
清单 1.测试用例

1 2 3 4 5 6 7

describe("This is an exmaple suite", function() {   it("contains spec with an expectation", function() {     expect(true).toBe(true);     expect(false).toBe(false);     expect(false).not.toBe(true);   }); });

Specs        Specs 通过调用 it 的全局函数来定义。和 describe 类似，it 也是有 2 个参数，字符串和方法。每个 Spec 包含一个或多个 expectations 来测试需要测试代码。
        Jasmine 中的每个 expectation 是一个断言，可以是 true 或者 false。当每个 Spec 中的所有 expectations 都是 true，则通过测试。有任何一个 expectation 是 false，则未通过测试。而方法的内容就是测试主体。
        JavaScript 的作用域的规则适用，所以在 describe 定义的变量对 Suite 中的任何 it 代码块都是可见的。
清单 2.测试用例

1 2 3 4 5 6 7 8 9 10 11 12 13 14

describe("Test suite is a function.", function() {   var gVar;   it("Spec is a function.", function() {     gVar = true;     expect(gVar).toBe(true);   });   it("Another spec is a function.", function() {     gVar = false;     expect(gVar).toBe(false);   }); });

Expectations        Expectations 是由方法 expect 来定义，一个值代表实际值。另外的匹配的方法，代表期望值。
清单 3.测试用例

1 2 3 4 5 6

describe("This is an exmaple suite", function() {   it("contains spec with an expectation", function() {     var num = 10;     expect(num).toEqual(10);   }); });

以上代码可以在附件中的 List.html 运行，结果见下图：
图 1.测试用例结果总结        describe 方法用来组织相关的 Spec 集合。string 参数作为 Spec 集合的名字，会和其中的 Spec 连接组成 Spec 的完整名字。这样在一个大的 suite 中可以更容易找到某个 Spec。如果给它们命名适当，Specs 读起来是一个典型的 BDD 样式的句子。
        Spec 是作为测试主体，Suite 是一个或多个 Spec 的集合。
        describe 和 it 代码块中都是方法，可以包含任何可执行的代码来实现测试。而方法的内容就是 Suites。