使用 jasmine 测试backbone.js 应用程序 - 如何在视图上测试模型绑定? [英] Testing backbone.js application with jasmine - how to test model bindings on a view?

问题描述

在尝试测试视图是否正确绑定到事件时，我遇到了一些有趣的磨难.在主干中，我们通常在 initialize 方法中绑定事件，使用类似的东西:something.bind("change", this.render);.在我的测试中，我想确保设置了此绑定，因此我执行了以下操作:

I had some interesting tribulations in trying to test whether views were correctly bound to events.  In backbone, we typically bind to events in the initialize method, using something along the lines of: something.bind("change", this.render);.  In my test, I want to make sure that this binding is set up, so I did the following: 

this.myView = new MyView();
spyOn(this.myView, "render");;
this.legendView.groupData.trigger("change");
expect(this.legendView.render).toHaveBeenCalled();

但是，这行不通.因为绑定发生在 MyView 的 initialize 函数中，所以事件 get 会在那个时候绑定到 myView 的渲染函数.因此，当您添加 spy 时，它会包装渲染函数并将其设置回 myView.render 中的位置.但是第一个绑定创建的闭包仍然存在，我们完全被迷住了.那么我们能做些什么呢?我所做的是将绑定调用移动到一个单独的函数，例如:

But, that won't work.  Because the bind occurs in MyView's initialize function, the event get's bound to myView's render function AT THAT TIME.  So, when you add your spy, it wraps the render function and sets it back into place at myView.render.  But the closure created by the first bind still exists, and we are totally hozed.  So what can we do about it?  What I did, is move my bind call's to a seperate function, something like: 

myView = Backbone.View.extend({
initialize: function(){
    _.bindAll(this, "render");
    this.initialize_model_bindings();
},
initialize_model_bindings: function(){
    something.bind("change", this.render);
},
render: function(){ //... }
});

然后我的测试看起来像:

and my test then looks like:

this.myView = new MyView();
spyOn(this.myView, "render");
this.myView.initialize_model_bindings();
this.legendView.groupData.trigger("change");
expect(this.legendView.render).toHaveBeenCalled();

这可行，但我正在寻找更好的解决方案.谢谢

This works, but I'm looking for a better solution. Thanks

推荐答案

与其监视回调，您还可以尝试监视 something.bind.然后测试使用适当的参数调用了绑定.到目前为止，这对我有用.我使用 sinon.js 而不是 jasmine 的内置间谍.sinon.js 使测试传递给相同方法调用堆栈中的方法调用的参数变得更容易一些(例如，在视图初始化中绑定的一堆调用).所以我还没有单独用茉莉花测试这个想法，但相信它应该是可能的.

Instead of spying on the callback you might try spying on something.bind. Then test that bind was called w/ the appropriate arguments. This is working for me so far. I'm using sinon.js instead of jasmine's built-in spies. sinon.js makes it a bit easier to test for args passed to a method call in a stack of same method calls (eg a bunch of calls to bind in a view init). So I haven't tested this idea w/ jasmine alone but believe it should be possible.

spyOn(this.legendView.groupData, 'bind');
this.myView = new MyView();
expect(this.legendView.groupData.mostRecentCall.args).toEqual('change', this.myView.render); // example!! only works if testing a single call to bind or the last call in a series (ie mostRecentCall)

和 sinon.js

sinon.spy(this.legendView.groupData, 'bind');
this.myView = new MyView();
expect(this.legendView.groupData.bind.calledWith('change', this.myView.render); // works w/ any number of calls to bind

这篇关于使用 jasmine 测试backbone.js 应用程序 - 如何在视图上测试模型绑定?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！