Fix socket port problem when open two window instance of Electron

firejune · May 26, 2016 · 5404c05 · 5404c05
1 parent b515265
commit 5404c05
Show file tree

Hide file tree

Showing 2 changed files with 72 additions and 54 deletions.
diff --git a/src/backend.js b/src/backend.js
@@ -10,6 +10,7 @@
  */
 'use strict';
 
+var portfinder = require('portfinder');
 var Agent = require('./agent/Agent');
 var BananaSlugBackendManager = require('./plugins/BananaSlug/BananaSlugBackendManager');
 var Bridge = require('./agent/Bridge');
@@ -24,33 +25,40 @@ setInterval(function() {
 }, 100);
 
 
-var ws = require('ws');
-var server = new ws.Server({ port: 8097 });
-var connected = false;
-server.on('connection', function(socket) {
-  if (connected) {
-    console.warn('only one connection allowed at a time');
-    socket.close();
-    return;
-  }
-  connected = true;
-  socket.onerror = function (err) {
-    connected = false;
-    console.log('Error with websocket connection', err);
-  };
+portfinder.getPort((err, port) => {
+  // `port` is guaranteed to be a free port
+  // in this scope.
 
-  socket.onclose = function () {
-    connected = false;
-    console.log('Connection to RN closed');
-  };
+  var ws = require('ws');
+  var server = new ws.Server({ port });
+  var connected = false;
+  server.on('connection', (socket) => {
+    if (connected) {
+      console.warn('only one connection allowed at a time');
+      socket.close();
+      return;
+    }
+    connected = true;
+    socket.onerror = (err) => {
+      connected = false;
+      console.log('Error with websocket connection', err);
+    };
+
+    socket.onclose = () => {
+      connected = false;
+      console.log('Connection to RN closed');
+    };
+
+    socket.onmessage = (evt) => {
+      setup(socket);
+    };
+  });
 
-  socket.onmessage = function (evt) {
-    setup(socket);
-  };
-});
+  server.on('error', function (e) {
+    console.error('Failed to start the DevTools server', e);
+  });
 
-server.on('error', function (e) {
-  console.error('Failed to start the DevTools server', e);
+  window.__REACT_DEVTOOLS_GLOBAL_HOOK__.prot = port;
 });
 
 function setup(socket) {

diff --git a/src/panel.js b/src/panel.js
@@ -67,41 +67,51 @@ var config: Props = {
       }
     });
   },
+  getPort(done) {
+    chrome.devtools.inspectedWindow.eval('window.__REACT_DEVTOOLS_GLOBAL_HOOK__.prot', (port, err) => {
+      if (err) {
+        return console.error('Failed get server port', err);
+      }
+      done(port);
+    });
+  },
   inject(done) {
-    var disconnected = false;
-    var ws = new WebSocket('ws://localhost:8097');
-    ws.onopen = function() {
-      var wall = {
-        listen(fn) {
-          ws.onmessage = function (evt) {
-	          var data = JSON.parse(evt.data);
-            fn(data.payload);
-          };
-        },
-        send(data) {
+    this.getPort(port => {
+      var disconnected = false;
+      var ws = new WebSocket(`ws://localhost:${port}`);
+      ws.onopen = function() {
+        var wall = {
+          listen(fn) {
+            ws.onmessage = function (evt) {
+  	          var data = JSON.parse(evt.data);
+              fn(data.payload);
+            };
+          },
+          send(data) {
+            if (disconnected) {
+              return;
+            }
+
+            var data = JSON.stringify({
+  	          source: 'react-devtools-content-script',
+  	          payload: data
+            });
+
+            ws.send(data);
+          }
+        };
+
+    	  done(wall, () => {
           if (disconnected) {
             return;
           }
-
-          var data = JSON.stringify({
-	          source: 'react-devtools-content-script',
-	          payload: data
-          });
-
-          ws.send(data);
-        }
+          ws.close();
+        });
       };
-
-  	  done(wall, () => {
-        if (disconnected) {
-          return;
-        }
-        ws.close();
-      });
-    };
-    ws.onclose = function () {
-      disconnected = true;
-    };
+      ws.onclose = function () {
+        disconnected = true;
+      };
+    });
   }
 };