Search code examples
dartdart-webuipolymerdart-polymer

Querying a custom element, is returned as UnknownElement


I've defined a custom element, chat-view and have it displaying on a page:

<!DOCTYPE html>

<html>
  <head>
    <title>index</title>
     <script src="packages/polymer/boot.js"></script>
    <link rel="import" href="chat_view.html">
  </head>

  <body>   
    <chat-view id="chat">
    </chat-view>

    <script type="application/dart" src="index.dart"></script>
  </body>
</html>

I then query for the chat-view:

final ChatView chatView = query("#chat");

The previous line causes the following exception:

Exception: type 'UnknownElement' is not a subtype of type 'ChatView' of 'chatView'.

Is there a way to query for my custom element in such a way that I get an object of ChatView, instead of UnknownElement?


Solution

  • After some digging, I found that the custom element instance is accessed through the UnknownElement's xtag property.

    final ChatView chatView = query("#chat").xtag;