title: Create a custom input element
body: <p>I'm trying to create a custom component that extends the <code>HTMLInputElement</code> component, but nothing renders.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>class myInput extends HTMLInputElement {};
  
  customElements.define('my-input', myInput, {
    extends: 'input'
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;my-input type="text"&gt;&lt;/my-input&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>What am I missing here?</p>