<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test-pre.js"></script>
<script src="resources/polyfill.js"></script>
<script src="resources/shadow-dom.js"></script>
</head>
<body>

<p>This test confirms that the number of elements having Shadow in a shadow subtree is correctly counted.
See <a href="https://bugs.webkit.org/show_bug.cgi?id=100922">Bug 100922</a> also.</p>

<div id="container"></div>
<pre id="console"></pre>

<script>
function testCase(f)
{
    container.innerHTML = '';
    container.appendChild(createDOM('div', {'id': 'host'},
                                    createShadowRoot()));
    shadowRoot = internals.shadowRoot(host);

    f();
    debug('');
}

testCase(function()
{
    debug('Initial count should be 0');
    shouldBe('internals.countElementShadow(shadowRoot)', '0');
});

testCase(function()
{
    debug('Inserted into / removed from an element having shadow');

    var div = createDOM('div', {}, createShadowRoot());
    shadowRoot.appendChild(div);
    shouldBe('internals.countElementShadow(shadowRoot)', '1');

    shadowRoot.removeChild(div);
    shouldBe('internals.countElementShadow(shadowRoot)', '0');
});

testCase(function()
{
    debug('Inserted into / removed from an element having multiple shadow roots');

    var div = createDOM('div', {}, createShadowRoot(), createShadowRoot());

    shadowRoot.appendChild(div);
    shouldBe('internals.countElementShadow(shadowRoot)', '1');

    shadowRoot.removeChild(div);
    shouldBe('internals.countElementShadow(shadowRoot)', '0');
});

testCase(function()
{
    debug('ShadowRoot is added');
    var div = createDOM('div', {});
    shadowRoot.appendChild(div);
    shouldBe('internals.countElementShadow(shadowRoot)', '0');

    div.webkitCreateShadowRoot();
    shouldBe('internals.countElementShadow(shadowRoot)', '1');

    div.webkitCreateShadowRoot();
    shouldBe('internals.countElementShadow(shadowRoot)', '1');
});

testCase(function()
{
    debug('Should be counted by each shadow root (multiple shadow root case)');
    youngerShadowRoot = host.webkitCreateShadowRoot();

    var div = createDOM('div', {}, createShadowRoot());

    shadowRoot.appendChild(div);
    shouldBe('internals.countElementShadow(shadowRoot)', '1');
    shouldBe('internals.countElementShadow(youngerShadowRoot)', '0');

    youngerShadowRoot.appendChild(div);
    shouldBe('internals.countElementShadow(shadowRoot)', '0');
    shouldBe('internals.countElementShadow(youngerShadowRoot)', '1');
});

testCase(function()
{
    debug('Should be counted by each shadow root (nested shadow root case)');
    var div = createDOM('div', {}, createShadowRoot());
    nestedShadowRoot = internals.shadowRoot(div);
    shadowRoot.appendChild(div);

    shouldBe('internals.countElementShadow(shadowRoot)', '1');
    shouldBe('internals.countElementShadow(nestedShadowRoot)', '0');

    nestedShadowRoot.appendChild(createDOM('div', {}, createShadowRoot()));

    shouldBe('internals.countElementShadow(shadowRoot)', '1');
    shouldBe('internals.countElementShadow(nestedShadowRoot)', '1');

    shadowRoot.appendChild(createDOM('div', {}, createShadowRoot()));

    shouldBe('internals.countElementShadow(shadowRoot)', '2');
    shouldBe('internals.countElementShadow(nestedShadowRoot)', '1');

    nestedShadowRoot.appendChild(createDOM('div', {}, createShadowRoot()));

    shouldBe('internals.countElementShadow(shadowRoot)', '2');
    shouldBe('internals.countElementShadow(nestedShadowRoot)', '2');
});

testCase(function()
{
    debug('Should be counted by each shadow root (deep nested shadow root case)');
    var div = createDOM('div', {}, createShadowRoot());
    nestedShadowRoot = internals.shadowRoot(div);
    shadowRoot.appendChild(div);

    shouldBe('internals.countElementShadow(shadowRoot)', '1');
    shouldBe('internals.countElementShadow(nestedShadowRoot)', '0');

    var div1 = createDOM('div', {}, createShadowRoot());
    div1.setAttribute('title', 'debugstop');
    deepNestedShadowRoot = internals.shadowRoot(div1);
    var div2 = createDOM('div', {}, createShadowRoot());
    var shadowRoot2 = internals.shadowRoot(div2);

    deepNestedShadowRoot.appendChild(div2);
    // When not in document, we don't count it.
    shouldBe('internals.countElementShadow(deepNestedShadowRoot)', '0');

    nestedShadowRoot.appendChild(div1);
    shouldBe('internals.countElementShadow(shadowRoot)', '1');
    shouldBe('internals.countElementShadow(nestedShadowRoot)', '1');
    shouldBe('internals.countElementShadow(deepNestedShadowRoot)', '1');

    container.innerHTML = "";
    shouldBe('internals.countElementShadow(shadowRoot)', '0');
    shouldBe('internals.countElementShadow(nestedShadowRoot)', '0');
    shouldBe('internals.countElementShadow(deepNestedShadowRoot)', '0');
});

finishJSTest();
</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>