在茉莉花測試中嘲弄Banckbone中的HTML元素

Question

我正在做茉莉花單元測試Backbone應用程序。我是Jasmine以及Backbone的新手。我在應用程序中的視圖是使用HTML模板中的BackboneJS創建的。

由於應用程序已經部署。現在我想測試一個Backboneview。爲此，我需要在textbox中創建一個 模擬HTML和一些模擬數據。

我有這樣的代碼：我的茉莉花文件

that.uoView = new UoView(); 
that.uoView.render(); 
$('#sandbox').html(that.uoView.el); 

。這是我可以進行任何更改的唯一文件。它調用一個視圖並將其保存在$('sandbox')

因爲我已經有了HTML模板，所以我需要在HTML文本框中填充一些模擬數據。

Answer 1

簡單的jQuery工作由rednaw的建議。寫此代碼後：

that.uoView = new UoView(); 
that.uoView.render(); 
$('#sandbox').html(that.uoView.el); 

我加入這個代碼：

$("#test").val('Test'); //#test is an element in uoView.el 

再其次是我的規格

Answer 2

通常你初始化你的觀點有這樣一個元素：

that.uoView = new UiView({ el: $("#myelement") }); 
that.uoView.render() 

然後在渲染功能渲染應該進來el的HTML：你叫渲染每次

render: function() { 
    this.$el.html('my html'); 
} 

，視圖得到再次呈現。你可以在任何html事件中調用渲染。

Answer 3

您可以在渲染後返回。

render: function() { 
    this.$el.html('my html'); 
    return this; 
} 

所以你最終獲得：

that.uoView = new UoView(); 
$('#sandbox').html(that.uoView.render().el);