日期:2014-05-16  浏览次数:20335 次

采用tdd进行javascript开发

?

昨天与同事实现一个简单的地图定位功能,功能虽然简单,可是过程却是痛苦的,且程度是极度的。痛苦的主要原因源自于调试前端界面,也就是javascript部分。多年前也曾经写过许多javascript程序,那段历史可以追溯到ajax还未出现之前。以前写的时候因为自身、环境等各种原因,从来没有考虑过写javascript的单元测试。
经过昨天,深刻地体会了一次如果没有对javascript做单元测试,调试的过程是多么的痛苦。由于时间问题,今天粗略的google了一下javascript单元测试库,发现主要有:

  • JSUnit – http://www.jsunit.net/
  • jspec – http://jspec.info/
  • jasmine – http://pivotal.github.com/jasmine/
  • QUnit – http://docs.jquery.com/Qunit
  • jsspec – http://code.google.com/p/jsspec/

在选择的时候原本准备选用jasmine,主要原因有三个:

  1. jasmine(茉莉花)本人最喜欢的花;
  2. jasmine的语法非常优美,非常适合BDD;
  3. jasmine可以与rails集成。

但是最后由于使用rails g jasmine:install时出错而打住了。最后选择了QUnit,因为他是jQuery提供的,jQuery有是那么的流行,定位地图很多也是基于jQuery写的,另外,有一个叫做mockjax的扩展,可以方便的模拟ajax请求。

下面用一个简单的例子记录今日的学习过程,并展示用QUnit如何进行TDD。

需求定义

提供一个消息窗体函数,该函数可以将一个div渲染成一个消息窗口。函数需要知道将渲染的div是哪个;需要知道用什么内容去渲染该消息窗体。

详细过程

?