layout.html | Explore in Territory

<!DOCTYPE html>
<script src='resources/shadow-dom.js'></script>
<div id='host'>
  <template data-mode='open'>
    <style>
      div {
        background-color: green;
      }
    </style>
    <div><slot></slot></div>
  </template>
  <div id='hostchild'>Hello</div>
</div>
<script>
hostchild.offsetTop;  // Update layout before calling attachShadow() so that #hostchild has a layout object
convertTemplatesToShadowRootsWithin(host);
</script>

chromium/third_party/blink/web_tests/shadow-dom/layout.html