Assertion failed error importing with SystemJs

[olanod]

So, what I have found is that this kind of problem is possibly caused by the shadowDOM polyfill when webcomponents.js is not the first script on the app. But in my case I'm trying to conditionally import it with System.js so it cannot be the first script.
My index only has a few script tags(systemJs stuff)

<script src="system.js"></script>
<script src="config.js"></script>
<script>System.import('bootstrap')</script>

and the bootstrap function imports webcomponentsjs something like this:

function bootstrap() {
    ...
    var wcModule = needPolyfill ? System.import('webcomponentsjs') : Promise.resolve();
}

The error is Assertion failed and the stack:

assert@http://localhost:9000/vendor/github/webcomponents/webcomponentsjs@0.5.5/webcomponents.js:112:21assertIsNodeWrapper@http://localhost:9000/vendor/github/webcomponents/webcomponentsjs@0.5.5/webcomponents.js:1573:7.removeChild@http://localhost:9000/vendor/github/webcomponents/webcomponentsjs@0.5.5/webcomponents.js:1830:9forwardMethodsToWrapper/</</constructor.prototype[name]@http://localhost:9000/vendor/github/webcomponents/webcomponentsjs@0.5.5/webcomponents.js:337:20doEval@http://localhost:9000/vendor/system.js:1:23513__eval@http://localhost:9000/vendor/system.js:1:23062a@http://localhost:9000/vendor/system.js:1:3168s/e.instantiate/n.metadata.execute@http://localhost:9000/vendor/system.js:1:12644f@http://localhost:9000/vendor/system.js:1:5926l@http://localhost:9000/vendor/system.js:1:4563n/e.instantiate/</<.execute@http://localhost:9000/vendor/system.js:1:8149o@http://localhost:9000/vendor/es6-module-loader.js:7:18486p@http://localhost:9000/vendor/es6-module-loader.js:7:18860j@http://localhost:9000/vendor/es6-module-loader.js:7:16406k@http://localhost:9000/vendor/es6-module-loader.js:7:16791f/</<@http://localhost:9000/vendor/es6-module-loader.js:7:15192O@http://localhost:9000/vendor/es6-module-loader.js:7:7437K@http://localhost:9000/vendor/es6-module-loader.js:7:7071[7]</</</</y.prototype.when@http://localhost:9000/vendor/es6-module-loader.js:7:10745[7]</</</</v.prototype.run@http://localhost:9000/vendor/es6-module-loader.js:7:9779[3]</</</a.prototype._drain@http://localhost:9000/vendor/es6-module-loader.js:7:1725a/this.drain@http://localhost:9000/vendor/es6-module-loader.js:7:1392b@http://localhost:9000/vendor/es6-module-loader.js:7:3302

[addyosmani]

One easier way to validate this assertion is testing against webcomponents-lite.js. Could you let us know if you're running into issues with that build too?

[olanod]

lite version loads 😉

[db-df]

I am also having this issue on a project I would like to use this polyfill for. Firefox 37/Linux and a recent Safari chokes if it is not the first script in the application, and periodically gives an assertion error. Using webcomponents-lite.js resolved the issue.

[jay8t6]

Is there a possible explanation to why lite works and the full version doesnt? Shouldnt we include the polyfill for shadow DOM in IE11?

[TimvdLippe]

Thanks for the issue. It has been a great while since this issue was opened. Sadly, this issue misses a live reproduction with the most recent version of the webcomponents polyfill for us to be able to debug and potentially fix. Versions 1 of the polyfills fix a large amount of issues, probably including this one as well.

Please see the CONTRIBUTING.md for guidelines on filing issues. You can start from this jsBin template as a starting point and link it in the issue template under "Live Demo".

Feel free to file a new issue following these instructions if you can still reproduce this issue with versions 1 of the polyfills. Thank you!