测试Backbone.js视图

Question

我目前正在使用Jasmine测试主干视图，但遇到了一些麻烦。 我试图将视图与所有其他元素（实例化的其他视图，集合）隔离开来，但这几乎是不可能的。

initialize: function(options) {
    if(options.return) {return;}
    var view = this;
    var name = options.name;
    var localizedElements = app.helpers.Locale.l().modules.case[name];
    var swap, notification;
    this.name = name.capitalizeFirstLetter();
    this.collection.on('sort', this.refreshGui, this);
    return this.render('/case/' + name + '/' + this.name + 'Box.txt', localizedElements, this.$el).done(function() {
        new app.views.Buttons({el: view.$el.find('.Buttons')});
        _.each(view.collection.models, function(model) {
            new app.views['Folded' + this.name]({model: model, el: this.$('table')});
        }, view);
        if(!view.collection.findWhere({isPreferred: true}) || !view.collection.findWhere({isPrescribedForms: true})) {
            if(!view.collection.findWhere({isPreferred: true})) {
                swap = {entity: 'address', preferenceType: 'preferred'};
                notification = app.helpers.Locale.l().generic.warningMessages.missingPreference.swap(swap);
                var preferredNotification = [notification];
                app.helpers.Notification.addNotifications('warnings', {missingPreferred: preferredNotification});
            }
            if(!view.collection.findWhere({isPrescribedForms: true})) {
                swap = {entity: 'address', preferenceType: 'prescribed forms'};
                notification = app.helpers.Locale.l().generic.warningMessages.missingPreference.swap(swap);
                var prescribedFormsNotification = [notification];
                app.helpers.Notification.addNotifications('warnings', {missingPrescribedForms: prescribedFormsNotification});
            }
        }
    });
},

例如，在有两个“ if”的地方，视图正在与集合和一个助手对话：“ Notification Helper”。 如果我嘲笑了集合和通知助手，我应该如何测试这部分代码？ 我的意思是我正在测试VIEW，但是现在看来我必须在我的视图中测试应用程序的其他元素...

Answer 1

我正在尝试将视图与所有其他元素隔离

我不确定这是否对您有帮助，但是我创建了自己的策略来解决此问题。
骨干网的问题通常确实是，视图对象的功能变得杂乱无章。
就个人而言，我喜欢我的视图来处理DOM交互，侦听DOM事件。
但是，为了执行与后端的业务逻辑/交互，我更喜欢将此功能委托给其他“外部”对象。

另一方面，模型可以“处理”基本数据验证，但无非是与应用程序中的服务器进行RESTful交互。

我如何解决该问题的方法是实例化自定义Javascript（“控制器”）对象，这些对象充当视图和模型之间的中介。
这个对象不过是一个看起来像这样的对象：

var Some_controller = function(options){ 
    this.makeView(); 
}; 

Some_controller.prototype.makeView = function(){
    var someView = new Some_view({'controller': this}); 
    someView.render(); //Render, but can also take care of proper view cleanup to avoid zombie objects 
}; 

Some_controller.prototype.getModel = function(){ 
    var someModel = new Some_model(); 
    var promise = model.fetch(); 
    return promise; //Promise be called from the view, because the controller is passed via the options, when the view is instantiated.  
}; 

好吧，这就是我尝试保持观点清洁的方式。
以我的经验，很容易立即找到所有内容。 并且请注意，您还可以使用辅助对象来隔离更具体的业务功能。
不知道是否有人对此有更好的解决方案。