Merge pull request #11300 from electron/external-devtools

Add API to set arbitrary WebContents as devtools

spec/api-web-contents-spec.js

@@ -92,6 +92,22 @@ describe('webContents module', () => {
     })
   })
 
+  describe('setDevToolsWebCotnents() API', () => {
+    it('sets arbitry webContents as devtools', (done) => {
+      let devtools = new BrowserWindow({show: false})
+      devtools.webContents.once('dom-ready', () => {
+        assert.ok(devtools.getURL().startsWith('chrome-devtools://devtools'))
+        devtools.webContents.executeJavaScript('InspectorFrontendHost.constructor.name', (name) => {
+          assert.ok(name, 'InspectorFrontendHostImpl')
+          devtools.destroy()
+          done()
+        })
+      })
+      w.webContents.setDevToolsWebContents(devtools.webContents)
+      w.webContents.openDevTools()
+    })
+  })
+
   describe('isFocused() API', () => {
     it('returns false when the window is hidden', () => {
       BrowserWindow.getAllWindows().forEach((window) => {

spec/webview-spec.js

@@ -643,6 +643,30 @@ describe('<webview> tag', function () {
     })
   })
 
+  describe('setDevToolsWebCotnents() API', () => {
+    it('sets webContents of webview as devtools', (done) => {
+      const webview2 = new WebView()
+      webview2.addEventListener('did-attach', () => {
+        webview2.addEventListener('dom-ready', () => {
+          const devtools = webview2.getWebContents()
+          assert.ok(devtools.getURL().startsWith('chrome-devtools://devtools'))
+          devtools.executeJavaScript('InspectorFrontendHost.constructor.name', (name) => {
+            assert.ok(name, 'InspectorFrontendHostImpl')
+            document.body.removeChild(webview2)
+            done()
+          })
+        })
+        webview.addEventListener('dom-ready', () => {
+          webview.getWebContents().setDevToolsWebContents(webview2.getWebContents())
+          webview.getWebContents().openDevTools()
+        })
+        webview.src = 'about:blank'
+        document.body.appendChild(webview)
+      })
+      document.body.appendChild(webview2)
+    })
+  })
+
   describe('devtools-opened event', () => {
     it('should fire when webview.openDevTools() is called', (done) => {
       const listener = () => {