gecko/dom/tests/mochitest/webcomponents/test_template_xhtml.html

47 lines
2.0 KiB
HTML

<!DOCTYPE HTML>
<html>
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=1011831
-->
<head>
<title>Test for template element</title>
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1011831">Bug 1011831</a>
<script>
var docSrc =
'<!DOCTYPE html>' +
'<html xmlns="http://www.w3.org/1999/xhtml">' +
'<body>' +
'<template id="t">Content<span>Content</span></template>' +
'<div id="container"><template>One</template><div>Two</div></div>' +
'<template id="t2"></template>' +
'</body>' +
'</html>';
var doc = (new DOMParser()).parseFromString(docSrc, 'application/xhtml+xml');
var t = doc.getElementById("t");
is(t.childNodes.length, 0, "Template should have no children.");
is(t.content.childNodes.length, 2, "Template content should have two children, text node and a span.");
// Test serialization of template element.
is(t.innerHTML, 'Content<span xmlns="http://www.w3.org/1999/xhtml">Content</span>', "Template contents should be serialized.");
is(t.outerHTML, '<template xmlns="http://www.w3.org/1999/xhtml" id="t">Content<span>Content</span></template>', "Template contents should be serialized.");
var c = doc.getElementById("container");
is(c.innerHTML, '<template xmlns="http://www.w3.org/1999/xhtml">One</template><div xmlns="http://www.w3.org/1999/xhtml">Two</div>', "Template contents should be serialized.");
is(c.outerHTML, '<div xmlns="http://www.w3.org/1999/xhtml" id="container"><template>One</template><div>Two</div></div>', "Template contents should be serialized.");
// Test setting innerHTML on template element.
var t2 = doc.getElementById("t2");
t2.innerHTML = 'Three<span>Four</span>';
is(t2.childNodes.length, 0, "Setting innerHTML should append children into template content.");
is(t2.content.childNodes.length, 2, "Setting innerHTML should append children into template content.");
</script>
</body>
</html>