template-contents.html (6320B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>HTML Templates: The template contents is a DocumentFragment</title> 5 <meta name="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> 6 <meta name="assert" content="The template contents must be a DocumentFragment"> 7 <link rel="help" href="http://www.w3.org/TR/2013/WD-html-templates-20130214/#definitions"> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <script src='/html/resources/common.js'></script> 11 </head> 12 <body> 13 <div id="log"></div> 14 <script type="text/javascript"> 15 16 17 test(function() { 18 var doc = newHTMLDocument(); 19 var template = doc.createElement('template'); 20 21 doc.body.appendChild(template); 22 23 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 24 'Template content should be a DocumentFragment'); 25 26 assert_class_string(template.content, 'DocumentFragment', 27 'Template content class should be a DocumentFragment'); 28 29 }, 'The template contents must be a DocumentFragment (empty template)'); 30 31 32 test(function() { 33 var doc = newHTMLDocument(); 34 var template = doc.createElement('template'); 35 36 template.innerHTML = '<div>This is a div</div><span>This is a span</span>'; 37 38 doc.body.appendChild(template); 39 40 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 41 'Template content should be a DocumentFragment'); 42 43 assert_class_string(template.content, 'DocumentFragment', 44 'Template content class should be a DocumentFragment'); 45 46 }, 'The template contents must be a DocumentFragment (non empty template)'); 47 48 49 50 test(function() { 51 var doc = newHTMLDocument(); 52 var template = doc.createElement('template'); 53 54 template.innerHTML = '<div>This is a div</div>'; 55 56 doc.body.appendChild(template); 57 58 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 59 'Template content should be a documentFragment'); 60 61 }, 'The template contents must be a DocumentFragment (non empty template ' 62 + 'containing div which is an Element instance)'); 63 64 65 test(function() { 66 var doc = newHTMLDocument(); 67 var template = doc.createElement('template'); 68 69 template.innerHTML = 'Some text'; 70 71 doc.body.appendChild(template); 72 73 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 74 'Template content should be a documentFragment'); 75 76 assert_class_string(template.content, 'DocumentFragment', 77 'Template content class should be a DocumentFragment'); 78 79 }, 'The template contents must be a DocumentFragment (not empty template ' 80 + 'containing text node)'); 81 82 83 test(function() { 84 var doc = newHTMLDocument(); 85 var template = doc.createElement('template'); 86 87 template.innerHTML = '<template id="t2">Some text</template>'; 88 89 doc.body.appendChild(template); 90 91 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 92 'Template content should be a documentFragment'); 93 assert_class_string(template.content, 'DocumentFragment', 94 'Template content class should be a DocumentFragment'); 95 96 var nestedTemplate = template.content.querySelector("#t2"); 97 assert_equals(nestedTemplate.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 98 'Nested template content should be a documentFragment'); 99 100 assert_class_string(nestedTemplate.content, 'DocumentFragment', 101 'Nested template content class should be a DocumentFragment'); 102 103 104 }, 'The template contents must be a DocumentFragment (nested template ' 105 + 'containing a text node)'); 106 107 108 testInIFrame('../resources/template-contents-empty.html', function(context) { 109 var doc = context.iframes[0].contentDocument; 110 111 var template = doc.querySelector('template'); 112 113 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 114 'Template content should be a documentFragment'); 115 assert_class_string(template.content, 'DocumentFragment', 116 'Template content class should be a DocumentFragment'); 117 118 119 }, 'The template contents must be a DocumentFragment (the empty template tag ' 120 + 'inside HTML file loaded in iframe)'); 121 122 123 testInIFrame('../resources/template-contents.html', function(context) { 124 var doc = context.iframes[0].contentDocument; 125 126 var template = doc.querySelector('template'); 127 128 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 129 'Template content should be a documentFragment'); 130 assert_class_string(template.content, 'DocumentFragment', 131 'Template content class should be a DocumentFragment'); 132 133 }, 'The template contents must be a DocumentFragment (non empty template ' 134 + 'tag inside HTML file loaded in iframe)'); 135 136 137 testInIFrame('../resources/template-contents-text.html', function(context) { 138 var doc = context.iframes[0].contentDocument; 139 140 var template = doc.querySelector('template'); 141 142 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 143 'Template content should be a documentFragment'); 144 assert_class_string(template.content, 'DocumentFragment', 145 'Template content class should be a DocumentFragment'); 146 147 }, 'The template contents must be a DocumentFragment (the template tag ' 148 + 'with some text inside HTML file loaded in iframe)'); 149 150 151 testInIFrame('../resources/template-contents-nested.html', function(context) { 152 var doc = context.iframes[0].contentDocument; 153 154 var template = doc.querySelector('template'); 155 156 assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 157 'Template content should be a documentFragment'); 158 assert_class_string(template.content, 'DocumentFragment', 159 'Template content class should be a DocumentFragment'); 160 161 var nestedTemplate = template.content.querySelector("template"); 162 163 assert_equals(nestedTemplate.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE, 164 'Nested template content should be a documentFragment'); 165 assert_class_string(nestedTemplate.content, 'DocumentFragment', 166 'Nested template content class should be a DocumentFragment'); 167 168 }, 'The template contents must be a DocumentFragment (the template tag ' 169 + 'with nested template tag inside HTML file loaded in iframe)'); 170 </script> 171 </body> 172 </html>