Illegal constructor on Safari

I’m using the polyfill to use built-in web components on Safari, which works fine when using:

<script src="//unpkg.com/@ungap/custom-elements"></script>

However when using it as an imported package, I get the following error at component’s creation (not explicit creation through JS, but implicit through the element in HTML code).

TypeError: Illegal constructor
(anonymous function) — MyComponent.ts:24
MyComponent — MyComponent.ts:24
_handle — index.js:423
notifier — index.js:164
loop — index.js:91
loop — index.js:99
(fonction anonyme) — index.js:110

Component’s code is basically:

class MyComponent extends window.HTMLInputElement {
  constructor() {
    super()
  } 
}

Notes:

• Env is macOS 12.2.1 with Safari 15.3 (17612.4.9.1.8) ;
• The polyfill is imported at first statement, using import "@ungap/custom-elements". At runtime it is there and executed, and the component has been property registered (using window.customElements.define("my-input", MyComponent, {extends: "input"})) as the error occurs in the polyfill code ;
• This issue looks similar to this stackoverflow post which has no answer.

[WebReflection]

@Javarome for what is worth it as a hint, every single polyfill should always be loaded before anything else … we (polyfils authors) can’t fight the unknown all libraries internals do, so bring the polyfill always before everything else and code happily ever after 🥳

[Javarome]

Indeed this was an import order issue.

Doing:

import "MyComponent"
import "@ungap/custom-elements"

fails, but doing:

import "@ungap/custom-elements"
import "MyComponent"

works.

Thanks for the hint!