Move context-menu init code (#553)

Author: Guillaume Chau

src/backend/hook.js

@@ -1,5 +1,3 @@
-import { findRelatedComponent } from './utils'
-
 // this script is injected into every page.
 
 /**
@@ -85,21 +83,4 @@ export function installHook (window) {
       return hook
     }
   })
-
-  // Start recording context menu when Vue is detected
-  // event if Vue devtools are not loaded yet
-  document.addEventListener('contextmenu', event => {
-    const el = event.target
-    if (el) {
-      // Search for parent that "is" a component instance
-      const instance = findRelatedComponent(el)
-      if (instance) {
-        window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__ = true
-        window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__ = instance
-        return
-      }
-    }
-    window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__ = null
-    window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__ = null
-  })
 }

src/backend/index.js

@@ -4,6 +4,7 @@
 import { highlight, unHighlight, getInstanceRect } from './highlighter'
 import { initVuexBackend } from './vuex'
 import { initEventsBackend } from './events'
+import { findRelatedComponent } from './utils'
 import { stringify, classify, camelize, set, parse, getComponentName } from '../util'
 import ComponentSelector from './component-selector'
 import config from './config'
@@ -32,6 +33,8 @@ export function initBackend (_bridge) {
   }
 
   config(bridge)
+
+  initRightClick()
 }
 
 function connect () {
@@ -725,3 +728,22 @@ function setStateValue ({ id, path, value, newKey, remove }) {
     }
   }
 }
+
+function initRightClick () {
+  // Start recording context menu when Vue is detected
+  // event if Vue devtools are not loaded yet
+  document.addEventListener('contextmenu', event => {
+    const el = event.target
+    if (el) {
+      // Search for parent that "is" a component instance
+      const instance = findRelatedComponent(el)
+      if (instance) {
+        window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__ = true
+        window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__ = instance
+        return
+      }
+    }
+    window.__VUE_DEVTOOLS_CONTEXT_MENU_HAS_TARGET__ = null
+    window.__VUE_DEVTOOLS_CONTEXT_MENU_TARGET__ = null
+  })
+}