How to properly extend HTMLImageElement

Extending HTMLImageElement directly works okay for Chrome, Firefox etc.

export default class CustomImg extends HTMLImageElement {
    constructor() {

However it does not work at Safari which says super() is an illegal constructor. According to MDN Image() is the proper constructor for HTMLImageElement ( I tried to extend Image as well. However even though it does not print out any errors, it just does not behave as a CustomElement.

Any ideas on how to create a custom element on top of HTMLImageElement that can work for both Chrome and Safari?


There are 2 different flavored Web Components:
details see Web Components : extending native elements

  • Autonomous Elements (extend from HTMLElement)
  • Customized Built-In Elements (extend from any Element)

But Apple/WebKit will not implement the latter as stated in 2016: