define([
'intern!object',
'intern/chai!assert',
'sinon',
'../../dom-construct',
'../../dom-attr',
'../../has'
], function (registerSuite, assert, sinon, domConstruct, domAttr, has) {
var baseId = "dom-construct",
uniqueId = 0;
function getId() {
return baseId + uniqueId++;
}
registerSuite({
name: 'dojo/dom-construct',
"toDom": (function () {
return {
"returns expected node when one requested": function () {
//arrange
var rawHTML = "
";
//act
var result = domConstruct.toDom(rawHTML);
//assert
assert.equal(result.nodeName.toLowerCase(), "div");
},
"returns expected result when tree requested": function () {
//arrange
var parent = document.createElement("div"),
child = document.createElement("span");
parent.appendChild(child);
//act
var result = domConstruct.toDom(parent.outerHTML);
//assert
assert.equal(result.outerHTML, result.outerHTML);
},
"returns expected result when forest requested": function () {
//arrange
var parent = document.createElement("div"),
children =
[
document.createElement("span"),
document.createElement("span")
];
for (var i in children) {
parent.appendChild(children[i]);
}
//act
var result = domConstruct.toDom(parent.innerHTML);
//assert
assert.equal(result.outerHTML, result.innerHTML);
},
"able to create tag, which must be created in context of ": function () {
//arrange
var node = "";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "option");
},
"able to create tag, which must be created in context of
": function () {
//arrange
var node = "";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "tbody");
},
"able to create tag, which must be created in context of
": function () {
//arrange
var node = "";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "thead");
},
"able to create tag, which must be created in context of
": function () {
//arrange
var node = "";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "tfoot");
},
"able to create
tag, which must be created in context of
": function () {
//arrange
var node = "
";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "tr");
},
"able to create
tag, which must be created in context of
": function () {
//arrange
var node = "
";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "td");
},
"able to create
tag, which must be created in context of
": function () {
//arrange
var node = "
";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "th");
},
"able to create tag, which must be created in context of ": function () {
//arrange
var node = "";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "legend");
},
"able to create
tag, which must be created in context of
": function () {
//arrange
var node = "
";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "caption");
},
"able to create
tag, which must be created in context of
": function () {
//arrange
var node = "
";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "colgroup");
},
"able to create
tag, which must be created in context of
": function () {
//arrange
var node = "
";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "col");
},
"able to create tag, which must be created in context of
": function () {
//arrange
var node = "";
//act
var result = domConstruct.toDom(node);
//assert
assert.equal(result.nodeName.toLowerCase(), "li");
},
};
})(),
"place": (function () {
return {
"when first arg is rawHTML, then it is converted to DOM and placed": function () {
//arrange
var container = document.createElement("div"),
child = document.createElement("span"),
reference = document.createElement("h1");
container.appendChild(child);
//act
domConstruct.place(container.outerHTML, reference, "only");
//assert
assert.equal(reference.firstElementChild.nodeName, container.nodeName);
assert.equal(reference.firstElementChild.firstElementChild.nodeName, child.nodeName);
},
"when first arg is a node id, then the correct node is placed": function () {
//arrange
var node = document.createElement("div"),
reference = document.createElement("h1"),
nodeId = getId();
node.id = nodeId;
document.body.appendChild(node);
//act
domConstruct.place(nodeId, reference, "only");
//assert
assert.equal(reference.firstElementChild.nodeName, node.nodeName);
},
"when first arg is a node, then it is placed": function () {
//arrange
var node = document.createElement("div"),
reference = document.createElement("h1");
document.body.appendChild(node);
//act
domConstruct.place(node, reference, "only");
//assert
assert.equal(reference.firstElementChild.nodeName, node.nodeName);
},
"when second arg is a string, then the node with that id is used as reference": function () {
//arrange
var node = document.createElement("div"),
reference = document.createElement("h1"),
referenceId = getId();
document.body.appendChild(reference);
reference.id = referenceId;
//act
domConstruct.place(node, referenceId, "only");
//assert
assert.equal(reference.firstElementChild.nodeName, node.nodeName);
},
"when second arg is a node, then it is used as the reference node": function () {
//arrange
var node = document.createElement("div"),
reference = document.createElement("h1");
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, "only");
//assert
assert.equal(reference.firstElementChild.nodeName, node.nodeName);
},
"when third argument is 'before', then the first arg is placed before the second": function () {
//arrange
var node = document.createElement("div"),
reference = document.createElement("h1");
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, "before");
//assert
assert.equal(reference.previousSibling.nodeName, node.nodeName);
},
"when third argument is 'after', then the first arg is placed after the second": function () {
//arrange
var node = document.createElement("div"),
reference = document.createElement("h1");
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, "after");
//assert
assert.equal(reference.nextSibling.nodeName, node.nodeName);
},
"when third argument is 'replace', then the first arg replaces the second": function () {
//arrange
var container = document.createElement("div"),
node = document.createElement("span"),
reference = document.createElement("h1");
document.body.appendChild(container);
container.appendChild(reference);
//act
domConstruct.place(node, reference, "replace");
//assert
assert.equal(container.firstElementChild.nodeName, node.nodeName);
},
"when third argument is 'only', then the first arg is placed as only content of second": function () {
//arrange
var node = document.createElement("span"),
reference = document.createElement("h1"),
children =
[
document.createElement("button"),
document.createElement("button"),
document.createElement("button")
];
for (var i in children) {
reference.appendChild(children[i]);
}
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, "only");
//assert
assert.equal(reference.firstElementChild.nodeName, node.nodeName);
assert.equal(reference.children.length, 1);
},
"when third argument is 'first', then the first arg is placed as first child of second": function () {
//arrange
var node = document.createElement("span"),
reference = document.createElement("h1"),
children =
[
document.createElement("button"),
document.createElement("button"),
document.createElement("button")
];
for (var i in children) {
reference.appendChild(children[i]);
}
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, "first");
//assert
assert.equal(reference.firstElementChild.nodeName, node.nodeName);
assert.equal(reference.children.length, children.length + 1);
},
"when third argument is 'last', then the first arg is placed as last child of second": function () {
//arrange
var node = document.createElement("span"),
reference = document.createElement("h1"),
children =
[
document.createElement("button"),
document.createElement("button"),
document.createElement("button")
];
for (var i in children) {
reference.appendChild(children[i]);
}
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, "last");
//assert
assert.equal(reference.lastElementChild.nodeName, node.nodeName);
assert.equal(reference.children.length, children.length + 1);
},
"when third argument is a number, then the first arg is placed as the correct child of second": function () {
//arrange
var node = document.createElement("span"),
reference = document.createElement("h1"),
children =
[
document.createElement("button"),
document.createElement("button"),
document.createElement("button")
],
position = 2;
for (var i in children) {
reference.appendChild(children[i]);
}
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, position);
//assert
assert.equal(reference.children[position].nodeName, node.nodeName);
assert.equal(reference.children.length, children.length + 1);
},
"when third argument is a number and the reference node is empty, then the first arg is placed as the first child of second": function () {
//arrange
var node = document.createElement("span"),
reference = document.createElement("h1"),
position = 2;
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, position);
//assert
assert.equal(reference.firstElementChild.nodeName, node.nodeName);
assert.equal(reference.children.length, 1);
},
"when third argument is a number that is greater than the number of children in the reference, then the first arg is placed as the first child of second": function () {
//arrange
var node = document.createElement("span"),
reference = document.createElement("h1"),
children =
[
document.createElement("button"),
document.createElement("button"),
document.createElement("button")
],
position = children + 42;
for (var i in children) {
reference.appendChild(children[i]);
}
document.body.appendChild(reference);
//act
domConstruct.place(node, reference, position);
//assert
assert.equal(reference.lastElementChild.nodeName, node.nodeName);
assert.equal(reference.children.length, children.length + 1);
}
};
})(),
"create": (function () {
return {
"when first arg is a string, then correct element type is created": function () {
//arrange
var tagType = "div";
//act
var result = domConstruct.create(tagType);
//assert
assert.equal(result.nodeName.toLowerCase(), tagType);
},
"when attributes provided, then dojo/dom-attr:set called with correct args": function () {
//arrange
var tag = document.createElement("div"),
attrs = { foo: "bar", baz: "buz" },
mock = sinon.spy(domAttr, "set");
//act
domConstruct.create(tag, attrs);
//assert
assert.isTrue(mock.calledWith(tag, attrs));
mock.restore();
},
"when reference node provided, then dojo/dom-construct::place() called with correct args": function () {
//arrange
var tag = document.createElement("div"),
reference = document.createElement("h1"),
position = "only",
mock = sinon.spy(domConstruct, "place");
//act
domConstruct.create(tag, null, reference, position);
//assert
assert.isTrue(mock.calledWith(tag, reference, position));
mock.restore();
},
"when reference node not part of global document, then new element created in correct context": function () {
//arrange
var iframe = document.createElement("iframe");
document.body.appendChild(iframe);
tagType = "div",
reference = iframe.contentDocument.createElement("h1"),
position = "only";
//act
var result = domConstruct.create(tagType, null, reference, position);
//assert
assert.equal(result.ownerDocument, iframe.contentDocument);
}
};
})(),
"empty": (function () {
return {
"when given a node's id, then the related node is emptied": function () {
//arrange
var container = document.createElement("div"),
child = document.createElement("button"),
id = getId();
container.id = id;
container.appendChild(child);
document.body.appendChild(container);
//act
domConstruct.empty(id);
//assert
assert.equal(container.children.length, 0);
},
"when given a node, then it is emptied": function () {
//arrange
var container = document.createElement("div"),
child = document.createElement("button");
container.appendChild(child);
//act
domConstruct.empty(container);
//assert
assert.equal(container.children.length, 0);
},
"when given an svg element, then it is emptied": function () {
//arrange
var container = document.createElement("div"),
svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.innerHTML = "";
//act
domConstruct.empty(svg);
//assert
if (svg.children == null) {
// IE does not support children property on