Use detect-port for both frontend (base port) and instances

Author: ralphtheninja

backend/app.ts

@@ -59,8 +59,8 @@ export function createFrontend(
   app.get<{}, Instance[]>("/instances", (req, res) => {
     res.json(instances.list());
   });
-  app.post<{}, Instance>("/instances", (req, res) => {
-    const instance = instances.add();
+  app.post<{}, Instance>("/instances", async (req, res) => {
+    const instance = await instances.add();
     instance.start();
     res.json({
       id: instance.id,

backend/instance.ts

@@ -1,5 +1,6 @@
 import expressWs from "express-ws";
 import { WebSocket, Server } from "ws";
+import detectPort from "detect-port";
 
 import { ReceivedStatusUpdate } from "@webxdc/types";
 import { createProcessor, IProcessor, WebXdcMulti, OnMessage } from "./message";
@@ -86,12 +87,12 @@ export class Instances {
     });
   }
 
-  add(): Instance {
-    this.currentPort++;
-    const port = this.currentPort;
+  async add(): Promise<Instance> {
+    const port = await detectPort(this.currentPort + 1);
     if (this.instances.has(port)) {
       throw new Error(`Already have Webxdc instance at port: ${port}`);
     }
+    this.currentPort = port
 
     const instanceUrl = getInstanceUrl(port);
 

backend/run.ts

@@ -1,3 +1,4 @@
+import detectPort from "detect-port";
 import process from "process";
 import open from "open";
 
@@ -14,11 +15,12 @@ export type Inject = {
 
 async function actualRun(appInfo: AppInfo, options: Options, inject: Inject): Promise<void> {
   const { injectFrontend, injectSim, getIndexHtml } = inject;
+  options.basePort = await detectPort(options.basePort);
   const instances = new Instances(appInfo, injectSim, options);
 
   const numberOfInstances = 2;
   for (let i = 0; i < numberOfInstances; i++) {
-    instances.add();
+    await instances.add();
   }
 
   const frontend = createFrontend(