Titanium

[ALOY-817] Wrong method used to add an event listener when using custom namespace in markup

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2013-09-04T20:57:13.000+0000
Affected Version/sAlloy 1.2.1, Alloy 1.2.0
Fix Version/sAlloy 1.3.0, Alloy 1.2.2, 2013 Sprint 18
ComponentsXML
Labelsqe-testadded
ReporterDavide Cassenti
AssigneeTony Lukasavage
Created2013-09-04T15:53:30.000+0000
Updated2013-09-05T19:30:25.000+0000

Description

Problem description

When adding an onClick event to a Map view (using the Android Map module), instead of using addEventListener, alloy is using on().

Steps to reproduce

1) Create a new Alloy app 2) Use the following code in index.xml:
<Alloy>
  <Window>
    <View id="map2" ns="Alloy.Globals.Map" onClick="report"/>
  </Window>
</Alloy>
Add a report function in index.js:
function report(event) {
  alert('Hello');
}

$.index.open();
Assign the value to Alloy.Globals.Map in alloy.js:
Alloy.Globals.Map = Ti.Platform.osname === 'android' ? require('ti.map') : Ti.Map;

Results

When running the app, the result of the onClick is:
.__views.map2 = Alloy.Globals.Map.createView({
    id: "map2",
    ns: "Alloy.Globals.Map"
});
$.__views.index.add($.__views.map2);
report ? $.__views.map2.on("click", report) : __defers["$.__views.map2!click!report"] = true;
Using the normal Ti.Map, the listener is added using addEventListener.

workaround

Don't specify the event listener in the markup, just do it in the controller
$.map2.addEventListener('click', function(e) {});

Comments

  1. Tony Lukasavage 2013-09-04 PR (master): https://github.com/appcelerator/alloy/pull/239 commit (1_2_X): https://github.com/appcelerator/alloy/commit/05ad3e792d3e5f45a7df592dcbdc82cbd6e07999 test app: https://github.com/appcelerator/alloy/tree/master/test/apps/testing/ALOY-817 This fixed attaching event listeners to developer-defined namespace objects. From now on, only the following markup element types will use on() for event handling. All other will use addEventListener(): * * * * functional test:

    Run test app

    Ensure that the app loads without compile or runtime error

    Check the console output. Ensure that you see all 7 event handlers fire their log messages. The list should contain the following:

       [INFO]  collection change
       [INFO]  model change
       [INFO]  another model change
       [INFO]  button clicked
       [INFO]  map clicked
       [INFO]  window clicked
       [INFO]  empty controller init
       

    If all 7 event handlers fired, it's not completely necessary, but you can inspect the generated code for the "index" and "empty" controllers, making sure that on is used for all models, collection, and controllers while addEventListener is used for everything else, including the map.

  2. Federico Casali 2013-09-05 Verified as fixed with the provided sample code. Also verified checking 'index' and 'empty' controllers, 'on' is used for models, collections and controllers, while addEventListener is used for everything else (window, map , button... ) Titanium SDK .1.3.v20130904134612 Alloy 1.2.2 CLI 3.1.2.GA Node 0.10.13 Closing.

JSON Source