Firefoxでwebcomponents.js polyfillでjQueryに失敗する

Question

私はWebComponent's Polyfillを使用しています。

次のコードスニペットは、最新の安定版Chromeでうまく動作しますが、最新の安定版Firefoxでは機能しません。

私は何か間違ったことをしているような気がするが、polyfillがSizzleの機能を間違って変更したと心配している。

誰かがこの問題に関する洞察を持っている場合は、共有してください。

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：目を満たしているよりも、このよりは明らかにあります。一部の人々は、trueがfalseではないことをFirefoxで報告していると報告しています。根本的な原因が不明です。

Answer 1

この問題は、WebComponentのShadowDOMポリフィルによって発生します。完全ポリフィルの代わりにwebcomponents-lite.jsを使用すると、すべて正常に動作します。

参考：その参照を壊す問題の要素がラップされたhttps://github.com/webcomponents/webcomponentsjs#element-wrapping--unwrapping-limitations-

容疑者。