How do you listen for custom events in Polymer Dart 1.0?

Question

I've been trying to do something like the following inside a Polymer Dart 1.0 element

@PolymerRegister('some-element')
class SomeElement extends PolymerElement {
    ...
    void fireEvent() {
        fire('someevent');
    }
    ...
}

I then listen for it in this manner

<some-element on-someevent="handleSomeEvent"></some-element>

with the method defined inside the Polymer Element that I'm using in defined thus

@reflectable
void handleSomeEvent([_, __]) {
    ...
}

The problem is I get an

Unhandled exception

which wasn't helpful, and it took me a while to figure out that the above was causing it. If I remove the

@reflectable

annotation from the event handler method, I get the following

method `registered` not defined

I was wondering if there is a special way to handle custom events in Polymer Dart 1.0?

I can handle it this way

on['someevent'].listen(handleSomeEvent);

which does work, it's just I don't see why I shouldn't be able to handle it both ways. I'm thinking I'll be submitting a bug report on this, but I thought I'd put it here and check to see if I've done this correctly, since what I did, apart from using

@reflectable

which is Polymer Dart 1.0 specific, is what they say you should do in Polymer JS whose documentation can be found here

UPDATE I should clarify, this exception happened at load time, when the element was being registered. I'll put the full exception in later, when I have a bit more time.

The exception I'm getting is the following

Exception: Uncaught Error: Unhandled exception:
Reflecting on un-marked type 'JsObjectImpl'
#0      _InstanceMirrorImpl._InstanceMirrorImpl (package:reflectable/src/reflectable_transformer_based.dart:150:9)
#1      ReflectableImpl.reflect (package:reflectable/src/reflectable_transformer_based.dart:1216:16)
#2      _setupReflectableMethods.<anonymous closure>.<anonymous closure> (package:polymer/src/common/polymer_descriptor.dart:151:49)
#3      JsObject._callMethod (dart:js:678)
#4      JsObject.callMethod (dart:js:618)
#5      PolymerRegister.initialize (package:polymer/src/common/polymer_register.dart:19:13)
#6      loadInitializers.<anonymous closure>.<anonymous closure> (package:initialize/src/static_loader.dart:46:32)
#7      _runInitQueue (package:initialize/initialize.dart:35:24)
#8      _runInitQueue.<anonymous closure> (package:initialize/initialize.dart:38:26)
#9     _RootZone.runUnary (dart:async/zone.dart:1165)
#10     _Future._propagateToListeners.handleValueCallback (dart:async/future_impl.dart:502)
#11     _Future._propagateToListeners (dart:async/future_impl.dart:585)
#12     _Future._completeWithValue (dart:async/future_impl.dart:376)
#13     _Future._asyncComplete.<anonymous closure> (dart:async/future_impl.dart:430)
#14     _microtaskLoop (dart:async/schedule_microtask.dart:43)
#15     _microtaskLoopEntry (dart:async/schedule_microtask.dart:52)
#16     _ScheduleImmediateHelper._handleMutation (dart:html:42565)
Stack Trace:
#0      JsObject._callMethod (dart:js:678)
#1      JsObject.callMethod (dart:js:618)
#2      PolymerRegister.initialize (package:polymer/src/common/polymer_register.dart:19:13)
#3      loadInitializers.<anonymous closure>.<anonymous closure> (package:initialize/src/static_loader.dart:46:32)
#4      _runInitQueue (package:initialize/initialize.dart:35:24)
#5      _runInitQueue.<anonymous closure> (package:initialize/initialize.dart:38:26)
#6      _RootZone.runUnary (dart:async/zone.dart:1165)
#7      _Future._propagateToListeners.handleValueCallback (dart:async/future_impl.dart:502)
#8      _Future._propagateToListeners (dart:async/future_impl.dart:585)
#9      _Future._completeWithValue (dart:async/future_impl.dart:376)
#10     _Future._asyncComplete.<anonymous closure> (dart:async/future_impl.dart:430)
#11     _microtaskLoop (dart:async/schedule_microtask.dart:43)
#12     _microtaskLoopEntry (dart:async/schedule_microtask.dart:52)
#13     _ScheduleImmediateHelper._handleMutation (dart:html:42565)

Further Info

Next time I ask for help, I'll just use the exact code I'm using. The method I'm annotating with

@reflectable

is called registered.

@reflectable
void registered([_, __]) {
    ....
}

If I change the name of this method to something else like

@reflectable
void someOtherName([_, __]) {
    ...
}

The exception doesn't occur. Sorry about that, it didn't occur to me the name of the method might have something to do with it. Again sorry, but I still would like some explanation as to why the name of the annotated method matters in this case.

Günter Zöchbauer Günter Zöchbauer · Accepted Answer · 2015-10-26T10:01:58

This is just fine.

@reflectable
void handleSomeEvent([_, __]) {
    ...
}

Can you provide the project in a GitHub repo that allows to reproduce the problem?

An additional method would be

@Listen('someevent')
void handleSomeEvent([_, __]) {
    ...
}

(You don't need to add anything to HTML for this method).

How do you listen for custom events in Polymer Dart 1.0?

Further Info

1 Answers