Thursday, April 27, 2017

How to use custom elements (web components) with JsInterop and Elemental 2?

Hello again,

I have a custom element defined in HTML and trying to communicate with it from GWT and with JsInterop.

Similar to how I can create a div element and cast it to the Elemental 2 HTMLDivElement, I have defined MyAppElement extending Elemental 2 HTMLElement
and using the same JsInterop annotations as for HTMLDivElement:

  @JsType(isNative = true, namespace = JsPackage.GLOBAL)
  public class MyAppElement extends HTMLElement {
    ...
  }

The following works fine:

    Element element = DomGlobal.document.createElement("div");
    HTMLDivElement divElement = (HTMLDivElement) element;


... but for my custom element I cannot cast it to MyAppElement:

    Element element = DomGlobal.document.createElement("my-app");
    MyAppElement myAppElement = (MyAppElement) element; // Throws ClassCastException

What am I missing?

--
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at https://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

No comments:

Post a Comment