Accessing custom JS events in GWT

1,343 views
Skip to first unread message

e-lena-s

unread,
Aug 10, 2011, 7:50:25 PM8/10/11
to Google Web Toolkit
I am trying to listen to a custom JS event that is created outside my
GWT module. In my JS file I create the event, and then fire it as
such :

var evt = document.createEvent("Event");
evt.initEvent('customEvent', true, true);
evt.customData = "someData";

window.addEventListener('customEvent', function(evt)
{ console.log("test: " + evt.customData)}, false);
window.dispatchEvent(evt);

Now, in my GWT code, I have a JSNI method that adds a listener to
listen to my customEvent and act on it. Code as follows:

public native void addLookupResultHandler()/*-{
$wnd.addEventListener('lookupEntitySelected',
$entry(function(evt){

console.log("gwt: " + evt.customData);

console.log("gwt: " + evt.type);

@myClassName::handleEvent(LmyCustomEventEvent;)(evt)
}), false);
}-*/;


The problem I have is that the customData is being dropped when the
event gets to JSNI code. I can see that the event listner written in
JS does get the correct event with the correct customData, but logging
the event properties in JSNI shows that customData is undefined (event
type looks correct though)

Am I doing something wrong here ?

Is there may be a better way to create custom events (it has to be
created in JavaScript, since the code firing it won't be in GWT
module)

Jeffrey Chimene

unread,
Aug 11, 2011, 10:53:01 AM8/11/11
to google-we...@googlegroups.com
Probably make your JSNI much lighter in that it should just pass
arguments to a GWT routine that actually fires the event. The docs are
very good on this account.

Believe it or not, but your JS example is doing too much work. Unless
you're porting existing code, in which case you're actually just writing
wrappers, there should be a good reason to write a JSNI routine that's
more than one or two lines. This example does not clear that bar.

Jeffrey Chimene

unread,
Aug 11, 2011, 11:17:37 AM8/11/11
to google-we...@googlegroups.com
On 8/10/2011 4:50 PM, e-lena-s wrote:
My earlier answer was not correct. I don't see why
addLookupResultHandler is a JSNI routine. I think you want to write it
in GWT, via handling a NativeEvent. However, I've never tried this, so
it may not work as you intend.

OTOH, maybe you should be using the GWT event bus. From an architectural
perspective, I think that's a better choice. Instead of using
window.dispatch(), fire the event via a JSNI method. So, your first JS
sample should become a JSNI routine that calls a Java routine that calls
eventBus.fire(), and your second example should become Java. It's
possible to call eventBus.fire() entirely within JSNI, but getting that
eventBus argument to your JSNI method may be problematic.

e-lena-s

unread,
Aug 11, 2011, 11:38:19 AM8/11/11
to Google Web Toolkit
The issue is that the JS function is written by some other library.
The custom event will be fired not by my module but by other code on
the page . I however need to listen to that event, and get the
customData out of that event for further processing within the
module.
I have tried to use DOM.sinkBitlessEvent (and seeing if I can catch
this event in onBrowserEvent() ), but that didn't work. Not sure what
other way I can get that event , or why does the custom event looses
its customData when within JSNI method

Jeff Chimene

unread,
Aug 11, 2011, 12:50:19 PM8/11/11
to google-we...@googlegroups.com
On 08/11/2011 08:38 AM, e-lena-s wrote:
> The issue is that the JS function is written by some other library.
> The custom event will be fired not by my module but by other code on
> the page . I however need to listen to that event, and get the
> customData out of that event for further processing within the
> module.
> I have tried to use DOM.sinkBitlessEvent (and seeing if I can catch
> this event in onBrowserEvent() ), but that didn't work. Not sure what
> other way I can get that event , or why does the custom event looses
> its customData when within JSNI method

Interesting problem.

Are you sure the event data is kept for the case of js --> js?

I'd eliminate that possibility first. I'm sure it works, but nothing
you've said so far positively eliminates that (admittedly small)
possibility.

If it /is/ kept, then:
0) write an event hander in js (i.e. outside gwt) that calls
addLookupResultHandler
1) load the event handler from step 0 as part of your external library's
load phase
2) hook your addLookupResultHandler to GWT's $wnd object before step 3)
3) fire the event in the library. That will call the event handler
written in step 0

e-lena-s

unread,
Aug 11, 2011, 12:57:57 PM8/11/11
to Google Web Toolkit
Yup, the js--> js event is kept in tact. I can see all the right data
with the console.log.

I'll try your suggestion for alternative way of handling the event

Jeff Chimene

unread,
Aug 11, 2011, 1:09:09 PM8/11/11
to google-we...@googlegroups.com
On 08/11/2011 09:57 AM, e-lena-s wrote:
> Yup, the js--> js event is kept in tact. I can see all the right data
> with the console.log.

OK


> I'll try your suggestion for alternative way of handling the event

Just to be clear, the event handler from step 0 calls the
addLookupResultHandler via GWT's $wnd object. I think you know that, but
I missed that point in the previous post.

Reply all
Reply to author
Forward
0 new messages