JS apps support 1/n

Summary:
### Connecting Flipper with JS apps by using electron's BrowserWindow and IPC

1. UI: there is a menu item in Devices tab which opens JS Emulator Launcher Sheet. Here we can configure URL to open and initial size of the window.
2. BrowserWindow, preloaded js: there is SupportJSClientPreload.js which initialize communication between flipper and app via electron's ipc
3. On flipper's side there is src/utils/js-client/serverUtils.tsx which contains most of JS emulator related code
4. Extracting of FlipperClientConnection: since we don't use RScocket to communicate with JS app I extracted needed methods to FlipperClientConnection (located in Client) and partly implemented them in JSClientFlipperConnection (requestResponse is just send a message now, doesn't return actual result)

Reviewed By: jknoxville

Differential Revision: D18572882

fbshipit-source-id: 56d1ca1a60ed2e51329b917021a09382cbb1ceec

static/SupportJSClientPreload.js

@@ -0,0 +1,90 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+// ==============
+// Preload script
+// ==============
+const {remote, ipcRenderer} = require('electron');
+
+let FlipperMainWindowId = 0;
+
+ipcRenderer.on('parent-window-id', (event, message) => {
+  FlipperMainWindowId = message;
+});
+
+let FlipperIsClientInit = false;
+let FlipperMemoizedPlugins;
+
+function initClient(plugins) {
+  if (FlipperIsClientInit) {
+    return;
+  }
+  if (plugins) {
+    FlipperMemoizedPlugins = plugins;
+  }
+  if (FlipperMainWindowId != 0) {
+    ipcRenderer.sendTo(FlipperMainWindowId, 'from-js-emulator-init-client', {
+      command: 'initClient',
+      windowId: remote.getCurrentWebContents().id,
+      payload: {
+        plugins: plugins ? plugins : FlipperMemoizedPlugins,
+        appName: 'kite/weblite',
+      },
+    });
+    FlipperIsClientInit = true;
+  }
+}
+
+window.FlipperWebviewBridge = {
+  registerPlugins: function(plugins) {
+    console.log(plugins);
+    if (FlipperMainWindowId != 0) {
+      ipcRenderer.sendTo(FlipperMainWindowId, 'from-js-emulator', {
+        command: 'registerPlugins',
+        payload: plugins,
+      });
+    }
+  },
+  start: function() {
+    console.log('start');
+
+    if (FlipperMainWindowId != 0) {
+      ipcRenderer.sendTo(FlipperMainWindowId, 'from-js-emulator', {
+        command: 'start',
+        payload: null,
+      });
+    }
+  },
+  sendFlipperObject: function(plugin, method, data) {
+    console.log(plugin, method, data);
+    initClient();
+    if (FlipperMainWindowId != 0) {
+      ipcRenderer.sendTo(FlipperMainWindowId, 'from-js-emulator', {
+        command: 'sendFlipperObject',
+        payload: {
+          api: plugin,
+          method: method,
+          params: data,
+        },
+      });
+    }
+  },
+  isFlipperSupported: true,
+  initClient: initClient,
+};
+
+ipcRenderer.on('message-to-plugin', (event, message) => {
+  const flipper = window.flipper;
+  if (!flipper) {
+    return;
+  }
+  const receiver = flipper.FlipperWebviewMessageReceiver.receive;
+  const {api, method, params} = message.params;
+  receiver(api, method, JSON.stringify(params));
+});