custom events

src/EventManager.js

@@ -47,8 +47,9 @@ class EventManager {
     eventsConfig = eventsConfig || [];
     for (const eventConfig of eventsConfig) {
       const customEvent = new CustomEvent(
+        eventConfig.name,
         eventConfig.trigger,
-        eventConfig.settings,
+        eventConfig.event || eventConfig.cssSelector,
         eventConfig.handler,
         _digitalData,
         this
@@ -57,9 +58,13 @@ class EventManager {
     }
   }
 
+  addEvent(name, trigger, setting, handler) {
+    const customEvent = new CustomEvent(name, trigger, setting, handler, _digitalData, this);
+    _customEvents.push(customEvent);
+  }
+
   initialize() {
     const events = _digitalData.events;
-    const changes = _digitalData.changes;
 
     // initialize custom events tracking
     for (const customEvent of _customEvents) {
@@ -93,7 +98,7 @@ class EventManager {
         } else {
           events[events.length] = event;
         }
-      }
+      };
     }
 
     // process changes

src/ddManager.js

@@ -419,6 +419,10 @@ ddManager = {
     _customEnricher.addEnrichment(type, prop, handler, options);
   },
 
+  addEvent: (name, trigger, setting, handler) => {
+    _eventManager.addEvent(name, trigger, setting, handler);
+  },
+
   reset: () => {
     if (_ddStorage) {
       _ddStorage.clear();

src/events/CustomEvent.js

@@ -1,15 +1,17 @@
 import trackImpression from './../trackers/trackImpression';
 import trackLink from './../trackers/trackLink';
 import EventHandler from './EventHandler';
+import { error as errorLog } from './../functions/safeConsole';
 
 const TRIGGER_EVENT = 'event';
 const TRIGGER_IMPRESSION = 'impression';
 const TRIGGER_CLICK = 'click';
 
 class CustomEvent {
-  constructor(trigger, settings, handler, digitalData, eventManager) {
+  constructor(name, trigger, setting, handler, digitalData, eventManager) {
+    this.name = name;
     this.trigger = trigger;
-    this.settings = settings;
+    this.setting = setting;
     this.handler = handler;
     this.digitalData = digitalData;
     this.eventManager = eventManager;
@@ -30,30 +32,51 @@ class CustomEvent {
   }
 
   trackEvent() {
-    if (!this.settings.event) return;
+    if (!this.setting) return;
     this.eventManager.addCallback(['on', 'event', (event) => {
-      if (event.name === this.settings.event) {
+      if (event.name === this.setting) {
         const handler = this.newHandler(event);
-        handler.run();
+        const resultEvent = handler.run();
+        if (resultEvent && resultEvent.name && resultEvent.name === event.name) {
+          errorLog(`Custom Event "${this.name}" was disabled: recursion error`);
+        } else {
+          this.fireEvent(resultEvent);
+        }
       }
     }]);
   }
 
   trackImpression() {
-    if (!this.settings.cssSelector) return;
-    trackImpression(this.settings.cssSeelctor, (elements) => {
+    if (!this.setting) return;
+    trackImpression(this.setting, (elements) => {
       const handler = this.newHandler(elements);
-      handler.run();
+      const resultEvent = handler.run();
+      this.fireEvent(resultEvent);
     });
   }
 
   trackClick() {
-    if (!this.settings.cssSelector) return;
-    trackLink(this.settings.cssSelector, (element) => {
+    if (!this.setting) return;
+    trackLink(this.setting, (element) => {
       const handler = this.newHandler(element);
-      handler.run();
+      const resultEvent = handler.run();
+      this.fireEvent(resultEvent);
     });
   }
+
+  fireEvent(event) {
+    if (!event) return;
+    if (typeof event !== 'object') {
+      errorLog(`Custom Event "${this.name}" was disabled: returned event should be object`);
+    }
+    if (!event.name) {
+      errorLog(`Custom Event "${this.name}" was disabled: returned event name is undefined`);
+    }
+    if (!event.source) {
+      event.source = 'DDManager Custom Event';
+    }
+    this.digitalData.events.push(event);
+  }
 }
 
 export default CustomEvent;

test/events/CustomEventsSpec.js

@@ -0,0 +1,94 @@
+import assert from 'assert';
+import EventManager from './../../src/EventManager';
+import fireEvent from './../functions/fireEvent';
+
+describe('CustomEvents', () => {
+
+  let _eventManager;
+  let _digitalData;
+  let _ddListener;
+
+  let btn;
+  let div;
+
+  beforeEach(() => {
+    _digitalData = {
+      page: {
+        categoryId: 1
+      },
+      type: 'product',
+      events: []
+    };
+    _ddListener = [];
+    _eventManager = new EventManager(_digitalData, _ddListener);
+    _eventManager.setSendViewedPageEvent(true);
+
+    // create button
+    btn = document.createElement('button');
+    const t = document.createTextNode('click me');
+    btn.appendChild(t);
+    btn.className = 'test-btn';
+
+    // create div
+    div = document.createElement('div');
+    div.appendChild(btn);
+    div.id = 'test-div';
+
+    document.body.appendChild(div);
+  });
+
+  afterEach(() => {
+    if (_eventManager) {
+      _eventManager.reset();
+      _eventManager = undefined;
+    }
+
+    div.remove();
+    _digitalData.events = [];
+  });
+
+  it('should track custom events', (done) => {
+    _eventManager.import([
+      {
+        name: 'Event: Viewed Product Detail',
+        trigger: 'event',
+        event: 'Viewed Page',
+        handler: function() {
+          return {
+            name: 'Viewed Product Detail',
+          }
+        }
+      },
+      {
+        name: 'Event: Clicked Product',
+        trigger: 'click',
+        cssSelector: '.test-btn',
+        handler: function() {
+          return {
+            name: 'Clicked Product',
+          };
+        },
+      },
+      {
+        name: 'Test Name',
+        trigger: 'impression',
+        cssSelector: '.ddl_product',
+        handler: function() {
+          return {
+            name: 'Viewed Product',
+          };
+        }
+      }
+    ]);
+    _eventManager.initialize();
+
+    fireEvent(btn, 'click');
+
+    setTimeout(() => {
+      assert.equal(_digitalData.events[0].name, 'Viewed Page');
+      assert.equal(_digitalData.events[1].name, 'Viewed Product Detail');
+      assert.equal(_digitalData.events[2].name, 'Clicked Product');
+      done();
+    }, 10);
+  });
+});

test/index.test.js

@@ -16,6 +16,7 @@ import './EventValidatorSpec.js';
 
 // enrichments
 import './enrichments/CustomEnricherSpec';
+import './events/CustomEventsSpec';
 
 // trackers
 import './trackers/trackLinkSpec.js';