Vanilla JavaScript自定义元素TypeError

Question

我的问题是关于为自定义元素扩展HTMLElement。

class Foo extends HTMLElement { ... }

class Bar extends Foo { ... }

class FooBar extends Bar { ... }

它们中的每一个都在构造函数中调用super()。

当我用Bar定义一个自定义元素时，我没有得到任何错误

customElements.define( 'custom-tag', Bar );
or
customElements.define( 'custom-tag', class Bar extends Foo { ... } );

我正在尝试使用FooBar类定义一个自定义元素。

customElements.define( 'other-custom-tag', FooBar );
or
customElements.define( 'other-custom-tag', class FooBar extends Bar { ... } );

但我得到了

Uncaught TypeError: Failed to execute 'define' on 'CustomElementRegistry':
The provided value cannot be converted to a sequence.

通过Mozilla文档

https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry/define

TypeError   The referenced constructor is not a constructor.

我找不到任何与这个问题相关的东西...

Answer 1

问题很可能是static get observedAttributes() -在我的例子中，我犯了一个愚蠢的拼写错误，在一个数组上使用了push，该数组返回新数组元素的计数，而不是数组本身(替换为concat，效果很好)。

换句话说，只要确保静态getter返回一个数组，就可以了