fix(extension): inject scripts into html document only, close #904

Author: webfansplz

packages/chrome-extension/src/detector.ts

@@ -80,6 +80,6 @@ function detect(win: Window) {
   }, 100)
 }
 
-if (document instanceof Document) {
+if (document instanceof HTMLDocument) {
   detect(window)
 }

packages/chrome-extension/src/devtools-overlay.ts

@@ -1,16 +1,18 @@
-const body = document.getElementsByTagName('body')[0]
+if (document instanceof HTMLDocument) {
+  const body = document.getElementsByTagName('body')[0]
 
-// create detector script
-const detector = document.createElement('script')
-detector.src = chrome.runtime.getURL('dist/detector.js')
-detector.onload = () => {
-  detector.parentNode!.removeChild(detector)
-}
+  // create detector script
+  const detector = document.createElement('script')
+  detector.src = chrome.runtime.getURL('dist/detector.js')
+  detector.onload = () => {
+    detector.parentNode!.removeChild(detector)
+  }
 
-;(document.head || document.documentElement).appendChild(detector)
+  ;(document.head || document.documentElement).appendChild(detector)
 
-window.addEventListener('message', (event) => {
-  if (event.data.key === '__VUE_DEVTOOLS_VUE_DETECTED_EVENT__') {
-    chrome.runtime.sendMessage(event.data.data)
-  }
-}, false)
+  window.addEventListener('message', (event) => {
+    if (event.data.key === '__VUE_DEVTOOLS_VUE_DETECTED_EVENT__') {
+      chrome.runtime.sendMessage(event.data.data)
+    }
+  }, false)
+}

packages/firefox-extension/src/detector.ts

@@ -80,6 +80,6 @@ function detect(win: Window) {
   }, 100)
 }
 
-if (document instanceof Document) {
+if (document instanceof HTMLDocument) {
   detect(window)
 }

packages/firefox-extension/src/devtools-overlay.ts

@@ -1,16 +1,18 @@
-const body = document.getElementsByTagName('body')[0]
+if (document instanceof HTMLDocument) {
+  const body = document.getElementsByTagName('body')[0]
 
-// create detector script
-const detector = document.createElement('script')
-detector.src = chrome.runtime.getURL('dist/detector.js')
-detector.onload = () => {
-  detector.parentNode!.removeChild(detector)
-}
+  // create detector script
+  const detector = document.createElement('script')
+  detector.src = chrome.runtime.getURL('dist/detector.js')
+  detector.onload = () => {
+    detector.parentNode!.removeChild(detector)
+  }
 
-;(document.head || document.documentElement).appendChild(detector)
+  ;(document.head || document.documentElement).appendChild(detector)
 
-window.addEventListener('message', (event) => {
-  if (event.data.key === '__VUE_DEVTOOLS_VUE_DETECTED_EVENT__') {
-    chrome.runtime.sendMessage(event.data.data)
-  }
-}, false)
+  window.addEventListener('message', (event) => {
+    if (event.data.key === '__VUE_DEVTOOLS_VUE_DETECTED_EVENT__') {
+      chrome.runtime.sendMessage(event.data.data)
+    }
+  }, false)
+}

packages/firefox-extension/src/injection.ts

@@ -1,4 +1,4 @@
-if (document instanceof Document) {
+if (document instanceof HTMLDocument) {
   const content = chrome.runtime.getURL('dist/prepare.js')
   const script = document.createElement('script')
   script.src = content