Why do I get an Internal Dartium Exception when using custom elements?

Question

I am seeing this error in my console:

Exception: InvalidStateError: Internal Dartium Exception
  PolymerDeclaration.registerType (package:polymer/src/declaration.dart:241:22)
  PolymerDeclaration.register (package:polymer/src/declaration.dart:175:17)
  PolymerDeclaration._register (package:polymer/src/declaration.dart:114:13)
  PolymerDeclaration.registerWhenReady (package:polymer/src/declaration.dart:109:14)
  _notifyType (package:polymer/src/declaration.dart:514:49)
  Polymer.register (package:polymer/src/instance.dart:64:16)
  _loadLibrary (package:polymer/src/loader.dart:177:25)

I have code like this:

@CustomTag('person-tag')
class PersonTag extends PolymerElement {

And my HTML is like this:

<polymer-element name="person-tag" extends="li">

Why am I getting this Internal Dartium Exception error from registerType ?

Answer 1

You are seeing this error because your HTML says extends="li" but the Dart code only extends PolymerElement.

If you use an extends attribute in your polymer-element, then your Dart class must also extend the same kind of element.

To fix the problem in the question, change the Dart class:

@CustomTag('person-tag')
class PersonTag extends LIElement with Polymer, Observable {

Now PersonTag really does extend <li>.