骨干 - 测试使用茉莉花的简单模型导致TypeError

Question

我想了解使用Jasmine测试基于骨干的应用程序的方式。为此，我从这里拿到了一些示例代码：http://msdn.microsoft.com/en-us/scriptjunkie/hh377172。

Photo = new Backbone.Model.extend({ 
     defaults:{ 
      title: 'Another photo!', 
      tags: ['untagged'], 
      location: 'home', 
      src: 'placeholder.jpg' 
     }, 
     initialize: function(){ 
      console.log('this model has been initialized'); 
      this.bind("change:title", function(){ 
       var title = this.get("title"); 
       console.log("My title has been changed to.." + title); 
      }); 
     }, 

     setTitle: function(newTitle){ 
      this.set({ title: newTitle }); 
     } 
    }); 

然后写测试规格如下：

describe("Photo Model", function() { 
     it("verifies title", function() { 
     var myPhoto = new Photo(); 
     myPhoto.set({ title: "On the beach" }); 
     expect(myPhoto.get("title")) 
      .toEqual("On the beach"); 
     }); 
    }); 

在运行它，测试失败，类型错误

TypeError: Object [object Object] has no method 'apply' 
     at new <anonymous> (http://localhost:88/backbone/WebClient-Backbone2/js/backbone.js:1103:41) 
     at [object Object].<anonymous> (http://localhost:88/backbone/WebClient-Backbone2/test/spec.js:28:16) 
     at [object Object].execute (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:1001:15) 
     at [object Object].next_ (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:1790:31) 
     at [object Object].start (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:1743:8) 
     at [object Object].execute (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:2070:14) 
     at [object Object].next_ (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:1790:31) 
     at [object Object].start (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:1743:8) 
     at [object Object].execute (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:2215:14) 
     at [object Object].next_ (http://localhost:88/backbone/WebClient-Backbone2/test/lib/jasmine/jasmine.js:1790:31)  

Answer 1

正如评论中提到的，我发现这是由于模型定义中的“新”。

因此，改变后，

var Photo = new Backbone.Model.extend({ 

到

var Photo = Backbone.Model.extend({ 

错误消失。

Answer 2

下面的代码片段可能是罪魁祸首。

this.bind("change:title", function(){ 
    var title = this.get("title"); 
    console.log("My title has been changed to.." + title); 
}); 

在Javascript中，在此关键字是基于它在函数的范围上下文由于这是一个匿名函数内（this.bind（“变化：标题”，功能（）），那么这已经改变它的范围。

简单的解决方法是使用一个封闭件来设置此匿名功能外的另一变量，然后可以使用匿名内部变量功能。

显示代码示例可能会更好地解释它。将您的初始化方法更新为以下内容。

initialize: function(){ 
     console.log('this model has been initialized'); 
     var self = this; 
     this.bind("change:title", function(){ 
      var title = self.get("title"); 
      console.log("My title has been changed to.." + title); 
     }); 
    }, 

也将在的setTitle（）方法同样的问题。您需要在初始化（）方法中添加以下代码行，以便正确设置这个的上下文。

_.bindAll(this, "setTitle"); 

Answer 3

没有为这里茉莉测试基于骨干网应用一套好的教程： http://tinnedfruit.com/2011/03/03/testing-backbone-apps-with-jasmine-sinon.html