template-child-nodes.html (3979B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>HTML Templates: Child nodes of template element in XHTML documents</title> 5 <meta name="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> 6 <meta name="author" title="Aleksei Yu. Semenov" href="a.semenov@unipro.ru"> 7 <meta name="assert" content="Child nodes of template element in XHTML documents are always appended to the template content (instead of template itself)"> 8 <link rel="help" href="http://www.w3.org/TR/2013/WD-html-templates-20130214/#parsing-xhtml-documents"> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 <script src='/html/resources/common.js'></script> 12 </head> 13 <body> 14 <div id="log"></div> 15 <script type="text/javascript"> 16 17 18 test(function() { 19 var doc = newXHTMLDocument(); 20 21 doc.body = doc.createElement('body'); 22 doc.body.innerHTML = '<template id="tmpl1">' 23 + '<div id="div1">This is div inside template</div>' 24 + '<div id="div2">This is another div inside template</div>' 25 + '</template>'; 26 27 var template = doc.querySelector('#tmpl1'); 28 29 assert_equals(template.childNodes.length, 0, 30 'Wrong number of template child nodes'); 31 assert_equals(template.content.childNodes.length, 2, 32 'Wrong number of template content child nodes'); 33 34 }, 'Child nodes of template element in XHTML documents must be appended to template content'); 35 36 37 38 test(function() { 39 var doc = newXHTMLDocument(); 40 doc.body = doc.createElement('body'); 41 doc.body.innerHTML = '<template id="tmpl1">' 42 + '<div id="div1">This is div inside template</div>' 43 + '<div id="div2">This is another div inside template</div>' 44 + '<template id="tmpl2">' 45 + '<div id="div3">This is div inside nested template</div>' 46 + '<div id="div4">This is another div inside nested template</div>' 47 + '</template>' + '</template>'; 48 49 var template = doc.querySelector('#tmpl1'); 50 51 assert_equals(template.childNodes.length, 0, 52 'Wrong number of template child nodes'); 53 assert_equals(template.content.childNodes.length, 3, 54 'Wrong number of template content child nodes'); 55 56 var nestedTemplate = template.content.querySelector('#tmpl2'); 57 58 assert_equals(nestedTemplate.childNodes.length, 0, 59 'Wrong number of template child nodes'); 60 assert_equals(nestedTemplate.content.childNodes.length, 2, 61 'Wrong number of nested template content child nodes'); 62 63 }, 'Child nodes of nested template element in XHTML documents must be appended to template content'); 64 65 66 67 testInIFrame('../resources/template-child-nodes-div.xhtml', function(context) { 68 var doc = context.iframes[0].contentDocument; 69 70 var template = doc.querySelector('template'); 71 72 assert_equals(template.childNodes.length, 0, 73 'Wrong number of template child nodes'); 74 assert_equals(template.content.querySelectorAll('div').length, 2, 75 'Wrong number of template content child nodes'); 76 77 }, 'Child nodes of template element in XHTML documents must be appended to template content. ' 78 + 'Test loading XHTML document from a file'); 79 80 81 testInIFrame('../resources/template-child-nodes-nested.xhtml', function(context) { 82 var doc = context.iframes[0].contentDocument; 83 84 var template = doc.querySelector('template'); 85 86 assert_equals(template.childNodes.length, 0, 87 'Wrong number of template child nodes'); 88 89 var nestedTemplate = template.content.querySelector('template'); 90 91 assert_equals(nestedTemplate.childNodes.length, 0, 92 'Wrong number of template child nodes'); 93 94 assert_equals(nestedTemplate.content.querySelectorAll('div').length, 2, 95 'Wrong number of template content child nodes'); 96 97 }, 'Child nodes of nested template element in XHTML documents must be appended to template content. ' 98 + 'Test loading XHTML document from a file'); 99 100 </script> 101 </body> 102 </html>