骨幹 - 測試使用茉莉花的簡單模型導致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