<!DOCTYPE html>
<meta charset=utf-8>
<title>Node.cloneNode</title>
<link rel=help href="https://dom.spec.whatwg.org/#dom-node-clonenode">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id=log></div>
<script>
function assert_equal_node(nodeA, nodeB) {
assert_equals(nodeB.nodeType, nodeA.nodeType, "nodeType");
assert_equals(nodeB.nodeName, nodeA.nodeName, "nodeName");
if (nodeA.nodeType === Node.ELEMENT_NODE) {
assert_equals(nodeB.prefix, nodeA.prefix, "prefix");
assert_equals(nodeB.namespaceURI, nodeA.namespaceURI, "namespaceURI");
assert_equals(nodeB.localName, nodeA.localName, "localName");
assert_equals(nodeB.tagName, nodeA.tagName, "tagName");
assert_not_equals(nodeB.attributes != nodeA.attributes, "attributes");
assert_equals(nodeB.attributes.length, nodeA.attributes.length,
"attributes.length");
for (var i = 0, il = nodeA.attributes.length; i < il; ++i) {
assert_not_equals(nodeB.attributes[i], nodeA.attributes[i],
"attributes[" + i + "]");
assert_equals(nodeB.attributes[i].name, nodeA.attributes[i].name,
"attributes[" + i + "].name");
assert_equals(nodeB.attributes[i].prefix, nodeA.attributes[i].prefix,
"attributes[" + i + "].prefix");
assert_equals(nodeB.attributes[i].namespaceURI, nodeA.attributes[i].namespaceURI,
"attributes[" + i + "].namespaceURI");
assert_equals(nodeB.attributes[i].value, nodeA.attributes[i].value,
"attributes[" + i + "].value");
}
}
}
function check_copy(orig, copy, type) {
assert_not_equals(orig, copy, "Object equality");
assert_equal_node(orig, copy, "Node equality");
assert_true(orig instanceof type, "original instanceof " + type);
assert_true(copy instanceof type, "copy instanceof " + type);
}
function create_element_and_check(localName, typeName) {
test(function() {
assert_true(typeName in window, typeName + " is not supported");
var element = document.createElement(localName);
var copy = element.cloneNode();
check_copy(element, copy, window[typeName]);
}, "createElement(" + localName + ")");
}
// test1: createElement
create_element_and_check("a", "HTMLAnchorElement");
create_element_and_check("abbr", "HTMLElement");
create_element_and_check("acronym", "HTMLElement");
create_element_and_check("address", "HTMLElement");
create_element_and_check("area", "HTMLAreaElement");
create_element_and_check("article", "HTMLElement");
create_element_and_check("aside", "HTMLElement");
create_element_and_check("audio", "HTMLAudioElement");
create_element_and_check("b", "HTMLElement");
create_element_and_check("base", "HTMLBaseElement");
create_element_and_check("bdi", "HTMLElement");
create_element_and_check("bdo", "HTMLElement");
create_element_and_check("bgsound", "HTMLElement");
create_element_and_check("big", "HTMLElement");
create_element_and_check("blockquote","HTMLElement");
create_element_and_check("body", "HTMLBodyElement");
create_element_and_check("br", "HTMLBRElement");
create_element_and_check("button", "HTMLButtonElement");
create_element_and_check("canvas", "HTMLCanvasElement");
create_element_and_check("caption", "HTMLTableCaptionElement");
create_element_and_check("center", "HTMLElement");
create_element_and_check("cite", "HTMLElement");
create_element_and_check("code", "HTMLElement");
create_element_and_check("col", "HTMLTableColElement");
create_element_and_check("colgroup", "HTMLTableColElement");
create_element_and_check("data", "HTMLDataElement");
create_element_and_check("datalist", "HTMLDataListElement");
create_element_and_check("dialog", "HTMLDialogElement");
create_element_and_check("dd", "HTMLElement");
create_element_and_check("del", "HTMLModElement");
create_element_and_check("details", "HTMLElement");
create_element_and_check("dfn", "HTMLElement");
create_element_and_check("dir", "HTMLDirectoryElement");
create_element_and_check("div", "HTMLDivElement");
create_element_and_check("dl", "HTMLDListElement");
create_element_and_check("dt", "HTMLElement");
create_element_and_check("embed", "HTMLEmbedElement");
create_element_and_check("fieldset", "HTMLFieldSetElement");
create_element_and_check("figcaption","HTMLElement");
create_element_and_check("figure", "HTMLElement");
create_element_and_check("font", "HTMLFontElement");
create_element_and_check("footer", "HTMLElement");
create_element_and_check("form", "HTMLFormElement");
create_element_and_check("frame", "HTMLFrameElement");
create_element_and_check("frameset", "HTMLFrameSetElement");
create_element_and_check("h1", "HTMLHeadingElement");
create_element_and_check("h2", "HTMLHeadingElement");
create_element_and_check("h3", "HTMLHeadingElement");
create_element_and_check("h4", "HTMLHeadingElement");
create_element_and_check("h5", "HTMLHeadingElement");
create_element_and_check("h6", "HTMLHeadingElement");
create_element_and_check("head", "HTMLHeadElement");
create_element_and_check("header", "HTMLElement");
create_element_and_check("hgroup", "HTMLElement");
create_element_and_check("hr", "HTMLHRElement");
create_element_and_check("html", "HTMLHtmlElement");
create_element_and_check("i", "HTMLElement");
create_element_and_check("iframe", "HTMLIFrameElement");
create_element_and_check("img", "HTMLImageElement");
create_element_and_check("input", "HTMLInputElement");
create_element_and_check("ins", "HTMLModElement");
create_element_and_check("isindex", "HTMLElement");
create_element_and_check("kbd", "HTMLElement");
create_element_and_check("label", "HTMLLabelElement");
create_element_and_check("legend", "HTMLLegendElement");
create_element_and_check("li", "HTMLLIElement");
create_element_and_check("link", "HTMLLinkElement");
create_element_and_check("main", "HTMLElement");
create_element_and_check("map", "HTMLMapElement");
create_element_and_check("mark", "HTMLElement");
create_element_and_check("marquee", "HTMLElement");
create_element_and_check("meta", "HTMLMetaElement");
create_element_and_check("meter", "HTMLMeterElement");
create_element_and_check("nav", "HTMLElement");
create_element_and_check("nobr", "HTMLElement");
create_element_and_check("noframes", "HTMLElement");
create_element_and_check("noscript", "HTMLElement");
create_element_and_check("object", "HTMLObjectElement");
create_element_and_check("ol", "HTMLOListElement");
create_element_and_check("optgroup", "HTMLOptGroupElement");
create_element_and_check("option", "HTMLOptionElement");
create_element_and_check("output", "HTMLOutputElement");
create_element_and_check("p", "HTMLParagraphElement");
create_element_and_check("param", "HTMLParamElement");
create_element_and_check("pre", "HTMLPreElement");
create_element_and_check("progress", "HTMLProgressElement");
create_element_and_check("q", "HTMLQuoteElement");
create_element_and_check("rp", "HTMLElement");
create_element_and_check("rt", "HTMLElement");
create_element_and_check("ruby", "HTMLElement");
create_element_and_check("s", "HTMLElement");
create_element_and_check("samp", "HTMLElement");
create_element_and_check("script", "HTMLScriptElement");
create_element_and_check("section", "HTMLElement");
create_element_and_check("select", "HTMLSelectElement");
create_element_and_check("small", "HTMLElement");
create_element_and_check("source", "HTMLSourceElement");
create_element_and_check("spacer", "HTMLElement");
create_element_and_check("span", "HTMLSpanElement");
create_element_and_check("strike", "HTMLElement");
create_element_and_check("style", "HTMLStyleElement");
create_element_and_check("sub", "HTMLElement");
create_element_and_check("summary", "HTMLElement");
create_element_and_check("sup", "HTMLElement");
create_element_and_check("table", "HTMLTableElement");
create_element_and_check("tbody", "HTMLTableSectionElement");
create_element_and_check("td", "HTMLTableCellElement");
create_element_and_check("template", "HTMLTemplateElement");
create_element_and_check("textarea", "HTMLTextAreaElement");
create_element_and_check("th", "HTMLTableCellElement");
create_element_and_check("time", "HTMLTimeElement");
create_element_and_check("title", "HTMLTitleElement");
create_element_and_check("tr", "HTMLTableRowElement");
create_element_and_check("tt", "HTMLElement");
create_element_and_check("track", "HTMLTrackElement");
create_element_and_check("u", "HTMLElement");
create_element_and_check("ul", "HTMLUListElement");
create_element_and_check("var", "HTMLElement");
create_element_and_check("video", "HTMLVideoElement");
create_element_and_check("unknown", "HTMLUnknownElement");
create_element_and_check("wbr", "HTMLElement");
test(function() {
var fragment = document.createDocumentFragment();
var copy = fragment.cloneNode();
check_copy(fragment, copy, DocumentFragment);
}, "createDocumentFragment");
test(function() {
var text = document.createTextNode("hello world");
var copy = text.cloneNode();
check_copy(text, copy, Text);
assert_equals(text.data, copy.data);
assert_equals(text.wholeText, copy.wholeText);
}, "createTextNode");
test(function() {
var comment = document.createComment("a comment");
var copy = comment.cloneNode();
check_copy(comment, copy, Comment);
assert_equals(comment.data, copy.data);
}, "createComment");
test(function() {
var el = document.createElement("foo");
el.setAttribute("a", "b");
el.setAttribute("c", "d");
var c = el.cloneNode();
check_copy(el, c, Element);
}, "createElement with attributes")
test(function() {
var el = document.createElementNS("http://www.w3.org/1999/xhtml", "foo:div");
var c = el.cloneNode();
check_copy(el, c, HTMLDivElement);
}, "createElementNS HTML")
test(function() {
var el = document.createElementNS("http://www.example.com/", "foo:div");
var c = el.cloneNode();
check_copy(el, c, Element);
}, "createElementNS non-HTML")
test(function() {
var pi = document.createProcessingInstruction("target", "data");
var copy = pi.cloneNode();
check_copy(pi, copy, ProcessingInstruction);
assert_equals(pi.data, copy.data, "data");
assert_equals(pi.target, pi.target, "target");
}, "createProcessingInstruction");
test(function() {
var attr = document.createAttribute("class");
var copy = attr.cloneNode();
check_copy(attr, copy, Attr);
assert_equals(attr.namespaceURI, copy.namespaceURI);
assert_equals(attr.prefix, copy.prefix);
assert_equals(attr.localName, copy.localName);
assert_equals(attr.value, copy.value);
attr.value = "abc";
assert_equals(attr.namespaceURI, copy.namespaceURI);
assert_equals(attr.prefix, copy.prefix);
assert_equals(attr.localName, copy.localName);
assert_not_equals(attr.value, copy.value);
var copy2 = attr.cloneNode();
check_copy(attr, copy2, Attr);
assert_equals(attr.namespaceURI, copy.namespaceURI);
assert_equals(attr.prefix, copy.prefix);
assert_equals(attr.localName, copy2.localName);
assert_equals(attr.value, copy2.value);
}, "createAttribute");
test(function() {
var attr = document.createAttributeNS("http://www.w3.org/1999/xhtml", "foo:class");
var copy = attr.cloneNode();
check_copy(attr, copy, Attr);
assert_equals(attr.namespaceURI, copy.namespaceURI);
assert_equals(attr.prefix, copy.prefix);
assert_equals(attr.localName, copy.localName);
assert_equals(attr.value, copy.value);
attr.value = "abc";
assert_equals(attr.namespaceURI, copy.namespaceURI);
assert_equals(attr.prefix, copy.prefix);
assert_equals(attr.localName, copy.localName);
assert_not_equals(attr.value, copy.value);
var copy2 = attr.cloneNode();
check_copy(attr, copy2, Attr);
assert_equals(attr.namespaceURI, copy.namespaceURI);
assert_equals(attr.prefix, copy.prefix);
assert_equals(attr.localName, copy2.localName);
assert_equals(attr.value, copy2.value);
}, "createAttributeNS");
test(function() {
var doctype = document.implementation.createDocumentType("html", "public", "system");
var copy = doctype.cloneNode();
check_copy(doctype, copy, DocumentType);
assert_equals(doctype.name, copy.name, "name");
assert_equals(doctype.publicId, copy.publicId, "publicId");
assert_equals(doctype.systemId, copy.systemId, "systemId");
}, "implementation.createDocumentType");
test(function() {
var doc = document.implementation.createDocument(null, null);
var copy = doc.cloneNode();
check_copy(doc, copy, Document);
assert_equals(doc.charset, "UTF-8", "charset value");
assert_equals(doc.charset, copy.charset, "charset equality");
assert_equals(doc.contentType, "application/xml", "contentType value");
assert_equals(doc.contentType, copy.contentType, "contentType equality");
assert_equals(doc.URL, "about:blank", "URL value")
assert_equals(doc.URL, copy.URL, "URL equality");
assert_equals(doc.compatMode, "CSS1Compat", "compatMode value");
assert_equals(doc.compatMode, copy.compatMode, "compatMode equality");
}, "implementation.createDocument");
test(function() {
var html = document.implementation.createHTMLDocument("title");
var copy = html.cloneNode();
check_copy(html, copy, Document);
assert_equals(copy.title, "", "title value");
}, "implementation.createHTMLDocument");
test(function() {
var parent = document.createElement("div");
var child1 = document.createElement("div");
var child2 = document.createElement("div");
var grandChild = document.createElement("div");
child2.appendChild(grandChild);
parent.appendChild(child1);
parent.appendChild(child2);
var deep = true;
var copy = parent.cloneNode(deep);
check_copy(parent, copy, HTMLDivElement);
assert_equals(copy.childNodes.length, 2,
"copy.childNodes.length with deep copy");
check_copy(child1, copy.childNodes[0], HTMLDivElement);
assert_equals(copy.childNodes[0].childNodes.length, 0,
"copy.childNodes[0].childNodes.length");
check_copy(child2, copy.childNodes[1], HTMLDivElement);
assert_equals(copy.childNodes[1].childNodes.length, 1,
"copy.childNodes[1].childNodes.length");
check_copy(grandChild, copy.childNodes[1].childNodes[0], HTMLDivElement);
deep = false;
copy = parent.cloneNode(deep);
check_copy(parent, copy, HTMLDivElement);
assert_equals(copy.childNodes.length, 0,
"copy.childNodes.length with non-deep copy");
}, "node with children");
test(() => {
const proto = Object.create(HTMLElement.prototype),
node = document.createElement("hi");
Object.setPrototypeOf(node, proto);
assert_true(proto.isPrototypeOf(node));
const clone = node.cloneNode();
assert_false(proto.isPrototypeOf(clone));
assert_true(HTMLUnknownElement.prototype.isPrototypeOf(clone));
const deepClone = node.cloneNode(true);
assert_false(proto.isPrototypeOf(deepClone));
assert_true(HTMLUnknownElement.prototype.isPrototypeOf(deepClone));
}, "Node with custom prototype")
</script>
Codebase Browser
chromium