I have a custom HTMLElement called <test-tag>. My goal now is to call a DOM event from that element‘s class constructor, so that when a element like <test-tag onclick= ‘alert(“constructed“);‘> is added to the DOM, the constructor triggers that onclick event and “constructed“ gets alerted.

Here is what I have tried yet but it is not working: https://jsfiddle.net/mnat6qxb/15/

HTML:

<test-tag onclick="alert('test')">Test</test-tag>

JavaScript:

class TestTag extends HTMLParagraphElement {
  constructor() {
    super();
    this.dispatchEvent(new Event('click'));    
  }
}

customElements.define('test-tag', TestTag, { extends: 'p' });