Using JsInterop to create JS object literals

222 views
Skip to first unread message

Nicolas Chamouard

unread,
Jun 28, 2022, 4:04:08 PM6/28/22
to GWT Users
Hello,

I am using JsInterop to integrate FullCalendar to my GWT application.
As described here https://fullcalendar.io/docs/initialize-globals, I am supposed to create an object literal and pass it to the Calendar() constructor.

I have managed to create this class : 

@JsType(namespace = JsPackage.GLOBAL)

public class OptionOverrides {


    @JsProperty

    public native String getInitialView();

    @JsProperty

    public native void setInitialView(String initialView);

}

It works but the FullCalendar complains about all the Java Object stuff that is translated to javascript : equals(), hashCode(), etc

I have tried to add isNative=true to my class, but in this case i cannot instantiate it in Java (error : $wnd.OptionOverrides is not a constructor)

Is there an other way to do this, am I missing something here ?

Thanks



Michael Conrad

unread,
Jun 28, 2022, 5:27:08 PM6/28/22
to google-we...@googlegroups.com
Have you tried giving the class a constructor?


--
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-tool...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-web-toolkit/a03c881a-48d4-4892-9fae-7719bc9a57b8n%40googlegroups.com.

Nicolas Chamouard

unread,
Jun 28, 2022, 6:24:16 PM6/28/22
to GWT Users
Yes, it does not change anything : 

@JsType(isNative=true, namespace = JsPackage.GLOBAL)

public class OptionOverrides {


    @JsConstructor

    public OptionOverrides() {}

    

    @JsProperty

    public native String getInitialView();

    @JsProperty

    public native void setInitialView(String initialView);

}


Still the same error : $wnd.OptionOverrides is not a constructor


Michael Conrad

unread,
Jun 28, 2022, 6:47:32 PM6/28/22
to google-we...@googlegroups.com
try adding name = "Object" so that it uses an empty javascript Object as the wrapped item.

I found this via Googling:

@JsType(namespace = JsPackage.GLOBAL, isNative = true, name = "Object")
public class MyPluginConfig {
    @JsProperty public void setXXXX(String str);
    @JsProperty public String getXXXX();
    ...
}

Ref: https://stackoverflow.com/a/36329387/12407701


Nicolas Chamouard

unread,
Jun 29, 2022, 2:38:19 AM6/29/22
to GWT Users
Thank you !
It is a bit mysterious to me, but with name = "Object" the constructor works :)

Thomas Broyer

unread,
Jun 29, 2022, 3:48:49 AM6/29/22
to GWT Users
Using isNative=true, you're telling GWT that you're only "mapping" in Java a type that exists in JS. The default naming rule is that the full name of that type is the fully qualified name of the Java class, you can change the simple name with 'name', and the prefix with namespace (which defaults to the package name for top-level classes, or the enclosing type's JS name for nested classes). So with namespace=GLOBAL but without the name="Object", you're saying that you want to basically do a 'new $wnd.MyPluginConfig()' in JS, and the browser rightfully complains that there's no such MyPluginConfig. Adding name="Object" means you'll do a 'new $wnd.Object()' in JS.

Fwiw, I'd rather user fields than getters/setters for such objects. YMMV.

Marco Tenti (IoProgrammo88)

unread,
May 21, 2024, 8:56:22 AMMay 21
to GWT Users
Sorry Thomas about your last comment "  I'd rather user fields than getters/setters for such objects "  can you point me out to some example for this ?

Marco Tenti (IoProgrammo88)

unread,
May 21, 2024, 10:30:35 AMMay 21
to GWT Users
Just to be clear on my use case this is my java class:

@JsType(namespace = JsPackage.GLOBAL, name = "Object", isNative = true)
public class XXXGWT {

    private String codiceAmministrazione;
   
    @JsConstructor
public DocumentoPAC4DTOGWT() {}

public native String getCodiceAmministrazione();

public native void setCodiceAmministrazione(String codiceAmministrazione);

}

and this is the erorr i'm getting on the setter : 


DesktopApp-0.js:13132
Tue May 21 16:24:02 GMT+200 2024 com.google.gwt.logging.client.LogConfiguration SEVERE: Exception caught: (TypeError) : b.setCodiceAmministrazione is not a function com.google.gwt.event.shared.UmbrellaException: Exception caught: (TypeError) : b.setCodiceAmministrazione is not a function

Thomas Broyer

unread,
May 21, 2024, 11:15:59 AMMay 21
to GWT Users
With the following:

@JsType(namespace = JsPackage.GLOBAL, name = "Object", isNative = true)
public class XXXGWT {
    public String codiceAmministrazione;
}

you should be able to write:

var xxx = new XXXGWT();
xxx.codiceAmministrazione = "foo";

and have it translate more or less to:

let xxx = new $wnd.Object()
xxx.codiceAmministrazione = "foo";

With the getter and setter, you have to annotate them with @JsProperty, but the generated JS will be identical, so you've actually only made your code more verbose for no compelling reasons (besides maybe pleasing static analyzers like Sonar that will yell if you don't encapsulate fields).

Marco Tenti (IoProgrammo88)

unread,
May 21, 2024, 11:53:40 AMMay 21
to GWT Users
I thank you Thomas for the clarification unfortunately I am forced to use setters and getters because I cannot find another way to set the values and compile the GWT java client.
As you said I seem to have solved it with:

@JsProperty public native String getCodeAdministration();

@JsProperty public native void setCodeAdministration(String codeAdministration);

Reply all
Reply to author
Forward
0 new messages