dom/tests/mochitest/webcomponents/test_template.html@6474c204b198
dom/tests/mochitest/webcomponents/test_template.html
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
1 <!DOCTYPE HTML>
2 <html>
3 <!--
4 https://bugzilla.mozilla.org/show_bug.cgi?id=818976
5 -->
6 <head>
7 <title>Test for template element</title>
8 <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
10 <script>
11 function shouldNotCall() {
12 ok(false, "Template contents should be inert.");
13 }
14 </script>
15 <template>
16 <script>
17 shouldNotCall();
18 </script>
19 </template>
20 </head>
21 <body>
22 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=818976">Bug 818976</a>
23 <template id="grabme"><div id="insidetemplate"></div></template>
24 <template id="justtemplate"></template>
25 <template id="first">Hi<template>Bye</template></template>
26 <div><template id="second"><span></span></template></div>
27 <template id="cloneme"><span>I want a clone</span><span>me too</span></template>
28 <template id="cycleone"></template>
29 <template id="cycletwo"><template></template></template>
30 <template id="cyclethree"></template>
31 <template id="cyclefour"><template></template></template>
32 <template id="appendtome"></template>
33 <template id="insertinme"></template>
34 <template>
35 <script>
36 shouldNotCall();
37 </script>
38 </template>
39 <div id="fillme"></div>
40 <script>
41 var templateEl = document.getElementById("grabme");
42 ok(templateEl, "template element should be in document.");
43 is(window.getComputedStyle(templateEl).display, "none", "Template element should not be visible.");
44 ok(!document.getElementById("insidetemplate"), "Template content should not be in document.");
45 is(templateEl.childNodes.length, 0, "Template element should have no children.");
46 is(templateEl.content.childNodes.length, 1, "Template content should have 1 child <div>.");
48 // Make sure that template is owned by different document.
49 ok(templateEl.content.ownerDocument != templateEl.ownerDocument, "Template should be in a different document because the current document has a browsing context.");
50 var otherTemplateEl = document.getElementById("first");
51 is(templateEl.content.ownerDocument, otherTemplateEl.content.ownerDocument, "Template contents within the same document should be owned by the same template contents owner.");
53 var htmlDoc = document.implementation.createHTMLDocument();
54 var otherDocTemplateEl = htmlDoc.createElement("template");
55 isnot(otherDocTemplateEl.content.ownerDocument, htmlDoc, "Template content owner should be a new document.");
57 var templateOwnerDoc = otherDocTemplateEl.content.ownerDocument;
58 var docCreatedTemplateEl = templateOwnerDoc.createElement("template");
59 is(docCreatedTemplateEl.content.ownerDocument, templateOwnerDoc, "Template content owner of template elements created by a template document should be the template document.");
61 // Tests for XMLSerializer
62 templateEl = document.getElementById("justtemplate");
63 var serializer = new XMLSerializer();
64 is(serializer.serializeToString(templateEl), '<template xmlns="http://www.w3.org/1999/xhtml" id="justtemplate"></template>', "XMLSerializer should serialize template element.");
66 templateEl = document.getElementById("first");
67 is(serializer.serializeToString(templateEl), '<template xmlns="http://www.w3.org/1999/xhtml" id="first">Hi<template>Bye</template></template>', "XMLSerializer should serialize template content.");
69 // Tests for innerHTML.
70 is(templateEl.innerHTML, 'Hi<template>Bye</template>', "innerHTML should serialize content.");
71 // Tests for outerHTML, not specified but should do something reasonable.
72 is(templateEl.outerHTML, '<template id="first">Hi<template>Bye</template></template>', "outerHTML should serialize content.");
74 templateEl.innerHTML = "Hello";
75 is(templateEl.innerHTML, "Hello", "innerHTML of template should be set to 'Hello'");
76 is(templateEl.childNodes.length, 0, "Template element should have no children.");
77 is(templateEl.content.childNodes.length, 1, "Template content should have 'Hello' as child.");
79 // Test for innerHTML on parent of template element.
80 var templateParent = document.getElementById("second").parentNode;
81 is(templateParent.innerHTML, '<template id="second"><span></span></template>', "InnerHTML on parent of template element should serialize template and template content.");
83 templateEl.innerHTML = '<template id="inner">Hello</template>';
84 ok(templateEl.content.childNodes[0] instanceof HTMLTemplateElement, "Template content should have <template> as child.");
85 is(templateEl.content.childNodes[0].childNodes.length, 0, "Parsed temlate element should have no children.");
86 is(templateEl.content.childNodes[0].content.childNodes.length, 1, "Parsed temlate element should have 'Hello' in content.");
88 // Test cloning.
89 templateEl = document.getElementById("cloneme");
90 var nonDeepClone = templateEl.cloneNode(false);
91 is(nonDeepClone.childNodes.length, 0, "There should be no children on the clone.");
92 is(nonDeepClone.content.childNodes.length, 0, "Content should not be cloned.");
93 var deepClone = templateEl.cloneNode(true);
94 is(deepClone.childNodes.length, 0, "There should be no children on the clone.");
95 is(deepClone.content.childNodes.length, 2, "The content should be cloned.");
97 // Append content into a node.
98 var parentEl = document.getElementById("fillme");
99 parentEl.appendChild(templateEl.content);
100 is(parentEl.childNodes.length, 2, "Parent should be appended with cloned content.");
102 // Test exceptions thrown for cycles.
103 templateEl = document.getElementById("cycleone");
104 try {
105 templateEl.content.appendChild(templateEl);
106 ok(false, "Exception should be thrown when creating cycles in template content.");
107 } catch (ex) {
108 ok(true, "Exception should be thrown when creating cycles in template content.");
109 }
111 templateEl = document.getElementById("cycletwo");
112 try {
113 // Append template to template content within the template content.
114 templateEl.content.childNodes[0].content.appendChild(templateEl);
115 ok(false, "Exception should be thrown when creating cycles in template content.");
116 } catch (ex) {
117 ok(true, "Exception should be thrown when creating cycles in template content.");
118 }
120 templateEl = document.getElementById("cyclethree");
121 try {
122 templateEl.appendChild(templateEl);
123 ok(false, "Exception should be thrown when creating cycles in hierarchy.");
124 } catch (ex) {
125 ok(true, "Exception should be thrown when creating cycles in hierarchy.");
126 }
128 templateEl = document.getElementById("cyclefour");
129 try {
130 templateEl.content.childNodes[0].appendChild(templateEl);
131 ok(false, "Exception should be thrown when creating cycles in hierarchy.");
132 } catch (ex) {
133 ok(true, "Exception should be thrown when creating cycles in hierarchy.");
134 }
136 templateEl = document.getElementById("insertinme");
137 var sentinel = document.createElement("div");
138 try {
139 templateEl.content.appendChild(sentinel);
140 templateEl.content.insertBefore(templateEl, sentinel);
141 ok(false, "Exception should be thrown when creating cycles in hierarchy.");
142 } catch (ex) {
143 ok(true, "Exception should be thrown when creating cycles in hierarchy.");
144 }
146 // Appending normal stuff into content should work.
147 templateEl = document.getElementById("appendtome");
148 templateEl.content.appendChild(document.createElement("div"));
149 is(templateEl.content.childNodes.length, 1, "Template should have div element appended as child");
151 </script>
152 </body>
153 </html>
