openlayers/tests/Events.html

   1 <html>
   2 <head>
   3   <script src="../lib/OpenLayers.js"></script>
   4   <script type="text/javascript">
   5     var isMozilla = (navigator.userAgent.indexOf("compatible") == -1);
   6     var map;
   7     var a;
   8
   9     function test_Events_constructor (t) {
  10         var mapDiv = OpenLayers.Util.getElement('map');
  11         var obj = {result: 0};
  12         var eventTypes = ["doThingA", "doThingB", "doThingC"];
  13         var browserTypes = OpenLayers.Events.prototype.BROWSER_EVENTS;
  14
  15         var totalTests = 4 + 2*eventTypes.length + 2*browserTypes.length;
  16
  17         t.plan( totalTests );
  18
  19         events = new OpenLayers.Events(obj, mapDiv, eventTypes);
  20
  21         t.ok( events instanceof OpenLayers.Events, "new OpenLayers.Control returns object" );
  22
  23         t.ok(events.object ==obj, " 'object' property correctly set");
  24         t.ok(events.element == mapDiv, " 'element' property correctly set");
  25
  26
  27         for (var i = 0; i < browserTypes.length; i++) {
  28             var type = browserTypes[i];
  29             t.ok( events.listeners[type] instanceof Array, "browser event: " + type + " correctly registered" );
  30             t.ok( OpenLayers.Util.indexOf(events.eventTypes, type) != -1, "browser type " + type + "' correctly added to eventTypes array");
  31         }
  32         for (var i = 0; i < eventTypes.length; i++) {
  33             var type = eventTypes[i];
  34             t.ok( events.listeners[type] instanceof Array, "custom event: " + type + " correctly registered");
  35             t.ok( OpenLayers.Util.indexOf(events.eventTypes, type) != -1, "eventType " + type + "' correctly added to eventTypes array");
  36         }
  37
  38         // default/nulls
  39         events = new OpenLayers.Events(null, null, null);
  40         t.ok( events.listeners != null,
  41               "init of Events with null object/element/eventTypes still creates listeners array" );
  42     }
  43
  44     function test_Events_register(t){
  45         t.plan(4);
  46
  47         var ev = {
  48             'object': {},
  49             'listeners': {
  50                 'listenerA': {
  51                     'push': function(options){
  52                                 gObjA = options.obj;
  53                                 gFuncA = options.func;
  54                             }
  55                 },
  56                 'listenerB': {
  57                     'push': function(options){
  58                                 gObjB = options.obj;
  59                                 gFuncB = options.func;
  60                             }
  61                 }
  62             },
  63             'eventTypes': ['listenerA', 'listenerB']
  64         };
  65
  66         var type = null;
  67         var object = null;
  68         var func = null;
  69
  70       //func null
  71         gObjA = null; gFuncA = null; gObjB = null; gFuncB = null;
  72         OpenLayers.Events.prototype.register.apply(ev, [type, object, func]);
  73         t.ok((gObjA == null) && (gFuncA == null) &&
  74              (gObjB == null) && (gFuncB == null), "no push called func null");
  75
  76       //valid func, type not in ev.eventTypes
  77         func = function() {};
  78         gObjA = null; gFuncA = null; gObjB = null; gFuncB = null;
  79         OpenLayers.Events.prototype.register.apply(ev, [type, object, func]);
  80         t.ok((gObjA == null) && (gFuncA == null) &&
  81              (gObjB == null) && (gFuncB == null), "no push called func null");
  82
  83       //valid func, type in ev.eventTypes, null obj
  84         type = 'listenerA';
  85         gObjA = null; gFuncA = null; gObjB = null; gFuncB = null;
  86         OpenLayers.Events.prototype.register.apply(ev, [type, object, func]);
  87         t.ok((gObjA == ev.object) && (gFuncA == func) &&
  88              (gObjB == null) && (gFuncB == null), "push called on listenerA's mock array when type passed in 'listenerA'. events.object taken since obj is null.");
  89
  90       //valid func, type in ev.eventTypes, valid obj
  91         type = 'listenerB';
  92         object = {};
  93         gObjA = null; gFuncA = null; gObjB = null; gFuncB = null;
  94         OpenLayers.Events.prototype.register.apply(ev, [type, object, func]);
  95         t.ok((gObjA == null) && (gFuncA == null) &&
  96              (gObjB == object) && (gFuncB == func), "push called on listenerB's mock array when type passed in 'listenerB'.");
  97
  98     }
  99
 100     function test_Events_register_unregister(t) {
 101
 102         t.plan( 18 );
 103
 104         var mapDiv = OpenLayers.Util.getElement('map');
 105         var obj = {result: 0};
 106         var eventTypes = ["doThingA", "doThingB", "doThingC"];
 107
 108         events = new OpenLayers.Events(obj, mapDiv, eventTypes);
 109
 110         var func = function () { this.result++ }
 111         events.register( "doThingA", obj, func );
 112
 113         var listenerList = events.listeners["doThingA"];
 114         t.eq( listenerList.length, 1, "register correctly adds to event.listeners" );
 115         t.ok( listenerList[0].obj == obj, "obj property correctly registered");
 116         t.ok( listenerList[0].func == func, "func property correctly registered");
 117
 118         var func2 = function () { this.result-- }
 119         events.register( "doThingA", obj, func2 );
 120
 121         var listenerList = events.listeners["doThingA"];
 122         t.eq( listenerList.length, 2, "register correctly appends new callback to event.listeners[doThingA]" );
 123         t.ok( listenerList[1].obj == obj, "obj property correctly registered");
 124         t.ok( listenerList[1].func == func2, "func property correctly registered");
 125
 126         var func3 = function () { this.result = this.result + 3; }
 127         events.register( "doThingA", null, func3 );
 128
 129         var listenerList = events.listeners["doThingA"];
 130         t.eq( listenerList.length, 3, "register correctly appends new callback to event.listeners[doThingA] even when obj passed in is null" );
 131         t.ok( listenerList[2].obj == obj, "obj is correctly set to Events.object default when null is passed in.");
 132         t.ok( listenerList[2].func == func3, "func property correctly registered");
 133
 134         events.register( "doThingA", obj, null);
 135
 136         var listenerList = events.listeners["doThingA"];
 137         t.eq( listenerList.length, 3, "register correctly does not append null callback to event.listeners[doThingA] even when obj passed in is null" );
 138
 139         events.register( "chicken", obj, func);
 140         t.ok( events.listeners["chicken"] == null, "register() does nothing on attempt to register un-enabled event");
 141
 142         events.unregister("doThingA", obj, null);
 143         var listenerList = events.listeners["doThingA"];
 144         t.eq( listenerList.length, 3, "trying to unregister a null callback does nothing -- but doesnt crash :-)" );
 145
 146         events.unregister("doThingA", obj, func);
 147         var found = false;
 148         for (var i = 0; i < listenerList.length; i++) {
 149             var listener = listenerList[i];
 150             if (listener.obj == obj && listener.func == func) {
 151                 found = true;
 152             }
 153         }
 154         t.ok( (listenerList.length == 2) && !found, "unregister correctly removes callback" );
 155
 156         events.unregister("doThingA", null, func3);
 157         var found = false;
 158         for (var i = 0; i < listenerList.length; i++) {
 159             var listener = listenerList[i];
 160             if (listener.obj == obj && listener.func == func) {
 161                 found = true;
 162             }
 163         }
 164         t.ok( (listenerList.length == 1) && !found, "unregister correctly removes callback when no obj specified" );
 165
 166         var func4 = function () { this.result = "chicken"; }
 167         events.unregister("doThingA", obj, func4);
 168         t.ok( (listenerList.length == 1), "unregister does not bomb if you try to remove an unregistered callback" );
 169
 170         var obj2 = { chicken: 151 };
 171         events.unregister("doThingA", obj2, func2);
 172         t.ok( (listenerList.length == 1), "unregister does not bomb or accidntally remove if you try to remove a valid callback on a valid event type, but with the wrong context object" );
 173
 174         events.unregister("doThingA", obj, null);
 175         t.ok( (listenerList.length == 1), "unregister does not bomb if you try to remove a null callback" );
 176
 177         events.unregister("chicken", null, func3);
 178         t.ok( events.listeners["chicken"] == null, "unregistering an event that is not enabled does not wierdly enable it -- or cause a script error")
 179
 180
 181     }
 182
 183     function test_Events_remove(t) {
 184
 185         t.plan( 2 );
 186
 187         var mapDiv = OpenLayers.Util.getElement('map');
 188         var obj = {result: 0};
 189         var eventTypes = ["doThingA", "doThingB", "doThingC"];
 190
 191         events = new OpenLayers.Events(obj, mapDiv, eventTypes);
 192
 193         var func = function () { this.result++ }
 194         var func2 = function () { this.result-- }
 195         var func3 = function () { this.result = this.result + 3; }
 196
 197         events.register( "doThingA", obj, func );
 198         events.register( "doThingA", obj, func2 );
 199         events.register( "doThingA", null, func3 );
 200
 201         events.remove("doThingA");
 202
 203         t.eq( events.listeners["doThingA"].length, 0, "remove() correctly clears the event listeners" );
 204
 205         events.remove("chicken");
 206         t.ok( events.listeners["chicken"] == null, "remove on non-enabled event does not break or accidentally enable the event");
 207
 208     }
 209
 210     function test_Events_triggerEvent(t) {
 211
 212         t.plan(13);
 213
 214         var mapDiv = OpenLayers.Util.getElement('map');
 215         var obj = {result: 0};
 216         var eventTypes = ["doThingA", "doThingB", "doThingC"];
 217
 218         events = new OpenLayers.Events(obj, mapDiv, eventTypes);
 219
 220
 221         var func = function () { this.result++ }
 222         events.register( "doThingA", obj, func );
 223
 224         events.triggerEvent("doThingA", {});
 225         t.eq( obj.result, 1, "result is 1 after we call triggerEvent" );
 226         events.triggerEvent("doThingA");
 227         t.eq( obj.result, 2, "result is 2 after we call triggerEvent with no event" );
 228
 229         var funcB = function() { this.FUNK = "B"; return false; }
 230         events.register( "doThingA", obj, funcB);
 231
 232         events.triggerEvent("doThingA");
 233         t.ok ((obj.result == 3) && (obj.FUNK == "B"), "executing multiple callbacks works")
 234
 235         var funcZ = function() { this.FUNK = "Z"; }
 236         events.register( "doThingA", obj, funcZ);
 237
 238         events.triggerEvent("doThingA");
 239         t.ok ((obj.result == 4) && (obj.FUNK == "B"), "executing multiple callbacks works, and when one returns false, it stops chain correctly")
 240
 241
 242         var func2 = function() { this.result = this.result + 10; }
 243         events.register( "doThingB", null, func2);
 244
 245         events.triggerEvent("doThingB");
 246         t.eq( obj.result, 14, "passing a null object default gets set correctly");
 247
 248         //no specific t.ok for this one, but if it breaks, you will know it.
 249         events.triggerEvent("chicken");
 250
 251         events = new OpenLayers.Events(null, mapDiv, eventTypes);
 252
 253         // a is global variable (context-irrelevant)
 254         a = 0;
 255         var func = function () { a = 5; }
 256         events.register( "doThingC", null, func );
 257         events.triggerEvent("doThingC");
 258
 259         t.eq(a, 5, "if Events has no object set and an event is registered also with no object, triggerEvent() calls it without trying to set the context to null");
 260
 261         // trigger events with additional arguments
 262         eventTypes = ["something"];
 263         events = new OpenLayers.Events(null, null, eventTypes);
 264         var instance = {id: Math.random()};
 265         var listener = function(obj) {
 266             t.eq(this.id, instance.id,
 267                  "listener called with proper scope");
 268             t.eq(arguments.length, 1,
 269                  "listener called with a single argument");
 270             t.eq(typeof arguments, "object",
 271                  "listener called with an object");
 272             t.eq(obj.foo, evt.foo,
 273                  "foo property set on the layer");
 274         };
 275         events.register("something", instance, listener);
 276         var evt = {
 277             id: Math.random(),
 278             "foo": "bar"
 279         };
 280         events.triggerEvent("something", evt);
 281         events.unregister("something", instance, listener);
 282
 283         // test return from triggerEvent
 284         var listener1 = function() {
 285             return "foo";
 286         }
 287         var listener2 = function() {
 288             return false;
 289         }
 290         var listener3 = function() {
 291             t.fail("never call me again!");
 292         }
 293         events.register("something", instance, listener1);
 294         var ret = events.triggerEvent("something", evt);
 295         t.eq(ret, "foo", "correct return from single listener");
 296
 297         events.register("something", instance, listener2);
 298         ret = events.triggerEvent("something", evt);
 299         t.eq(ret, false, "correct return for two listeners");
 300
 301         events.register("something", instance, listener3);
 302         ret = events.triggerEvent("something", evt);
 303         t.eq(ret, false, "correct return for three listeners where second cancels");
 304
 305         events.unregister("something", instance, listener1);
 306         events.unregister("something", instance, listener2);
 307         events.unregister("something", instance, listener3);
 308
 309     }
 310
 311     function test_Events_destroy (t) {
 312         t.plan(2);
 313
 314         var div   = OpenLayers.Util.getElement('test');
 315         var obj   = {};
 316         var events = new OpenLayers.Events(obj, div);
 317
 318         // +1 because of blocking dragstart in attachToElement()
 319         t.eq(OpenLayers.Event.observers[div._eventCacheID].length,
 320              OpenLayers.Events.prototype.BROWSER_EVENTS.length + 1,
 321              "construction creates new arrayin hash, registers appropriate events");
 322
 323         events.destroy();
 324         events = null;
 325         t.eq(OpenLayers.Event.observers["test"], null,
 326              "destruction removes the event observer from hash");
 327     }
 328
 329     function test_Event(t) {
 330         t.plan(24);
 331
 332         var div   = OpenLayers.Util.getElement('test');
 333         var name = "mouseover";
 334         var func = function() {};
 335
 336       //1st elem 1st listener
 337         OpenLayers.Event.observe(div, name, func);
 338
 339         var cacheID = div._eventCacheID;
 340         t.ok(cacheID, "element given new cache id");
 341
 342         var elementObservers = OpenLayers.Event.observers[cacheID];
 343
 344         t.ok(elementObservers, "new cache bucket made for event");
 345         t.eq(elementObservers.length, 1, "one listener registered");
 346
 347         var listener = elementObservers[0];
 348
 349         t.ok(listener.element == div, "element registered");
 350         t.eq(listener.name, name, "name registered");
 351         t.ok(listener.observer == func, "function registered");
 352         t.eq(listener.useCapture, false, "useCapture defaults to false");
 353
 354       //1st elem 2nd listener
 355         name = "mouseout";
 356         var newFunc = function() {};
 357
 358         OpenLayers.Event.observe(div, name, newFunc, true);
 359         var newCacheID = div._eventCacheID;
 360         t.eq(newCacheID, cacheID, "element's cache id not overridden");
 361
 362         t.eq(elementObservers.length, 2, "listener added to existing bucket");
 363
 364         var listener = elementObservers[1];
 365
 366         t.ok(listener.element == div, "element registered");
 367         t.eq(listener.name, name, "name registered");
 368         t.ok(listener.observer == newFunc, "function registered");
 369         t.eq(listener.useCapture, true, "useCapture correctly registered");
 370
 371       //2st elem 1st listener
 372         div = OpenLayers.Util.getElement('test2');
 373         OpenLayers.Event.observe(div, name, func);
 374
 375         var cacheID = div._eventCacheID;
 376         t.ok(cacheID, "new element given new cache id");
 377         t.ok(cacheID != newCacheID, "new cache id is unique");
 378
 379         elementObservers = OpenLayers.Event.observers[cacheID];
 380
 381         t.ok(elementObservers, "new cache bucket made for event");
 382         t.eq(elementObservers.length, 1, "one listener registered");
 383
 384         var listener = elementObservers[0];
 385
 386         t.ok(listener.element == div, "element registered");
 387         t.eq(listener.name, name, "name registered");
 388         t.ok(listener.observer == func, "function registered");
 389         t.eq(listener.useCapture, false, "useCapture defaults to false");
 390
 391       //stopObservingElement by element
 392         OpenLayers.Event.stopObservingElement(div);
 393         elementObservers = OpenLayers.Event.observers[cacheID];
 394         t.ok(elementObservers == null, "stopObservingElement by elem works");
 395
 396       //stopObservingElement by id
 397         OpenLayers.Event.stopObservingElement("test");
 398         elementObservers = OpenLayers.Event.observers[newCacheID];
 399         t.ok(elementObservers == null, "stopObservingElement by id works");
 400
 401
 402       //unloadCache by element
 403         OpenLayers.Event.observe(div, name, func);
 404
 405         OpenLayers.Event.unloadCache();
 406
 407         elementObservers = OpenLayers.Event.observers[cacheID];
 408         t.ok(elementObservers == null, "stopObservingElement by elem works");
 409
 410
 411     }
 412
 413     function test_Events_addEventType(t) {
 414
 415         t.plan( 8 );
 416
 417         var mapDiv = OpenLayers.Util.getElement('map');
 418         var obj = {result: 0};
 419         var eventTypes = ["doThingA", "doThingB"];
 420
 421         events = new OpenLayers.Events(obj, mapDiv, eventTypes);
 422
 423
 424         t.eq( events.listeners["doThingA"].length, 0, "event type passed as passed as param to OpenLayers.Events constructor correctly set up" );
 425         t.eq( events.listeners["doThingB"].length, 0, "event type passed as passed as param to OpenLayers.Events constructor correctly set up" );
 426
 427         var newEventType = "onFoo";
 428         t.ok( events.listeners[newEventType] == null, "event type not yet registered has null entry in listeners array");
 429         t.ok( OpenLayers.Util.indexOf(events.eventTypes, newEventType) == -1, "event type not yet registered not in eventTypes array");
 430
 431         events.addEventType(newEventType);
 432         t.eq( events.listeners[newEventType].length, 0, "event type passed to addEventType correctly set up" );
 433         t.ok( OpenLayers.Util.indexOf(events.eventTypes, newEventType) != -1, "event type passed to addEventType in eventTypes array");
 434
 435         var func = function () {};
 436         events.register( "doThingA", obj, func );
 437         t.eq( events.listeners["doThingA"].length, 1, "listener correctly registered" );
 438
 439         events.addEventType("doThingsA");
 440         t.eq( events.listeners["doThingA"].length, 1, "event type passed to addEventType correctly does nothing if clashes with already defined event type" );
 441     }
 442
 443     /** HACK HACK HACK Deprecated This test should be removed in 3.0 **/
 444     function test_Events_globalEventObject(t) {
 445         t.plan(1);
 446         t.ok(Event.stop, "a stop() function exists on the global JS Event object, if indeed it exists. This is legacy deprecated and will be gone in 3.0");
 447     }
 448
 449
 450   </script>
 451 </head>
 452 <body>
 453     <div id="map" style="width: 1024px; height: 512px;"/>
 454     <div id="test"></div>
 455     <div id="test2"></div>
 456 </body>
 457 </html>