fix: wrong use of addEventListener/removeEventListener (codesandbox#897)

Author: cottom

packages/app/src/app/components/ContextMenu/index.js

@@ -12,26 +12,27 @@ class ContextMenu extends React.Component {
       y: 0,
       show: false,
     };
-  }
-  onContextMenu = event => {
-    event.preventDefault();
-    this.mousedown = window.addEventListener('mousedown', mousedownEvent => {
+    this.mousedownCb = mousedownEvent => {
       const { show } = this.state;
 
       if (show && this.el) {
         if (!this.el.contains(mousedownEvent.target)) {
           this.close();
         }
       }
-    });
-
-    this.keydown = window.addEventListener('keydown', keydownEvent => {
+    };
+    this.keydownCb = keydownEvent => {
       const { show } = this.state;
       if (keydownEvent.keyCode === 27 && show) {
         // Escape
         this.close();
       }
-    });
+    };
+  }
+  onContextMenu = event => {
+    event.preventDefault();
+    window.addEventListener('mousedown', this.mousedownCb);
+    window.addEventListener('keydown', this.keydownCb);
 
     this.setState({
       show: true,
@@ -41,8 +42,8 @@ class ContextMenu extends React.Component {
   };
 
   close = () => {
-    window.removeEventListener('keydown', this.keydown);
-    window.removeEventListener('mousedown', this.mousedown);
+    window.removeEventListener('keydown', this.keydownCb);
+    window.removeEventListener('mousedown', this.mousedownCb);
     this.setState({
       show: false,
     });