<!DOCTYPE html>
<html>
<head>
<title>HTML Templates: The template contents is a DocumentFragment</title>
<meta name="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru">
<meta name="assert" content="The template contents must be a DocumentFragment">
<link rel="help" href="http://www.w3.org/TR/2013/WD-html-templates-20130214/#definitions">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src='/html/resources/common.js'></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">


test(function() {
    var doc = newHTMLDocument();
    var template = doc.createElement('template');

    doc.body.appendChild(template);

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a DocumentFragment');

    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');

}, 'The template contents must be a DocumentFragment (empty template)');


test(function() {
    var doc = newHTMLDocument();
    var template = doc.createElement('template');

    template.innerHTML = '<div>This is a div</div><span>This is a span</span>';

    doc.body.appendChild(template);

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a DocumentFragment');

    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');

}, 'The template contents must be a DocumentFragment (non empty template)');


test(function() {
    var doc = newHTMLDocument();
    var template = doc.createElement('template');

    template.innerHTML = '<div>This is a div</div>';

    doc.body.appendChild(template);

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a documentFragment');

}, 'The template contents must be a DocumentFragment (non empty template '
        + 'containing div which is an Element instance)');


test(function() {
    var doc = newHTMLDocument();
    var template = doc.createElement('template');

    template.innerHTML = 'Some text';

    doc.body.appendChild(template);

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a documentFragment');

    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');

}, 'The template contents must be a DocumentFragment (not empty template '
        + 'containing text node)');


test(function() {
    var doc = newHTMLDocument();
    var template = doc.createElement('template');

    template.innerHTML = '<template id="t2">Some text</template>';

    doc.body.appendChild(template);

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a documentFragment');
    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');

    var nestedTemplate = template.content.querySelector("#t2");
    assert_equals(nestedTemplate.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Nested template content should be a documentFragment');

    assert_class_string(nestedTemplate.content, 'DocumentFragment',
            'Nested template content class should be a DocumentFragment');


}, 'The template contents must be a DocumentFragment (nested template '
        + 'containing a text node)');


testInIFrame('../resources/template-contents-empty.html', function(context) {
    var doc = context.iframes[0].contentDocument;

    var template = doc.querySelector('template');

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a documentFragment');
    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');


}, 'The template contents must be a DocumentFragment (the empty template tag '
        + 'inside HTML file loaded in iframe)');


testInIFrame('../resources/template-contents.html', function(context) {
    var doc = context.iframes[0].contentDocument;

    var template = doc.querySelector('template');

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a documentFragment');
    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');

}, 'The template contents must be a DocumentFragment (non empty template '
        + 'tag inside HTML file loaded in iframe)');


testInIFrame('../resources/template-contents-text.html', function(context) {
    var doc = context.iframes[0].contentDocument;

    var template = doc.querySelector('template');

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a documentFragment');
    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');

}, 'The template contents must be a DocumentFragment (the template tag '
        + 'with some text inside HTML file loaded in iframe)');


testInIFrame('../resources/template-contents-nested.html', function(context) {
    var doc = context.iframes[0].contentDocument;

    var template = doc.querySelector('template');

    assert_equals(template.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Template content should be a documentFragment');
    assert_class_string(template.content, 'DocumentFragment',
            'Template content class should be a DocumentFragment');

    var nestedTemplate = template.content.querySelector("template");

    assert_equals(nestedTemplate.content.nodeType, Node.DOCUMENT_FRAGMENT_NODE,
            'Nested template content should be a documentFragment');
    assert_class_string(nestedTemplate.content, 'DocumentFragment',
            'Nested template content class should be a DocumentFragment');

}, 'The template contents must be a DocumentFragment (the template tag '
        + 'with nested template tag inside HTML file loaded in iframe)');
</script>
</body>
</html>