Change event subscription to use simulated DOM events instead of directly calling handler. This allows more flexibility for consumers to register handlers using other patterns than report.on() such as jquery.

Matt Mazzola · Matt Mazzola · commit 7161c017af5f · 2016-07-01T10:29:11.000-07:00
diff --git a/src/embed.ts b/src/embed.ts
@@ -149,16 +149,16 @@ export abstract class Embed {
     off<T>(eventName: string, handler?: service.IEventHandler<T>): void {
         const fakeEvent: service.IEvent<any> = { name: eventName, type: null, id: null, value: null };
         if(handler) {
-            utils.remove(eventHandler => eventHandler.test(fakeEvent) && (eventHandler.handle === handler), this.eventHandlers);
+            this.element.removeEventListener(eventName, <any>handler);
         }
         else {
             const eventHandlersToRemove = this.eventHandlers
                 .filter(eventHandler => eventHandler.test(fakeEvent));
                 
             eventHandlersToRemove
                 .forEach(eventHandlerToRemove => {
-                    utils.remove(eventHandler => eventHandler === eventHandlerToRemove, this.eventHandlers);
-                })
+                    this.element.removeEventListener(eventName, <any>eventHandlerToRemove.handle);
+                });
         }
     }
 
@@ -180,6 +180,8 @@ export abstract class Embed {
             test: (event: service.IEvent<T>) => event.name === eventName,
             handle: handler
         });
+
+        this.element.addEventListener(eventName, <any>handler)
     }
 
     /**
diff --git a/src/service.ts b/src/service.ts
@@ -255,7 +255,7 @@ export class Service {
         }, this.embeds);
 
         if(embed) {
-            embed.handleEvent(event);
+            utils.raiseCustomEvent(embed.element, event.name, event.value);
         }
     }
 
diff --git a/test/test.spec.ts b/test/test.spec.ts
@@ -3395,7 +3395,7 @@ describe('SDK-to-WPMP', function () {
       spyWpmp.onMessageReceived(testData.pageChangedEvent);
 
       // Assert
-      expect(testData.handler).toHaveBeenCalledWith(testData.pageChangedEvent.data.body);
+      expect(testData.handler).toHaveBeenCalledWith(jasmine.objectContaining({ detail: testData.pageChangedEvent.data.body }));
     });
 
     it(`off('eventName', handler) will remove single handler which matches function reference for that event`, function () {
@@ -3458,9 +3458,9 @@ describe('SDK-to-WPMP', function () {
       spyWpmp.onMessageReceived(testData.simulatedEvent);
 
       // Assert
-      expect(testData.handler).toHaveBeenCalledWith(testData.simulatedEvent.data.body);
-      expect(testData.handler2).toHaveBeenCalledWith(testData.simulatedEvent.data.body);
-      expect(testData.handler3).toHaveBeenCalledWith(testData.simulatedEvent.data.body);
+      expect(testData.handler).toHaveBeenCalledWith(jasmine.objectContaining({ detail: testData.simulatedEvent.data.body }));
+      expect(testData.handler2).toHaveBeenCalledWith(jasmine.objectContaining({ detail: testData.simulatedEvent.data.body }));
+      expect(testData.handler3).toHaveBeenCalledWith(jasmine.objectContaining({ detail: testData.simulatedEvent.data.body }));
     });
 
 

Original file line number	Diff line number	Diff line change
`@@ -255,7 +255,7 @@ export class Service {`
`255`	`255`	`}, this.embeds);`
`256`	`256`
`257`	`257`	`if(embed) {`
`258`		`- embed.handleEvent(event);`
	`258`	`+ utils.raiseCustomEvent(embed.element, event.name, event.value);`
`259`	`259`	`}`
`260`	`260`	`}`
`261`	`261`