1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/tests/mochitest/webcomponents/test_template.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,153 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<!--
1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id=818976
1.8 +-->
1.9 +<head>
1.10 + <title>Test for template element</title>
1.11 + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
1.12 + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
1.13 + <script>
1.14 + function shouldNotCall() {
1.15 + ok(false, "Template contents should be inert.");
1.16 + }
1.17 + </script>
1.18 + <template>
1.19 + <script>
1.20 + shouldNotCall();
1.21 + </script>
1.22 + </template>
1.23 +</head>
1.24 +<body>
1.25 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=818976">Bug 818976</a>
1.26 +<template id="grabme"><div id="insidetemplate"></div></template>
1.27 +<template id="justtemplate"></template>
1.28 +<template id="first">Hi<template>Bye</template></template>
1.29 +<div><template id="second"><span></span></template></div>
1.30 +<template id="cloneme"><span>I want a clone</span><span>me too</span></template>
1.31 +<template id="cycleone"></template>
1.32 +<template id="cycletwo"><template></template></template>
1.33 +<template id="cyclethree"></template>
1.34 +<template id="cyclefour"><template></template></template>
1.35 +<template id="appendtome"></template>
1.36 +<template id="insertinme"></template>
1.37 +<template>
1.38 + <script>
1.39 + shouldNotCall();
1.40 + </script>
1.41 +</template>
1.42 +<div id="fillme"></div>
1.43 +<script>
1.44 +var templateEl = document.getElementById("grabme");
1.45 +ok(templateEl, "template element should be in document.");
1.46 +is(window.getComputedStyle(templateEl).display, "none", "Template element should not be visible.");
1.47 +ok(!document.getElementById("insidetemplate"), "Template content should not be in document.");
1.48 +is(templateEl.childNodes.length, 0, "Template element should have no children.");
1.49 +is(templateEl.content.childNodes.length, 1, "Template content should have 1 child <div>.");
1.50 +
1.51 +// Make sure that template is owned by different document.
1.52 +ok(templateEl.content.ownerDocument != templateEl.ownerDocument, "Template should be in a different document because the current document has a browsing context.");
1.53 +var otherTemplateEl = document.getElementById("first");
1.54 +is(templateEl.content.ownerDocument, otherTemplateEl.content.ownerDocument, "Template contents within the same document should be owned by the same template contents owner.");
1.55 +
1.56 +var htmlDoc = document.implementation.createHTMLDocument();
1.57 +var otherDocTemplateEl = htmlDoc.createElement("template");
1.58 +isnot(otherDocTemplateEl.content.ownerDocument, htmlDoc, "Template content owner should be a new document.");
1.59 +
1.60 +var templateOwnerDoc = otherDocTemplateEl.content.ownerDocument;
1.61 +var docCreatedTemplateEl = templateOwnerDoc.createElement("template");
1.62 +is(docCreatedTemplateEl.content.ownerDocument, templateOwnerDoc, "Template content owner of template elements created by a template document should be the template document.");
1.63 +
1.64 +// Tests for XMLSerializer
1.65 +templateEl = document.getElementById("justtemplate");
1.66 +var serializer = new XMLSerializer();
1.67 +is(serializer.serializeToString(templateEl), '<template xmlns="http://www.w3.org/1999/xhtml" id="justtemplate"></template>', "XMLSerializer should serialize template element.");
1.68 +
1.69 +templateEl = document.getElementById("first");
1.70 +is(serializer.serializeToString(templateEl), '<template xmlns="http://www.w3.org/1999/xhtml" id="first">Hi<template>Bye</template></template>', "XMLSerializer should serialize template content.");
1.71 +
1.72 +// Tests for innerHTML.
1.73 +is(templateEl.innerHTML, 'Hi<template>Bye</template>', "innerHTML should serialize content.");
1.74 +// Tests for outerHTML, not specified but should do something reasonable.
1.75 +is(templateEl.outerHTML, '<template id="first">Hi<template>Bye</template></template>', "outerHTML should serialize content.");
1.76 +
1.77 +templateEl.innerHTML = "Hello";
1.78 +is(templateEl.innerHTML, "Hello", "innerHTML of template should be set to 'Hello'");
1.79 +is(templateEl.childNodes.length, 0, "Template element should have no children.");
1.80 +is(templateEl.content.childNodes.length, 1, "Template content should have 'Hello' as child.");
1.81 +
1.82 +// Test for innerHTML on parent of template element.
1.83 +var templateParent = document.getElementById("second").parentNode;
1.84 +is(templateParent.innerHTML, '<template id="second"><span></span></template>', "InnerHTML on parent of template element should serialize template and template content.");
1.85 +
1.86 +templateEl.innerHTML = '<template id="inner">Hello</template>';
1.87 +ok(templateEl.content.childNodes[0] instanceof HTMLTemplateElement, "Template content should have <template> as child.");
1.88 +is(templateEl.content.childNodes[0].childNodes.length, 0, "Parsed temlate element should have no children.");
1.89 +is(templateEl.content.childNodes[0].content.childNodes.length, 1, "Parsed temlate element should have 'Hello' in content.");
1.90 +
1.91 +// Test cloning.
1.92 +templateEl = document.getElementById("cloneme");
1.93 +var nonDeepClone = templateEl.cloneNode(false);
1.94 +is(nonDeepClone.childNodes.length, 0, "There should be no children on the clone.");
1.95 +is(nonDeepClone.content.childNodes.length, 0, "Content should not be cloned.");
1.96 +var deepClone = templateEl.cloneNode(true);
1.97 +is(deepClone.childNodes.length, 0, "There should be no children on the clone.");
1.98 +is(deepClone.content.childNodes.length, 2, "The content should be cloned.");
1.99 +
1.100 +// Append content into a node.
1.101 +var parentEl = document.getElementById("fillme");
1.102 +parentEl.appendChild(templateEl.content);
1.103 +is(parentEl.childNodes.length, 2, "Parent should be appended with cloned content.");
1.104 +
1.105 +// Test exceptions thrown for cycles.
1.106 +templateEl = document.getElementById("cycleone");
1.107 +try {
1.108 + templateEl.content.appendChild(templateEl);
1.109 + ok(false, "Exception should be thrown when creating cycles in template content.");
1.110 +} catch (ex) {
1.111 + ok(true, "Exception should be thrown when creating cycles in template content.");
1.112 +}
1.113 +
1.114 +templateEl = document.getElementById("cycletwo");
1.115 +try {
1.116 + // Append template to template content within the template content.
1.117 + templateEl.content.childNodes[0].content.appendChild(templateEl);
1.118 + ok(false, "Exception should be thrown when creating cycles in template content.");
1.119 +} catch (ex) {
1.120 + ok(true, "Exception should be thrown when creating cycles in template content.");
1.121 +}
1.122 +
1.123 +templateEl = document.getElementById("cyclethree");
1.124 +try {
1.125 + templateEl.appendChild(templateEl);
1.126 + ok(false, "Exception should be thrown when creating cycles in hierarchy.");
1.127 +} catch (ex) {
1.128 + ok(true, "Exception should be thrown when creating cycles in hierarchy.");
1.129 +}
1.130 +
1.131 +templateEl = document.getElementById("cyclefour");
1.132 +try {
1.133 + templateEl.content.childNodes[0].appendChild(templateEl);
1.134 + ok(false, "Exception should be thrown when creating cycles in hierarchy.");
1.135 +} catch (ex) {
1.136 + ok(true, "Exception should be thrown when creating cycles in hierarchy.");
1.137 +}
1.138 +
1.139 +templateEl = document.getElementById("insertinme");
1.140 +var sentinel = document.createElement("div");
1.141 +try {
1.142 + templateEl.content.appendChild(sentinel);
1.143 + templateEl.content.insertBefore(templateEl, sentinel);
1.144 + ok(false, "Exception should be thrown when creating cycles in hierarchy.");
1.145 +} catch (ex) {
1.146 + ok(true, "Exception should be thrown when creating cycles in hierarchy.");
1.147 +}
1.148 +
1.149 +// Appending normal stuff into content should work.
1.150 +templateEl = document.getElementById("appendtome");
1.151 +templateEl.content.appendChild(document.createElement("div"));
1.152 +is(templateEl.content.childNodes.length, 1, "Template should have div element appended as child");
1.153 +
1.154 +</script>
1.155 +</body>
1.156 +</html>
