<!DOCTYPE html>
<html>
<head>
<script src="resources/polyfill.js"></script>
<script src="../../../resources/js-test-pre.js"></script>
</head>
<body>
<script>
description("This test ensures that title elements in a shadow subtree do not affect document.title attribute.")

debug('create a title element and insert it to document.');
var title = document.createElement('title');
title.appendChild(document.createTextNode('document title'));
document.head.appendChild(title);
shouldBe('document.title', '"document title"');
document.head.removeChild(title);
debug('remove title element from document.');
shouldBe('document.title', '""');

debug('create a shadow root whose host is already in document, create a subtree which contains a title element, and add the subtree to the shadow root.');
var subtree1 = document.createElement('div');
var shadow1 = subtree1.webkitCreateShadowRoot();
document.head.appendChild(subtree1);
var shadowTitle = document.createElement('title');
shadowTitle.appendChild(document.createTextNode('shadow title1'));
shadow1.appendChild(shadowTitle);
shouldBe('document.title', '""');

debug('remove the subtree from document.');
document.head.removeChild(subtree1);
shouldBe('document.title', '""');

debug('create a subtree, add a shadow root which contains a title element to the subtree, and insert the subtree to document.')
var subtree2 = document.createElement('div');
var shadow2 = subtree2.webkitCreateShadowRoot();
shadow2.innerHTML = '<title>shadow title2</title>';
document.head.appendChild(subtree2);
shouldBe('document.title', '""');
debug('remove the subtree from document');
document.head.removeChild(subtree2);
shouldBe('document.title', '""');

</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>