Fix the local development environment script

Author: pimterry

README.md

@@ -36,8 +36,12 @@ To get started:
 * Clone this repo.
 * `npm install`
 * To build & run the electron app locally:
-    * `npm start` - runs the desktop app, downloading the latest server & using the UI from `app.httptoolkit.tech`.
-    * `npm run start:dev` - runs the desktop app, but using the UI from `localhost:8080` (i.e. assuming you're running your own UI).
+    * `npm start` - runs the desktop app, downloading the latest live server & using the live UI from `app.httptoolkit.tech`.
+        * This is useful if you're working on just the desktop app, and want to see your changes with the real live environment.
+    * `npm run start:dev` - runs the desktop app, with no built-in server using the UI from `localhost:8080`
+        * This effectively assumes you're bringing your own working UI & server, and is useful for working on this.
+        * You can start both from the [UI project](https://github.com/httptoolkit/httptoolkit-ui) with just `npm start`, to work on the UI within the desktop app.
+        * Alternatively, you can run `npm start` in the [server project](https://github.com/httptoolkit/httptoolkit-server), and `npm run start:web` in the UI project, to work on the server or both.
 * To build distributable packages:
     * `npm run make` - this will attempt to build & package the desktop app for your current platform
 

package.json

@@ -6,8 +6,9 @@
   "description": "HTTP(S) debugging proxy, analyzer and client",
   "main": "src/index.ts",
   "scripts": {
-    "prestart": "node setup-dev.js",
+    "prestart": "node setup-local.js",
     "start": "electron-forge start",
+    "prestart:dev": "node setup-dev.js",
     "start:dev": "APP_URL='http://local.httptoolkit.tech:8080' electron-forge start",
     "package": "electron-forge package",
     "make": "electron-forge make",

setup-dev.js

@@ -1,29 +1,42 @@
 require('ts-node/register');
 
 const { promisify } = require('util');
+const path = require('path');
 const os = require('os');
 const fs = require('fs');
 const rimraf = require('rimraf');
-const insertServer = promisify(require('./src/after-copy-insert-server'));
 
 const canAccess = (file) => promisify(fs.access)(file).then(() => true).catch(() => false);
 const deleteDir = promisify(rimraf);
+const mkdir = promisify(fs.mkdir);
+const writeFile = promisify(fs.writeFile);
+const chmod = promisify(fs.chmod);
 
-const packageJsonLock = require('./package-lock.json');
-const requiredServerVersion = packageJsonLock.dependencies['httptoolkit-server'].version;
+const sleepForeverScript = `#!/usr/bin/env node
+setInterval(() => {}, 999999999);
+`;
 
-// Manually trigger the after-copy hook, to give us an env like the real package
+// For a full local dev environment, we want to use a standalone UI & server running externally.
+// This lets us edit both and the desktop together. We do this by creating a fake server,
+// which doesn't exit, but otherwise does nothing.
 async function setUpDevEnv() {
-    const serverExists = await canAccess('./httptoolkit-server');
-    const serverVersion = serverExists ? require('./httptoolkit-server/package.json').version : null;
+    const serverFolder = path.join(__dirname, 'httptoolkit-server');
+    const serverExists = await canAccess(serverFolder);
+    if (serverExists) {
+        await deleteDir(serverFolder);
 
-    if (serverVersion !== requiredServerVersion) {
-        if (serverExists) await deleteDir('./httptoolkit-server');
-        await insertServer(__dirname, '', os.platform(), os.arch());
-        console.log('Dev setup completed.');
-    } else {
-        console.log('Correct server already downloaded, nothing to do.');
+        const binFolder = path.join(serverFolder, 'bin');
+        await mkdir(binFolder, { recursive: true });
+
+        const bins = ['httptoolkit-server', 'httptoolkit-server.cmd'].map((bin) => path.join(binFolder, bin));
+        await Promise.all(bins.map(async (bin) => {
+            await writeFile(bin, sleepForeverScript);
+            await chmod(bin, 0o755);
+        }));
     }
 }
 
-setUpDevEnv();
+setUpDevEnv().catch(e => {
+    console.error(e);
+    process.exit(1);
+});

setup-local.js

@@ -0,0 +1,34 @@
+require('ts-node/register');
+
+const { promisify } = require('util');
+const os = require('os');
+const fs = require('fs');
+const rimraf = require('rimraf');
+const insertServer = promisify(require('./src/after-copy-insert-server'));
+
+const canAccess = (file) => promisify(fs.access)(file).then(() => true).catch(() => false);
+const deleteDir = promisify(rimraf);
+
+const packageJsonLock = require('./package-lock.json');
+const requiredServerVersion = packageJsonLock.dependencies['httptoolkit-server'].version;
+
+// For local testing of the desktop app, we need to pull the latest server and unpack it.
+// This real prod server will then be used with the real prod web UI, but this local desktop app.
+// Manually trigger the after-copy hook, to give us an env like the real package
+async function setUpLocalEnv() {
+    const serverExists = await canAccess('./httptoolkit-server');
+    const serverVersion = serverExists ? require('./httptoolkit-server/package.json').version : null;
+
+    if (serverVersion !== requiredServerVersion) {
+        if (serverExists) await deleteDir('./httptoolkit-server');
+        await insertServer(__dirname, '', os.platform(), os.arch());
+        console.log('Local setup completed.');
+    } else {
+        console.log('Correct server already downloaded, nothing to do.');
+    }
+}
+
+setUpLocalEnv().catch(e => {
+    console.error(e);
+    process.exit(1);
+});