刚刚尝试 Zombie.js今天第一次访问通过 javascript(特别是 Backbone.js 应用程序)填充 DOM 元素的页面时遇到问题。作为一个简单的例子,我访问了 Backbone.js Todo app并手动添加了一些项目。然后我尝试使用 Zombie 获取 #todo-list
元素中的 html,但返回时是空的。我已经设置了 browser.runScripts = true
,所以不应该一切都准备好让 Zombie 查询吗?
看源码,里面的HTML确实是空的。这甚至可以用 Zombie.js 实现吗?或者我是否需要使用 Jasmine 之类的东西,就像完成的一样here ?
我在下面提供了示例代码以及我收到的响应。
var zombie = require('zombie'),
vows = require('vows'),
assert = require('assert');
var baseUrl = 'http://documentcloud.github.com/backbone/examples/todos/index.html';
vows.describe('Zombie Tests on a Backbone App').addBatch({
'Navigate to Todo List' : {
topic: function () {
browser = new zombie.Browser({ debug: true });
browser.runScripts = true;
browser.on('error',function (err){console.log(err.stack)});
browser.visit(baseUrl, this.callback);
},
'Can see todo list' : function (err,browser,status) {
console.log('todo-list inner:' + browser.querySelector("#todo-list").innerHTML);
// actual tests would go here
}
},
}).export(module);
运行 vows
的输出:
> vows test/todo-test.js --spec
♢ Zombie Tests on a Backbone App
Zombie: GET http://documentcloud.github.com/backbone/examples/todos/index.html
Zombie: GET http://documentcloud.github.com/backbone/examples/todos/index.html => 200
Zombie: GET http://documentcloud.github.com/backbone/test/vendor/json2.js
Zombie: GET http://documentcloud.github.com/backbone/test/vendor/jquery-1.5.js
Zombie: GET http://documentcloud.github.com/backbone/test/vendor/underscore-1.1.6.js
Zombie: GET http://documentcloud.github.com/backbone/backbone.js
Zombie: GET http://documentcloud.github.com/backbone/examples/backbone-localstorage.js
Zombie: GET http://documentcloud.github.com/backbone/examples/todos/todos.js
Zombie: GET http://documentcloud.github.com/backbone/examples/backbone-localstorage.js => 200
Zombie: GET http://documentcloud.github.com/backbone/test/vendor/json2.js => 200
Zombie: GET http://documentcloud.github.com/backbone/test/vendor/underscore-1.1.6.js => 200
Zombie: GET http://documentcloud.github.com/backbone/backbone.js => 200
Zombie: GET http://documentcloud.github.com/backbone/examples/todos/todos.js => 200
Zombie: GET http://documentcloud.github.com/backbone/test/vendor/jquery-1.5.js => 200
Zombie: Firing timeout 1, delay: 1
todolist inner:
Navigate to Todo List
✓ Can see todo list
✓ OK » 1 honored (3.824s)
最佳答案
如果您使用 browser.html
方法,那么您的示例有效 — 我认为问题出在 browser
对象没有 querySelector
方法(不过它确实有一个 query
and queryAll
method )。
这是修改后的工作片段:
'Can see todo list' : function (err, browser, status) {
var list = browser.html('#todo-list');
console.log('todo-list inner: ' + list);
// actual tests would go here
}
关于javascript - 使用 Zombie.js 查询 Backbone.js 应用程序的 DOM,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7410920/