用groovy测试javascript -- Sumatra框架 -- 第二部分

用groovy测试javascript -- Sumatra框架 -- 第一部分

 

Mocking JavaScript 对象行为

 

Javascript的语言特点决定了其对象的行为可以在对象被定义好后被轻易改变。比如下面代码里这个简单的例子，Conference对象的getTheName方法被定义为一个返回字符串的function

 

 

Conference.prototype.getTheName = function() {
return 'The name is ' + this.name
}

 

在javascript中我们可以指定另外一个function来替换getTheName的行为，用Sumatra也可以一样轻松做到：

 

 

 

load('conference.js')
def conference = getJsObject('minnesotaBarCamp')
assert 'The name is Minnebar' == conference.getTheName()
// mock out the method getTheName() to be something else
conference.getTheName = newFunction('function(){ return "The name is NOT " + this.name }')
assert 'The name is NOT Minnebar' == conference.getTheName()

 newFunction方法返回一个function的引用，我们把它赋值于getTheName方法，其行为被替换掉了。

 

 

Mock 浏览器测试

Javascript通常要跟浏览器发生交互，操作DOM对象，显示隐藏DIV，更改CSS class什么的，比如下面代码中的expandSettings function

 

function expandSettings() {
var el = document.getElementById('settings')
el.className = 'expanded'
return el
}

 

在sumatra中，进行浏览器测试首先要调用initBrowser方法进行浏览器环境初始化，之后就可以调用createStubElement方法来模拟DOM对象方便我们测试javascript。

createStubElement方法第一个参数是DOM对象类型，第二个参数是对象的id，第三个参数是个map，里面包含了虚拟DOM对象

的其他属性。

 

 

 

initBrowser()
def stubElement = createStubElement(
'div',
'settings',
[className:'closed', innerHTML:'Hello World'])
assert 'closed' == stubElement.className
assert 'Hello World' == stubElement.innerHTML
assert 'settings' == stubElement.id
assert 'DIV' == stubElement.tagName

load(expandSettings.js')
def returnedElement = f('expandSettings')()
// className 属性被改变了
assert 'expanded' == returnedElement.className
// 其他属性没变
assert 'Hello World' == returnedElement.innerHTML
assert 'settings' == returnedElement.id
assert 'DIV' == returnedElement.tagName
// stubElement 的className属性也变了，因为他就是 returnedElement
assert 'expanded' == stubElement.className

 

上面代码中的f方法返回一个function的引用，接着进行了运行。这里其实用execJs也行。

 

使用JavaScript框架

现在已经很少有人不使用Prototype JQuery之类的JavaScript框架了，Sumatra对于引用框架的javascript测试也进行了很好的支持。如果使用Protoyupe框架的话，上面的expandSettings方法就要大变样了：

 

function expandSettings() {
var el = $('settings')
el.className = 'expanded'
return el
}

 

这里面使用了Prototype框架里的$方法。

在Sumatra中引用Prototype，可以直接调用initFramework('prototype')

无处不在的$方法也可以被调用，不过因为在groovy中$不能作为方法名，所以要加一层单引号来调用：

 

load(expandSettings2.js')
def element = '$'('settings')
assert 'closed' == element.className
assert 'Hello World' == element.innerHTML
assert 'settings' == element.id
assert 'DIV' == element.tagName

 

在你的项目中使用Sumatra

 

在Sumatra中我们可以用Groovy跟JavaScript进行很自然的交互，从而实现各种测试。因为Sumatra使用Rhino，所以对浏览器没有依赖，我们可以很容易地把测试加在持续集成中。