webcomponents-lite mit ES6 funktioniert nicht in IE 11 und 10

Question

Wir verwenden WebComponents mit ES6-Syntax.

WebComponents polyfill WebComponents-lite.js (die ShadowDOM nicht einschließt) wird also nicht 11 während die webcomponents.js in Arbeits (die ShadowDOM einschließt) funktioniert gut. Für unseren Projektanwendungsfall würden wir 'Custom-Elemente' ohne ShadowDOM verwenden.

wird ein Fehler im IE geworfen, wenn wir WebComponents-lite.js verwenden - SCRIPT5022: Exception thrown and not caught.

Gibt es eine Abhilfe zur Verfügung?

EDIT: Der Code, den ich in IE laufen mit webcomponents-lite.js

HTML bin versucht: <super-button></super-button>

JS (ES6-Format):

class SuperBtn extends HTMLElement { 
    constructor() { 
     super(); 
    } 
    createdCallback() { 
     this.innerHTML = "Invoke Ultron!"; 
     this.addEventListener('click',() => alert(this.textContent + ' has been clicked')); 
    } 
} 

document.registerElement("super-button", SuperBtn); 

Answer 1

Ja, Sie kann ein benutzerdefiniertes Element v1 mit der ursprünglichen Schreibweise prototype deklarieren.

Dies funktioniert mit another polyfill von Web Reflection:

var CEo = function() 
{ 
    console.log("created") 
    return Reflect.construct(HTMLElement, [], CEo) 
} 

CEo.prototype = Object.create(HTMLElement.prototype) 
CEo.prototype.constructor = CEo 

CEo.prototype.connectedCallback = function() 
{ 
    console.log("connected") 
    this.innerHTML = "Hello v1" 
} 

customElements.define("object-v1", CEo) 

Hinweis: es eine polyfill wie the one of Babel verwenden müssen Reflect.construct Methode zu erhalten.