Search code examples
polymerweb-componentshadow-dompolyfills

Access to light DOM when using webcomponents.js (Shadow DOM polyfill)

I'm trying to access the light DOM when using the webcomponents.js polyfill but it does not seem to work. (works fine in native Shadow DOM/Chrome)

Here is a reduced test of what I’m trying to do:

sample: http://jsbin.com/wudakapujo/1/ code: http://jsbin.com/wudakapujo/1/edit

Any hints/pointers regarding how I could access the Light DOM data when using the Shadow DOM polyfill would be greatly appreciated

Thanks!

Solution

  • Try adding <content></content> to your template, or <content select="span"></content> to just get the span tag.

    <template>
  <h1>SHADOW DOM CONTENT</h1>
  <content select="span"></content>
</template>