Using GWT JSNI to integrate with js files

Question

I am currently working on a GWT project and it now needs to used by an external JavaScript file. I am creating a test prototype right now to ensure both sides are working properly.

When I run and compile, I see the console logs in the browser from the events being called. However, the GWT java methods are not being called.

After trying many scenarios, I also noticed that if I remove the $entry wrapper from the exportStaticMethods(), the opposite occurs. I see the System.outs being called in my java code, however the console logs from the JavaScript in the browser are not being called.

I am trying to figure what is causing the behavior and if there is a small missing piece I overlooked.

I have already reviewed the GWT JSNI documentation for calling a Java method from js and tried to find a solution from other related questions on StackOverflow.

GWT and Java side

I have gone into the onModuleLoad() method of my EntryPoint class and added a static method called exportStaticMethods(). I also created the PokePingClass.java file listed below.

EntryPointClass.java

public class EntryPointClass implements EntryPoint {

    @Override public void onModuleLoad() {
        exportStaticMethods();
        // load application here.
    }

    public static native void exportStaticMethods() /*-{

        $wnd.pingApp = $entry((function) {
                           @com.application.PokePingClass::pingApp()();
                       });

        $wnd.pokeApp = $entry((function) {
                           @com.application.PokePingClass::pokeApp()();
                       });
    }-*/
}

PokePingClass.java

public class PokePingClass {

    public static void pokeApp() {
        System.out.println("pokeApp() called");
    }

    public static void pingApp() {
        System.out.println("pingApp() called");
    }
}

HTML and js

In the .html file of the project, I added a hidden div element of id 'pokePing', as well as the pokeping.js file.

<html>
    <head>
        .
        . <!-- other stuff -->
        .
        <script type='text/javascript' src='pokeping.js</script> 
    </head>

    <body>
        .
        . <!-- other stuff -->
        .
        <div id="pokePing" style="visibility: hidden;"></div>
    </body>
</html>

pokeping.js

$(document).ready(function) {

    var $pp = $('#pokePing');

    var pokeApp = function() {
        console.log("app handling poke event");
        window.parent.pokeApp();
    }

    var pingApp = function() {
        console.log("app handling ping event");
        window.parent.pingApp();
    }

    $pp.trigger('pokeApp');
    $pp.trigger('pingApp');
}

Colin Alworth · Answer 1 · 2017-01-05T14:31:50.003

3

public static native void exportStaticMethods() /*-{

    $wnd.pingApp = $entry(function) {
                       @com.application.PokePingClass.pingApp()();
                   }

    $wnd.pokeApp = $entry(function) {
                       @com.application.PokePingClass.pokeApp()();
                   }
}-*/

This isn't valid JS, and doesn't make sense as JSNI. Try this instead:

    $wnd.pingApp = $entry(function() {
                       @com.application.PokePingClass::pingApp()();
                   });

    $wnd.pokeApp = $entry(function() {
                       @com.application.PokePingClass::pokeApp()();
                   });

Edit because I still had it wrong, forgot the :: operator for members.

edited Jan 05 '17 at 14:31

answered Jan 04 '17 at 21:10

Colin Alworth

17,801
2
26
39

Apologies. I corrected the JSNI syntax for the functions. I am still observing the same issues. I forgot to note that I am using jquery-2.2.4.min.js as well. It is currently not running in no conflicts mode if that helps. This question is also cross referenced in the SmartGWT forums as I am using that framework as well. – JEberhardt Jan 09 '17 at 16:27
Aside from the methods not being called, there are no other errors in your browser's console? Are you certain that System.out does what you think it does in a browser? – Colin Alworth Jan 09 '17 at 20:20
Sorry late response. I found a similar answer on SO. I can't find the OP but will provide the link when I come across it. For some reason when I add a return to the JSNI functions, it seems to work and I see the System.out statements. – JEberhardt Feb 17 '17 at 15:37

score 0 · Accepted Answer · answered Feb 17 '17 at 15:39

I found a similar post but the key was to actually return the method calls in the JSNI functions. After that, all works well.

public static native void exportStaticMethods() /*-{

    $wnd.pingApp = $entry((function) {
                       return @com.application.PokePingClass::pingApp()();
                   });

    $wnd.pokeApp = $entry((function) {
                       return @com.application.PokePingClass::pokeApp()();
                   });
}-*/

Using GWT JSNI to integrate with js files

2 Answers2