我正在为Backbone View编写测试,以测试获取模型后是否正在调用render函数。测试是:

beforeEach(function () {
    $('body').append('<div class="sidebar"></div>');
    profileView = new ProfileView();
});

it('should call the render function after the model has been fetched', function (done) {
    profileView.model = new UserModel({md5: 'd7263f0d14d66c349016c5eabd4d2b8c'});
    var spy = sinon.spy(profileView, 'render');
    profileView.model.fetch({
        success: function () {
            sinon.assert.called(spy);
            done();
        }
    });
});

我正在使用Sinon Spies将 spy 对象附加到profileView View 对象的渲染功能。

该 View 是:
var ProfileView = Backbone.View.extend({
    el: '.sidebar'
  , template: Hogan.compile(ProfileTemplate)
  , model: new UserModel()
  , initialize: function () {
        this.model.bind('change', this.render, this);
        this.model.fetch();
    }
  , render: function () {
        $(this.el).html(this.template.render());
        console.log("Profile Rendered");
        return this;
    }
});

在测试中调用fetch之后,将触发change事件,并且将调用 View 的render函数,但是Sinon Spy并未检测到正在调用渲染并且失败了。

作为一个实验,我尝试在测试中调用render函数,以查看 spy 是否识别出它:
it('should call the render function after the model has been fetched', function (done) {
    profileView.model = new UserModel({md5: 'd7263f0d14d66c349016c5eabd4d2b8c'});
    var spy = sinon.spy(profileView, 'render');
    profileView.render();
    profileView.model.fetch({
        success: function () {
            sinon.assert.called(spy);
            done();
        }
    });
});

spy 在上述情况下检测到被叫。

有谁知道为什么 spy 在我的初始测试中没有识别出渲染调用?

最佳答案

问题在于,在构造 View 期间,initialize函数将事件直接绑定(bind)到render函数。您无法用 spy 程序拦截此事件,因为绑定(bind)在设置 spy 程序之前就已经发生(在构造之后进行此操作)。

解决方案是在构造 View 之前监视原型(prototype)。因此,您将不得不将 spy 移动到beforeEach中,或者将 View 的构造移动到测试中。

设置 spy :

this.renderSpy = sinon.spy(ProfileView.prototype, 'render');
this.view = new ProfileView();

然后再删除 spy :
ProfileView.prototype.render.restore()

然后,这将监视“常规”渲染以及模型中的更改事件。

关于javascript - Backbone.js在浏览器中使用Sinon Spies查看测试,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/9623986/

10-12 22:53