class MiSaludo extends HTMLElement {
  constructor () {
    // Obtengo la única etiqueta 'template'
    const tpl = document.querySelector('template');
    // Clono su contenido y se crea una instancia del document fragment
    const tplInst = tpl.content.cloneNode(true);
    
    super(); // invoca el constructor de la clase padre
    // Se crea un shado dom para las instancias de mi-saludo
    this.attachShadow({ mode: 'open'});
    // Y se agrega el template dentro del shadow DOM usando el elemento raíz 'shadowRoot'
    this.shadowRoot.appendChild(tplInst);
  }
}

// Se registra el custom element para poder ser utilizado declarativamente en el HTML o imperativamente mediante JS
customElements.define('mi-saludo', MiSaludo);