fix(zoomscroll): fix using of incorrect offsetX/Y values for zoom on Gecko Browsers

close #83

lib/features/zoomscroll/ZoomScroll.js

@@ -51,8 +51,23 @@ function ZoomScroll(events, canvas) {
 
         canvas.scroll(delta);
       } else {
+        var offset = {};
+
+        // Gecko Browser should use _offsetX
+        if(!event.originalEvent.offsetX) {
+          offset = {
+            x: event.originalEvent._offsetX,
+            y: event.originalEvent._offsetY
+          };
+        } else {
+          offset = {
+            x: event.offsetX,
+            y: event.offsetY
+          };
+        }
+
         // zoom in relative to diagram {x,y} coordinates
-        zoom(y, { x: event.offsetX, y: event.offsetY });
+        zoom(y, offset);
       }
 
       event.preventDefault();
@@ -72,3 +87,31 @@ function ZoomScroll(events, canvas) {
 ZoomScroll.$inject = [ 'eventBus', 'canvas' ];
 
 module.exports = ZoomScroll;
+
+// Thx to https://bugzilla.mozilla.org/show_bug.cgi?id=69787#c37
+// for providing a work around for missing offsetX in Gecko
+Object.defineProperties(MouseEvent.prototype, {
+  _offsetRelativeElement: {
+    get: function() {
+      var element = this.target;
+      while (['block', 'inline-block', 'list-item', 'table', 'inline-table', 'table-caption',
+        'table-column', 'table-colgroup', 'table-header-group', 'table-row-group', 'table-footer-group',
+        'table-row', 'table-cell'].indexOf(window.getComputedStyle(element).display) === -1) {
+
+        element = element.parentNode;
+      }
+
+      return element;
+    }
+  },
+  _offsetX: {
+    get: function() {
+      return this.clientX - this._offsetRelativeElement.getBoundingClientRect().left;
+    }
+  },
+  _offsetY: {
+    get: function() {
+      return this.clientY - this._offsetRelativeElement.getBoundingClientRect().top;
+    }
+  }
+});