QUnit - 基本測試 - 檢查字段值

我對QUnit非常陌生。選擇了一個簡單的JavaScript函數來針對它進行qunit測試。下面是函數：QUnit - 基本測試 - 檢查字段值

function createSelectField(parent, elemid, value, collection) { 
var elem1 = document.createElement("select"); 
elem1.id = elemid; 
     parent.appendChild(elem1); 
$("#" + elemid).addOption(collection, false); 
if(value != null) { 
     elem1.value = value ; 
} 
var oldvalue = value; 
}

它創建了一個選擇欄，其追加到父，增加了一些選項，它（使用jQuery插件中），並設置默認值無論是在過去，我正在嘗試。爲這個函數寫兩個測試，其中一個值爲null時，另一個值爲一些字符串。測試它的假設來檢查該字段的值。

這裏是我的嘗試：

所有的

module('Test createSelectField'); 
test('createSelectField() with no default value', function() { 
var parent = document.createElement("div"); 
createSelectField(parent, 'umbi', null, {"key1": "value1", "key2": "value2"}); 
var elem = $('#umbi'); 
equal(elem.val(), null, "No default value provided for the drop down"); 

}); 

test('createSelectField() with some default value', function() { 
var parent = document.createElement("div"); 
createSelectField(parent, 'bi', 'key1', {"key1": "value1", "key2": "value2"}); 
var elem = $('#bi'); 
equal(elem.val(), 'key1', "Default to key1 value"); 

});

首先，我試圖讓元素使用的document.getElementById創建的，沒有工作，它返回null。使用JQuery選擇器似乎讓我的元素，但我沒有看到值（用FireBug調試）（我甚至不知道它給了我在我的函數內創建的元素）。我甚至試圖從我的主要功能返回元素，但仍然無法正常工作。我很困惑和f。。我想寫單元測試我的JavaScript，但這幾乎讓我想放棄。幫幫我？！

來源

2012-04-12 user1329167

因爲您的元素沒有插入到頁面中，而是在創建了CSS查詢的div內，因此無法像查看文檔一樣工作。

其中$('#umbi', parent)將在父上下文中搜索它，並且即使該元素不是DOM的一部分也將工作。

但是至於你的測試，你只插入一個單一的項目，你也可以通過div.childNodes[0]訪問它。

來源

2012-04-12 13:32:57 GillesC

感謝您的幫助，這讓我向前邁了幾步。現在剩下的問題是，當我傳入像'key1'這樣的值時，它會進入函數中的if塊，看起來像是在elem上設置值，但是當我在FireBug中調試時，值仍然是「」，這也是我在測試中得到的。 – user1329167 2012-04-12 14:13:05

我懷疑函數中的賦值是錯誤的。你創建一個select元素，它從來沒有一個值（jQuery $（select）.val（）使它聽起來像是有），而它是包含值的選項，select只能爲你提供selectedIndex。所以真正想要分配的默認選項是elem1.selectedIndex（這是一個數組鍵，然而選項作爲一個對象傳遞給你的情況） – GillesC 2012-04-12 14:24:11

我明白了。實際上，現在你提到了，我在調試模式中注意到'$（「＃」+ elemid）.addOption（collection，false）; '不會將我的集合添加到選擇選項列表中。（現在，我應該說這個代碼是在UI中測試的，並且工作正常，因爲我寫的測試用例更具教育意義）。所以我認爲從測試腳本執行時，我可能會遇到其他一些自定義插件問題。無論如何，我會繼續努力。再次感謝你。 – user1329167 2012-04-12 14:46:52

QUnit - 基本測試 - 檢查字段值

回答

相關問題