[1.0.0] Light DOM being replaced by shady DOM on ready

[JamesLMilner]

I am currently porting an app from 0.5 to 1.0 and it appears that the nested custom components appear to be getting replaced by the shady DOM of the parent element.

Before the Shady DOM fully loads:

After the Shady DOM has loaded:

I am not currently doing an DOM manipulation that would cause this. The web component logic appears to run without an issue, only the Light DOM elements seem to have been removed/replaced. I can't seem to see any logical reason for this to be happening other than an issue.

Update: I put breakpoints on the elements 'when element is removed' this is the part of the polymer code that appears to be causing it:

 if (!this.shadyRoot._hasDistributed) {
 this.textContent = "";
 this.appendChild(this.shadyRoot);
 }

This is located on lines 1053 - 1056 of the Polymer library.

[JamesLMilner]

I didn't realise you needed to use the content element to act as an insertation point for light DOM within your element (as per: https://www.polymer-project.org/1.0/docs/devguide/local-dom.html#dom-distribution). This was not mentioned in the transition guide! I would recommend adding this to https://www.polymer-project.org/1.0/docs/migration.html for people used to using the stricter shadow DOM approach in 0.5.