I am trying to use gwt with web component, I'd like to reuse some widgets by wrapping them (and use them in a microfrontend scenario but one step a time). I am using jsinterop in a dummy project but I can't use my widget in the javascript part. I use @JsType to share some classes (widgets and what they must render), here is a snippet of my simple web component:
import './gwtjs/gwtjs.nocache.js';
window.customElements.define('effort-component', class EffortComponent extends HTMLElement {
constructor() {
super();
this._shadowRoot = this.attachShadow({ 'mode': 'open' });
}
connectedCallback() {
console.log('connected!');
var actv1 = new edu.pezzati.gwtjs.client.provided.model.Activity;
...
var model = [];
model[0] = [actv1, actv2];
model[1] = [eff1, eff2, eff3];
var effortTable = edu.pezzati.gwtjs.client.provided.EffortTable();
this._shadowRoot.appendChild(effortTable);
effortTable.refresh(model);
}
});
when component is connected I get:
gwtjs.component.js:11 Uncaught ReferenceError: edu is not defined
at HTMLElement.connectedCallback (gwtjs.component.js:11)
at gwtjs.component.js:2
I am using gwt 2.8.1, mojo's gwt-maven-plugin 2.8.1 with the <generateJsInteropExports>true</generateJsInteropExports> flag to use JsInterop. You can find the project here.