GWT history with push state

[jhon tonini]

Is possible to use push state in GWT history  (Es. /users, /newuser)  instead of "#" ?

[Michael Conrad]

Have you looked at "nalu"?

https://github.com/NaluKit/nalu

Starting with version 1.1.0 Nalu supports the use of hash less URLs.

Not sure about the Domino-Kit stuff

On Sat, Oct 3, 2020 at 7:00 AM jhon tonini <crot...@gmail.com> wrote:

Is possible to use push state in GWT history  (Es. /users, /newuser)  instead of "#" ?

--
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/a929a4a1-d268-436a-baa6-4dab200a6c40n%40googlegroups.com.

[jhon tonini]

Is possible implement push state in GWT  without extra libraries ?

[Tino D.]

You need at least something to access the history api. AFAIK with elemental which is delivered with GWT you could do it (https://docs.sencha.com/gxt/4.x/javadoc/gwt-elemental-2.8.2/elemental/html/History.html).

But if you want to have something future safe you should use something that uses JsInterop. With elemental2 for example you can access History: https://javadoc.io/static/com.google.elemental2/elemental2-dom/1.0.0/elemental2/dom/History.html .

Another solution is to use domino-history:

https://github.com/DominoKit/domino-history

This is a very thin wrapper for the history api which is lightweight and works with J2CL (future safe). You can check the domino-ui-demo to see how fine this works.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-web-toolkit/8b32e5da-7a53-490c-84c4-452e1aa234d1n%40googlegroups.com.

[Thomas Broyer]

On Saturday, October 3, 2020 at 1:00:32 PM UTC+2, jhon tonini wrote:

Is possible to use push state in GWT history  (Es. /users, /newuser)  instead of "#" ?

Not GWT History directly, but if you're using Places then you can use a Historian that uses pushState instead of GWT History: https://gist.github.com/tbroyer/1883821 (this is nearly 9 years old, you'll probably want to replace JSNI with JsInterop/Elemental2)

[Craig Mitchell]

As Tomas said, not directly with History.  It's simple JSNI though:

public static native void updateURL(String newUrl) /*-{

    $wnd.history.pushState(newUrl, "", newUrl);

}-*/;

public static native void initialise() /*-{

$wnd.onpopstate = $entry(function(e) {

@com.blah.YourClass::yourMethodThatListensForUrlChange()();

});

}-*/;

[Vegegoku]

JSNI is deprecated, you can use the browser state API with pushState.

You can also check domino-history which a lightweight wrapper around the pushState.

[Craig Mitchell]

I'm finally getting around to replacing these calls with Elemental2.

To replace the JSNI method:

public static native void initialise() /*-{

$wnd.onpopstate = $entry(function(e) {

@com.blah.YourClass::yourMethodThatListensForUrlChange()();

});

}-*/;

I would have thought it would be:

public static void initialise() {
DomGlobal.window.onpopstate.onInvoke(event -> {
// Do something
});
}

However, that doesn't compile, as onInvoke takes a @JsFunction, not a @FunctionalInterface.  So, I have to do something like this:

public static void initialise() {
DomGlobal.window.addEventListener("popstate", event -> {
// Do something
});
}

Is this correct?

[Thomas Broyer]

addEventListener indeed is an option (and I'd say possibly a better option), but AFAICT you could also have done:

DomGlobal.window.onpopstate = new OnpopstateFn() {

    @Override

    public onInvoke(Event event) {

        // do something

    }

});

[Colin Alworth]

Note that "@FunctionalInterface" is not required to express a Java interface with only one abstract method as a lambda. You can write:

DomGlobal.window.onpopstate = event -> {

    // Do something

    return null;

};

to use it as a lambda. This compiles for me with GWT 2.12.1 and Java 11.

The key is the "return null", missing in your example (and in Thomas's as well as a return type for the anon inner class). 

The return type is declared as Object, which may be an oversight in the original closure externs file, I don't see a way that an event handler can change anything by returning a different value. In JS, a missing return would implicitly return undefined, but Java requires an explicit return for non-void methods.

[Thomas Broyer]

On Wednesday, December 4, 2024 at 5:10:32 PM UTC+1 Colin Alworth wrote:

Note that "@FunctionalInterface" is not required to express a Java interface with only one abstract method as a lambda. You can write:

DomGlobal.window.onpopstate = event -> {

    // Do something

    return null;

};

to use it as a lambda. This compiles for me with GWT 2.12.1 and Java 11.

Does it show that I haven't written that kind of code for quite some time? 😂

(and/or rely too much on my IDE)

 

The key is the "return null", missing in your example (and in Thomas's as well as a return type for the anon inner class). 

The return type is declared as Object, which may be an oversight in the original closure externs file, I don't see a way that an event handler can change anything by returning a different value. In JS, a missing return would implicitly return undefined, but Java requires an explicit return for non-void methods.

An event handler's return type is used to cancel the event (https://blog.ltgt.net/html-event-handlers/#return-value / https://html.spec.whatwg.org/multipage/webappapis.html#the-event-handler-processing-algorithm), but for that specific event it doesn't matter as it's not cancelable anyway (https://html.spec.whatwg.org/multipage/browsing-the-web.html#updating-the-document:popstateevent)

[Craig Mitchell]

Thank you Thomas and Colin.  Setting onpopstate with a lambda is perfect!