jQuery enthält fehlschlägt mit webcomponents.js Polyfill in Firefox

Question

Ich benutze die WebComponent's Polyfill.

Der folgende Code-Snippet funktioniert in der neuesten stabilen Chrome-Version einwandfrei, schlägt jedoch im neuesten stabilen Firefox fehl.

Es scheint so ein Kernstück der Funktionalität, dass ich fühle, dass ich etwas falsch mache, aber ich mache mir Sorgen, dass das Polyfill Sizzle-Funktionalität falsch geändert hat.

Wenn jemand einen Einblick in die Sache hat, bitte teilen.

window.addEventListener('WebComponentsReady', function() { 
 
    $(document).ready(function() { 
 
    var contains = $.contains(document.documentElement, document.getElementById('root')); 
 
    console.log('Contains:', contains); 
 
    }); 
 
});

<div id='root'></div> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/0.7.20/webcomponents.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

EDIT: Es gibt offensichtlich mehr dazu als das Auge trifft. Einige Leute berichten, dass sie in Firefox true nicht false sehen. Unklar, was die Ursache ist.

Answer 1

Das Problem wird durch ShadowDOM-Polyfill von WebComponent verursacht. Wenn webcomponents-lite.js anstelle des vollständigen Polyfill verwendet wird, funktioniert alles wie erwartet.

Ref: https://github.com/webcomponents/webcomponentsjs#element-wrapping--unwrapping-limitations-

vermuten, dass das betreffende Element gewickelt wurde, der seine Referenz bricht.