template-component-3.js

class TemplateComponent extends HTMLElement {
  constructor (tagName) {
    super();

    if (!tagName) {
      throw new Error('You did now specify a tag name. You need to call super with the tag name in you constructor.');
    }

    this._tagName = tagName;
  }

  connectedCallback () {
    this.render();
  }

  async render () {
    let state;

    if (this.getState) {
      state = await this.getState();
    }

    const template = await this.getTemplate(state);

    const shadowDOM = this.attachShadow({ mode: 'open' });
    const clone = document.importNode(template.content, true);

    this._shadowDOM = shadowDOM;

    shadowDOM.appendChild(clone);

    if (this.postRender) {
      this.postRender();
    }
  }
}