Real restart in dev mode

Summary: To test plugin installation I need to restart Flipper often, however restart in dev mode is not "true" restart - instead it just reloads the window and doesn't load freshly installed plugins. To make my life easier I have implemented more realistic way for restart in dev mode.

Reviewed By: jknoxville

Differential Revision: D19770263

fbshipit-source-id: 8755663746dc265e0826ed79b9782e073132537f

scripts/start-dev-server.js

@@ -27,7 +27,9 @@ const convertAnsi = new Convert();
 const DEFAULT_PORT = process.env.PORT || 3000;
 const STATIC_DIR = path.join(__dirname, '..', 'static');
 
-function launchElectron({bundleURL, electronURL}) {
+let shutdownElectron = undefined;
+
+function launchElectron({devServerURL, bundleURL, electronURL}) {
   const args = [
     path.join(STATIC_DIR, 'index.js'),
     '--remote-debugging-port=9222',
@@ -41,17 +43,27 @@ function launchElectron({bundleURL, electronURL}) {
       SONAR_ROOT: process.cwd(),
       BUNDLE_URL: bundleURL,
       ELECTRON_URL: electronURL,
+      DEV_SERVER_URL: devServerURL,
     },
     stdio: 'inherit',
   });
 
-  proc.on('close', () => {
+  const electronCloseListener = () => {
     process.exit();
-  });
+  };
 
-  process.on('exit', () => {
+  const processExitListener = () => {
     proc.kill();
-  });
+  };
+
+  proc.on('close', electronCloseListener);
+  process.on('exit', processExitListener);
+
+  return () => {
+    proc.off('close', electronCloseListener);
+    process.off('exit', processExitListener);
+    proc.kill();
+  };
 }
 
 function startMetroServer(app) {
@@ -105,6 +117,18 @@ function startAssetServer(port) {
     next();
   });
 
+  app.post('/_restartElectron', (req, res) => {
+    if (shutdownElectron) {
+      shutdownElectron();
+    }
+    shutdownElectron = launchElectron({
+      devServerURL: `http://localhost:${port}`,
+      bundleURL: `http://localhost:${port}/src/init.bundle`,
+      electronURL: `http://localhost:${port}/index.dev.html`,
+    });
+    res.end();
+  });
+
   app.get('/', (req, res) => {
     fs.readFile(path.join(STATIC_DIR, 'index.dev.html'), (err, content) => {
       res.end(content);
@@ -221,7 +245,8 @@ function outputScreen(socket) {
   const socket = await addWebsocket(server);
   await startMetroServer(app);
   outputScreen(socket);
-  launchElectron({
+  shutdownElectron = launchElectron({
+    devServerURL: `http://localhost:${port}`,
     bundleURL: `http://localhost:${port}/src/init.bundle`,
     electronURL: `http://localhost:${port}/index.dev.html`,
   });

src/utils/restartFlipper.tsx

@@ -15,10 +15,10 @@ export default function restart() {
     remote.app.relaunch();
     remote.app.exit();
   } else {
-    // Relaunching the process doesn't work in dev mode
+    // Relaunching the process with the standard way doesn't work in dev mode.
-    // because it just launches an empty electron shell.
+    // So instead we're sending a signal to dev server to kill the current instance of electron and launch new.
-    // Instead, approximate it by doing a refresh.
+    fetch(`${remote.process.env.DEV_SERVER_URL}/_restartElectron`, {
-    // Should be roughly equivalent but there may be some differences.
+      method: 'POST',
-    remote.getCurrentWindow().reload();
+    });
   }
 }