<!doctype html>
<html>
<head>
<style>
span {
   text-align: top;
}
</style>
<script src="resources/polyfill.js"></script>
<script>
function testChildTextOfShadowRoot() {
    var host = document.getElementById("host");
    var shadowRoot = host.webkitCreateShadowRoot();
    var span = document.createElement('span')
    span.textContent = "foo";
    shadowRoot.appendChild(span);
    shadowRoot.appendChild(document.createTextNode("bar"));
    document.body.offsetLeft;
    host.style.fontSize = '5em';
}

function testChildTextOfShadowRootWithResetStyleInheritance() {
    var host = document.getElementById("hostResetStyleInheritance");
    var shadowRoot = host.webkitCreateShadowRoot();
    var span = document.createElement('span')
    span.textContent = "foo";
    shadowRoot.appendChild(span);
    shadowRoot.appendChild(document.createTextNode("bar"));
    shadowRoot.resetStyleInheritance = true;
    document.body.offsetLeft;
    host.style.fontSize = '6em';
}

function testDistributedText() {
    var host = document.getElementById("hostWithDistribution");
    var shadowRoot = host.webkitCreateShadowRoot();
    shadowRoot.innerHTML = "<span id='span1'><content></content></span>"
    document.body.offsetLeft;
    shadowRoot.getElementById("span1").style.fontSize = '5em';
}

function testDistributedTextWithResetStyleInheritance() {
    var host = document.getElementById("hostResetStyleInheritanceWithDistribution");
    var shadowRoot = host.webkitCreateShadowRoot();
    shadowRoot.innerHTML = "<span id='span2'><content id='content'></content></span>"
    shadowRoot.getElementById("content").resetStyleInheritance = true;
    document.body.offsetLeft;
    shadowRoot.getElementById("span2").style.fontSize = '6em';
}

function runTests() {
    testChildTextOfShadowRoot();
    testChildTextOfShadowRootWithResetStyleInheritance();
    testDistributedText();
    testDistributedTextWithResetStyleInheritance();
}
</script>
</head>
<body onload="runTests()">
  <!-- [bug 101116] Text nodes in shadow roots don't inherit style properly -->
  <!-- https://bugs.webkit.org/show_bug.cgi?id=101116 -->
  <div id="host"></div>
  <div id="hostResetStyleInheritance"></div>
  <div id="hostWithDistribution">Foo<span>Bar</span></div>
  <div id="hostResetStyleInheritanceWithDistribution">Foo<span>Bar</span></div>
</body>
</html>