schnie
commented
9 years ago So by default polymer is setup to run using the shady dom polyfill. Shady dom is lighter weight and faster than the full shadow dom polyfill, which is why its the default now. Since 1.0 was all about becoming "production ready" they needed to do this. It works well if you are building a pure polymer application.
But when you use another dom rendering library to alter child elements (light dom) of an element like a paper-drawer-panel, the custom element is not aware of the changes which causes all kinds of problems. The full shadow dom spec is capable of detecting changes made to light dom and handles them, but shady dom ignores them for performance.
So using a paper-button or checkbox should work find with shady dom, because you are unlikely to alter the light dom via blaze. The wrapper elements like drawer-panels, scroll-panels etc, are where you are likely to run into problems.
Polymer does ship with methods to notify the parent element of external changes to light dom though. So, in theory it would be possible to write an adapter that uses these methods to allow compatibility with blaze, react, etc. The polymer team has only dabbled with that, so it may need to come from the community. For now, I'm just using shadow dom, but might experiment with the adapter route at some point.
can someone explain this more thoroughly please? " By setting useShadowDom to true, we configure polymer to opt out of shady dom and use full shadow dom. This is pretty much required at the moment unless you only use polymer elements as leaf nodes. Any light dom (child elements) that gets rendered by blaze, react, etc will not be accounted for otherwise. "