0

我对 QUnit 很陌生。选择了一个简单的 JavaScript 函数来针对它编写一个 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 调试)(我什至不确定它是否给了我在函数中创建的元素)。我什至尝试从我的主函数返回元素,但仍然无法正常工作。我感到困惑和沮丧。我想编写单元测试我的javascript,但这几乎让我想放弃。帮助?!

4

1 回答 1

1

因为您的元素没有插入到页面中,而是在您创建的 div 中,所以 CSS 查询$('#umbi')无法正常工作,因为它会在文档中查看。

Where$('#umbi', parent)将在父上下文中搜索它并且即使该元素不是 DOM 的一部分也可以工作。

但是对于您的测试,您只需插入一个项目,您也可以通过div.childNodes[0].

于 2012-04-12T13:32:57.533 回答