Merge pull request #3593 from leavest/wheel-event

Fix bug 56+ chrome can't prevent default wheel events.
weaveworks · Apr 12, 2019 · 9e4e8d3 · 9e4e8d3
2 parents 7f68140 + 16c53a7
commit 9e4e8d3
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/client/app/scripts/components/zoomable-canvas.js b/client/app/scripts/components/zoomable-canvas.js
@@ -63,10 +63,16 @@ class ZoomableCanvas extends React.Component {
 
     this.updateZoomLimits(this.props);
     this.restoreZoomState(this.props);
+    document
+      .getElementById('canvas')
+      .addEventListener('wheel', this.handleZoom, { passive: false });
   }
 
   componentWillUnmount() {
     this.debouncedCacheZoom.cancel();
+    document
+      .getElementById('canvas')
+      .removeEventListener('wheel', this.handleZoom, { passive: false });
   }
 
   componentWillReceiveProps(nextProps) {
@@ -104,7 +110,7 @@ class ZoomableCanvas extends React.Component {
 
     return (
       <div className="zoomable-canvas">
-        <svg id="canvas" className={className} onClick={this.props.onClick} onWheel={this.handleZoom}>
+        <svg id="canvas" className={className} onClick={this.props.onClick}>
           <Logo transform="translate(24,24) scale(0.25)" />
           <g className="zoom-content">
             {this.props.children(this.state)}