@forge/tunnel 2.1.5-next.3 → 2.2.0-next.4

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @forge/tunnel
 
+## 2.2.0-next.4
+
+### Minor Changes
+
+- e37918e4: Implement support for client-side UI Kit tunneling
+
+### Patch Changes
+
+- Updated dependencies [e37918e4]
+  - @forge/bundler@4.1.0-next.2
+  - @forge/cli-shared@3.4.0-next.1
+  - @forge/runtime@2.6.0-next.3
+
 ## 2.1.5-next.3
 
 ### Patch Changes

package/out/index.js

@@ -25,13 +25,13 @@ const graphQLClient = createGraphQLClient(authenticator);
 const functionHost = new tunnelling_1.LocalFunctionHost(configFile, ui, runtime_1.snapshot, fs_1.promises);
 const localInvocationService = new tunnelling_1.LocalInvocationService(configFile, ui, inspector);
 const tunnelInteractor = new tunnelling_1.TunnelInteractor(ui);
-const startTunnelCommand = new tunnelling_1.StartTunnelCommand(assertiveAppConfigReader, new tunnelling_1.LocalDevelopmentServer(localInvocationService, ui), new tunnelling_1.NgrokCreateTunnelService(ui), new tunnelling_1.RegisterTunnelServiceImpl(new tunnelling_1.TunnelGraphqlClient(graphQLClient)), functionHost, inspector, ui, configFile);
+const startTunnelCommand = new tunnelling_1.StartTunnelCommand(assertiveAppConfigReader, new tunnelling_1.LocalDevelopmentServer(localInvocationService, ui, configFile), new tunnelling_1.NgrokCreateTunnelService(ui), new tunnelling_1.RegisterTunnelServiceImpl(new tunnelling_1.TunnelGraphqlClient(graphQLClient)), functionHost, inspector, ui, configFile);
 const runTunnel = async () => {
     try {
         const tunnel = await startTunnelCommand.execute({
             environmentKey: process.env.ENVIRONMENT_KEY || 'default'
         });
-        const monitor = await tunnelInteractor.watchApp(tunnel, configFile);
+        const monitor = await tunnelInteractor.watchApp(tunnel);
         await tunnelInteractor.handleUserExitEvent(tunnel.stopFunction, monitor);
     }
     catch (e) {

package/out/tunnelling/command/interactors/function-change-watcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"function-change-watcher.d.ts","sourceRoot":"","sources":["../../../../src/tunnelling/command/interactors/function-change-watcher.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,IAAI,CAAC;AAG1C,OAAO,EAAE,UAAU,EAA8B,MAAM,EAAyB,MAAM,mBAAmB,CAAC;AAC1G,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAML,eAAe,EAChB,MAAM,gBAAgB,CAAC;AAIxB,MAAM,WAAW,qBAAqB;IACpC,aAAa,CAAC,WAAW,EAAE,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACzD,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,YAAY;IAC3B,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACtD,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,oBAAoB,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACxE;AASD,eAAO,MAAM,kBAAkB,KAAK,CAAC;AACrC,eAAO,MAAM,YAAY,MAAM,CAAC;AAEhC,qBAAa,iBAAkB,YAAW,qBAAqB;IAI3D,OAAO,CAAC,QAAQ,CAAC,UAAU;IAC3B,OAAO,CAAC,QAAQ,CAAC,MAAM;IACvB,OAAO,CAAC,QAAQ,CAAC,QAAQ;IACzB,OAAO,CAAC,QAAQ,CAAC,YAAY;IAN/B,OAAO,CAAC,YAAY,CAA8C;gBAG/C,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,eAAe,EACzB,YAAY,EAAE,YAAY;YAG/B,mBAAmB;IAuBpB,aAAa,CAAC,WAAW,EAAE,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC;IA8CxD,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC;IAI1C,OAAO,CAAC,YAAY,CAElB;YAEY,8BAA8B;YAgB9B,mBAAmB;CAqBlC"}
+{"version":3,"file":"function-change-watcher.d.ts","sourceRoot":"","sources":["../../../../src/tunnelling/command/interactors/function-change-watcher.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,IAAI,CAAC;AAG1C,OAAO,EAAE,UAAU,EAA8B,MAAM,EAAyB,MAAM,mBAAmB,CAAC;AAC1G,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAML,eAAe,EAChB,MAAM,gBAAgB,CAAC;AAIxB,MAAM,WAAW,qBAAqB;IACpC,aAAa,CAAC,WAAW,EAAE,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACzD,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,YAAY;IAC3B,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACtD,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,oBAAoB,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACxE;AASD,eAAO,MAAM,kBAAkB,KAAK,CAAC;AACrC,eAAO,MAAM,YAAY,MAAM,CAAC;AAEhC,qBAAa,iBAAkB,YAAW,qBAAqB;IAI3D,OAAO,CAAC,QAAQ,CAAC,UAAU;IAC3B,OAAO,CAAC,QAAQ,CAAC,MAAM;IACvB,OAAO,CAAC,QAAQ,CAAC,QAAQ;IACzB,OAAO,CAAC,QAAQ,CAAC,YAAY;IAN/B,OAAO,CAAC,YAAY,CAA8C;gBAG/C,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,eAAe,EACzB,YAAY,EAAE,YAAY;YAG/B,mBAAmB;IAuBpB,aAAa,CAAC,WAAW,EAAE,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC;IA8CxD,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC;IAI1C,OAAO,CAAC,YAAY,CAElB;YAEY,8BAA8B;YAgB9B,mBAAmB;CAoBlC"}

package/out/tunnelling/command/interactors/function-change-watcher.js

@@ -104,7 +104,6 @@ class LocalFunctionHost {
             });
             const resolveds = await Promise.all(promises);
             util_1.SandboxesContainer.updateSandboxes(resolveds.reduce((acc, obj) => Object.assign(acc, obj), {}));
-            this.logger.info(cli_shared_1.LogColor.trace(cli_shared_1.Text.tunnel.reloaded));
         }
         catch (error) {
             this.logger.error(error);

package/out/tunnelling/command/interactors/multi-compiler-watcher.d.ts

@@ -0,0 +1,11 @@
+import { BundlerOutput, WatcherMonitor } from '@forge/bundler';
+import { DevelopmentServer, WatchHooks } from '../../servers';
+export declare class MultiCompilerWatcher implements WatcherMonitor {
+    private readonly servers;
+    constructor(servers: DevelopmentServer[]);
+    compileAndWatch({ onChange: { onBuildWillStart, onBuildFinished } }: {
+        onChange: WatchHooks;
+    }): Promise<BundlerOutput>;
+    stop(): Promise<void>;
+}
+//# sourceMappingURL=multi-compiler-watcher.d.ts.map

package/out/tunnelling/command/interactors/multi-compiler-watcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-compiler-watcher.d.ts","sourceRoot":"","sources":["../../../../src/tunnelling/command/interactors/multi-compiler-watcher.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE9D,qBAAa,oBAAqB,YAAW,cAAc;IAC7C,OAAO,CAAC,QAAQ,CAAC,OAAO;gBAAP,OAAO,EAAE,iBAAiB,EAAE;IAE5C,eAAe,CAAC,EAC3B,QAAQ,EAAE,EAAE,gBAAgB,EAAE,eAAe,EAAE,EAChD,EAAE;QACD,QAAQ,EAAE,UAAU,CAAC;KACtB,GAAG,OAAO,CAAC,aAAa,CAAC;IAab,IAAI;CAGlB"}

package/out/tunnelling/command/interactors/multi-compiler-watcher.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MultiCompilerWatcher = void 0;
+class MultiCompilerWatcher {
+    constructor(servers) {
+        this.servers = servers;
+    }
+    async compileAndWatch({ onChange: { onBuildWillStart, onBuildFinished } }) {
+        const results = await Promise.all(this.servers.map((server) => server.compileAndWatch({
+            onBuildWillStart,
+            onBuildFinished
+        })));
+        return results.reduce((prev, curr) => (Object.assign(Object.assign({}, prev), curr)), {});
+    }
+    async stop() {
+        await Promise.all(this.servers.map((server) => server.stop()));
+    }
+}
+exports.MultiCompilerWatcher = MultiCompilerWatcher;

package/out/tunnelling/command/interactors/tunnel-interactor.d.ts

@@ -1,10 +1,10 @@
 import { WatcherMonitor } from '@forge/bundler';
-import { ConfigFile, Logger } from '@forge/cli-shared';
+import { Logger } from '@forge/cli-shared';
 import { StartTunnelResult } from '../start-tunnel-command';
 export declare class TunnelInteractor {
     private readonly logger;
     constructor(logger: Logger);
     handleUserExitEvent(stopFunction: () => Promise<void>, bundleMonitor: WatcherMonitor | undefined): Promise<void>;
-    watchApp: (startTunnelResult: StartTunnelResult, configFile: ConfigFile) => Promise<WatcherMonitor | undefined>;
+    watchApp: (startTunnelResult: StartTunnelResult) => Promise<WatcherMonitor | undefined>;
 }
 //# sourceMappingURL=tunnel-interactor.d.ts.map

package/out/tunnelling/command/interactors/tunnel-interactor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tunnel-interactor.d.ts","sourceRoot":"","sources":["../../../../src/tunnelling/command/interactors/tunnel-interactor.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAY,MAAM,EAAQ,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAI5D,qBAAa,gBAAgB;IACf,OAAO,CAAC,QAAQ,CAAC,MAAM;gBAAN,MAAM,EAAE,MAAM;IAEpC,mBAAmB,CACxB,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,EACjC,aAAa,EAAE,cAAc,GAAG,SAAS,GACxC,OAAO,CAAC,IAAI,CAAC;IAgCT,QAAQ,sBACM,iBAAiB,cACxB,UAAU,KACrB,QAAQ,cAAc,GAAG,SAAS,CAAC,CAiDpC;CACH"}
+{"version":3,"file":"tunnel-interactor.d.ts","sourceRoot":"","sources":["../../../../src/tunnelling/command/interactors/tunnel-interactor.ts"],"names":[],"mappings":"AACA,OAAO,EAA4B,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAC1E,OAAO,EAAY,MAAM,EAAQ,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAG5D,qBAAa,gBAAgB;IACf,OAAO,CAAC,QAAQ,CAAC,MAAM;gBAAN,MAAM,EAAE,MAAM;IAEpC,mBAAmB,CACxB,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,EACjC,aAAa,EAAE,cAAc,GAAG,SAAS,GACxC,OAAO,CAAC,IAAI,CAAC;IAqCT,QAAQ,sBAA6B,iBAAiB,KAAG,QAAQ,cAAc,GAAG,SAAS,CAAC,CA6DjG;CACH"}

package/out/tunnelling/command/interactors/tunnel-interactor.js

@@ -2,51 +2,58 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TunnelInteractor = void 0;
 const tslib_1 = require("tslib");
-const path_1 = tslib_1.__importDefault(require("path"));
 const readline_1 = tslib_1.__importDefault(require("readline"));
-const cli_shared_1 = require("@forge/cli-shared");
 const bundler_1 = require("@forge/bundler");
-const index_1 = require("../../index");
+const cli_shared_1 = require("@forge/cli-shared");
+const multi_compiler_watcher_1 = require("./multi-compiler-watcher");
 class TunnelInteractor {
     constructor(logger) {
         this.logger = logger;
-        this.watchApp = async (startTunnelResult, configFile) => {
-            const { localPort, inspectorAddress, reloadSandboxes } = startTunnelResult;
+        this.watchApp = async (startTunnelResult) => {
+            const { localPort, inspectorAddress, reloadSandboxes, devServers } = startTunnelResult;
             if (inspectorAddress) {
                 this.logger.info(cli_shared_1.Text.tunnel.startedInspector(inspectorAddress));
             }
-            const handlers = await configFile.getAppHandlers();
-            const currentDirectory = process.cwd();
-            const entryPoints = [];
-            for (const handler of handlers) {
-                entryPoints.push({
-                    name: handler,
-                    path: path_1.default.join(currentDirectory, 'src', handler)
-                });
-            }
-            if (entryPoints.length > 0) {
-                return (0, bundler_1.watch)(entryPoints, (0, index_1.isInspectorEnabled)(), async (err, output) => {
-                    if (err) {
-                        this.logger.error(err);
-                    }
-                    else if (output) {
-                        this.logger.info(cli_shared_1.LogColor.trace(cli_shared_1.Text.tunnel.bundlingSucceeded));
-                        await reloadSandboxes(output);
-                        this.logger.info('');
-                        this.logger.info(cli_shared_1.Text.tunnel.startedServer(localPort, this.logger.debugEnabled) + '\n');
-                    }
-                }, async (compiler, preBundleSteps, done) => {
-                    try {
-                        this.logger.info('');
-                        this.logger.info(cli_shared_1.Text.bundle.detectedChanges);
-                        await preBundleSteps();
-                        this.logger.info(cli_shared_1.Text.tunnel.preBundleTask(cli_shared_1.Text.tunnel.bundlingHeader));
-                        done();
-                    }
-                    catch (err) {
-                        throw err;
-                    }
-                });
+            const onBundlingStart = async () => {
+                try {
+                    this.logger.info('');
+                    this.logger.info(cli_shared_1.Text.bundle.detectedChanges);
+                    await (0, bundler_1.runLinter)();
+                    this.logger.info(cli_shared_1.Text.tunnel.preBundleTask(cli_shared_1.Text.tunnel.bundlingHeader));
+                }
+                catch (err) {
+                    throw err;
+                }
+            };
+            const onBundlingFinish = async (err, output) => {
+                if (err) {
+                    this.logger.error(err);
+                    return;
+                }
+                if (output) {
+                    await reloadSandboxes(output);
+                }
+                this.logger.info('');
+                this.logger.info(cli_shared_1.Text.tunnel.startedServer(localPort, this.logger.debugEnabled) + '\n');
+            };
+            if (devServers.length > 0) {
+                const multiCompiler = new multi_compiler_watcher_1.MultiCompilerWatcher(devServers);
+                await (0, bundler_1.runLinter)();
+                this.logger.info(cli_shared_1.Text.tunnel.preBundleTask(cli_shared_1.Text.tunnel.bundlingHeader));
+                try {
+                    const output = await multiCompiler.compileAndWatch({
+                        onChange: {
+                            onBuildWillStart: onBundlingStart,
+                            onBuildFinished: onBundlingFinish
+                        }
+                    });
+                    await reloadSandboxes(output);
+                    this.logger.info('');
+                    this.logger.info(cli_shared_1.Text.tunnel.startedServer(localPort, this.logger.debugEnabled) + '\n');
+                }
+                catch (_) {
+                }
+                return multiCompiler;
             }
         };
     }
@@ -70,9 +77,10 @@ class TunnelInteractor {
                 }
                 finally {
                     if (bundleMonitor) {
-                        bundleMonitor.stop();
+                        await bundleMonitor.stop();
                     }
                     this.logger.info(cli_shared_1.LogColor.trace(cli_shared_1.Text.tunnel.stoppedTunnel));
+                    process.exit();
                 }
             };
             rl.on('SIGINT', tunnelCleanupListener);

package/out/tunnelling/command/start-tunnel-command.d.ts

@@ -13,6 +13,7 @@ export interface StartTunnelResult {
     localPort: number;
     tunnelDefinitions: TunnelDefinitions;
     inspectorAddress?: string;
+    devServers: DevelopmentServer[];
     stopFunction(): Promise<void>;
     reloadSandboxes(bundledCode: BundlerOutput): Promise<void>;
 }
@@ -30,7 +31,7 @@ export declare class StartTunnelCommand {
     constructor(getAppConfig: AppConfigProvider, devServer: DevelopmentServer, tunnelFactory: CreateTunnelService, tunnelClient: RegisterTunnelService, functionHost: FunctionChangeWatcher, inspector: Inspector, logger: Logger, configFile: ConfigFile);
     private stopServices;
     private startFaaSTunnelServer;
-    private startCustomUITunnelServers;
+    private startResourceBasedTunnelsServers;
     execute(options: StartTunnelOptions): Promise<StartTunnelResult>;
 }
 //# sourceMappingURL=start-tunnel-command.d.ts.map

package/out/tunnelling/command/start-tunnel-command.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"start-tunnel-command.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/command/start-tunnel-command.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,EAAQ,MAAM,mBAAmB,CAAC;AAChF,OAAO,EAAE,SAAS,EAAqB,MAAM,gBAAgB,CAAC;AAI9D,OAAO,EAAE,iBAAiB,EAA2C,MAAM,YAAY,CAAC;AACxF,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAsC,iBAAiB,EAAE,MAAM,UAAU,CAAC;AACjF,OAAO,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAEzE,MAAM,WAAW,kBAAkB;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9B,eAAe,CAAC,WAAW,EAAE,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC5D;AAED,qBAAa,kBAAkB;IAK3B,OAAO,CAAC,QAAQ,CAAC,YAAY;IAC7B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,aAAa;IAC9B,OAAO,CAAC,QAAQ,CAAC,YAAY;IAC7B,OAAO,CAAC,QAAQ,CAAC,YAAY;IAC7B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,MAAM;IACvB,OAAO,CAAC,QAAQ,CAAC,UAAU;IAX7B,OAAO,CAAC,aAAa,CAA4C;IACjE,OAAO,CAAC,iBAAiB,CAAgC;gBAGtC,YAAY,EAAE,iBAAiB,EAC/B,SAAS,EAAE,iBAAiB,EAC5B,aAAa,EAAE,mBAAmB,EAClC,YAAY,EAAE,qBAAqB,EACnC,YAAY,EAAE,qBAAqB,EACnC,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU;IAGzC,OAAO,CAAC,YAAY,CAUlB;IAEF,OAAO,CAAC,qBAAqB,CAS3B;IAEF,OAAO,CAAC,0BAA0B,CAiChC;IAEW,OAAO,CAAC,OAAO,EAAE,kBAAkB,GAAG,OAAO,CAAC,iBAAiB,CAAC;CAwC9E"}
+{"version":3,"file":"start-tunnel-command.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/command/start-tunnel-command.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,EAAyB,MAAM,mBAAmB,CAAC;AACjG,OAAO,EAAE,SAAS,EAAqB,MAAM,gBAAgB,CAAC;AAG9D,OAAO,EACL,iBAAiB,EAKlB,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAsC,iBAAiB,EAAE,MAAM,UAAU,CAAC;AACjF,OAAO,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACzE,MAAM,WAAW,kBAAkB;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE,iBAAiB,EAAE,CAAC;IAChC,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9B,eAAe,CAAC,WAAW,EAAE,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC5D;AAED,qBAAa,kBAAkB;IAK3B,OAAO,CAAC,QAAQ,CAAC,YAAY;IAC7B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,aAAa;IAC9B,OAAO,CAAC,QAAQ,CAAC,YAAY;IAC7B,OAAO,CAAC,QAAQ,CAAC,YAAY;IAC7B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,MAAM;IACvB,OAAO,CAAC,QAAQ,CAAC,UAAU;IAX7B,OAAO,CAAC,aAAa,CAAmE;IACxF,OAAO,CAAC,iBAAiB,CAAgC;gBAGtC,YAAY,EAAE,iBAAiB,EAC/B,SAAS,EAAE,iBAAiB,EAC5B,aAAa,EAAE,mBAAmB,EAClC,YAAY,EAAE,qBAAqB,EACnC,YAAY,EAAE,qBAAqB,EACnC,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU;IAGzC,OAAO,CAAC,YAAY,CAUlB;IAEF,OAAO,CAAC,qBAAqB,CAS3B;IAEF,OAAO,CAAC,gCAAgC,CAgCtC;IAEW,OAAO,CAAC,OAAO,EAAE,kBAAkB,GAAG,OAAO,CAAC,iBAAiB,CAAC;CAoD9E"}

package/out/tunnelling/command/start-tunnel-command.js

@@ -4,7 +4,6 @@ exports.StartTunnelCommand = void 0;
 const tslib_1 = require("tslib");
 const cli_shared_1 = require("@forge/cli-shared");
 const runtime_1 = require("@forge/runtime");
-const url_1 = require("url");
 const node_cache_1 = tslib_1.__importDefault(require("node-cache"));
 const servers_1 = require("../servers");
 const index_1 = require("../index");
@@ -33,17 +32,13 @@ class StartTunnelCommand {
         };
         this.startFaaSTunnelServer = async (port) => {
             const { permissions = {}, remotes = [] } = await this.configFile.readConfig();
-            const localPort = await this.devServer.start(port, permissions, remotes);
-            const faasTunnelUrl = await this.tunnelFactory.establishTunnel(localPort);
-            return {
-                port: localPort,
-                tunnelUrl: faasTunnelUrl
-            };
+            const serverInfo = await this.devServer.start(port, permissions, remotes);
+            const faasTunnelUrl = await this.tunnelFactory.establishTunnel(serverInfo.port);
+            return Object.assign(Object.assign({}, serverInfo), { tunnelUrl: faasTunnelUrl });
         };
-        this.startCustomUITunnelServers = async () => {
+        this.startResourceBasedTunnelsServers = async (resourceDetails) => {
             var _a, _b;
             const resourcePortMap = JSON.parse((_a = process.env.RESOURCE_PORT_MAP) !== null && _a !== void 0 ? _a : '{}');
-            const resourceDetails = await this.configFile.getResources();
             const { permissions = {}, remotes = [] } = await this.configFile.readConfig();
             const cspReporterPort = parseInt((_b = process.env.CSP_REPORTER_PORT) !== null && _b !== void 0 ? _b : '4000', 10);
             if (resourceDetails.length === 0)
@@ -51,27 +46,28 @@ class StartTunnelCommand {
             this.cspReporterServer = new servers_1.CspReporterServer(cspReporterPort, this.logger, new node_cache_1.default());
             await this.cspReporterServer.start();
             return await Promise.all(resourceDetails.map(async (rd) => {
-                const { key } = rd;
+                const { key, resourceType } = rd;
                 const port = resourcePortMap[key];
-                this.tunnelServers[key] = new servers_1.ResourceTunnelServer(Object.assign(Object.assign({}, rd), { port, logger: this.logger, cspReporterServerPort: cspReporterPort, permissions,
+                const tunnelServer = resourceType === 'nativeUI' ? servers_1.NativeUITunnelServer : servers_1.CustomUITunnelServer;
+                this.tunnelServers[key] = new tunnelServer(Object.assign(Object.assign({}, rd), { port, logger: this.logger, cspReporterServerPort: cspReporterPort, permissions,
                     remotes }));
-                await this.tunnelServers[key].start();
-                return {
-                    resourceKey: key,
-                    tunnelUrl: new url_1.URL(`http://localhost:${port}`)
-                };
+                return this.tunnelServers[key].start();
             }));
         };
     }
     async execute(options) {
         const { id: appId } = await this.getAppConfig();
         const { port, environmentKey } = options;
+        const allResources = await this.configFile.getResources();
         try {
             const faasTunnelServer = await this.startFaaSTunnelServer(port);
-            const customUITunnelsServers = await this.startCustomUITunnelServers();
+            const customUITunnelsServers = await this.startResourceBasedTunnelsServers(allResources);
             const tunnelDefinitions = {
                 faasTunnelUrl: faasTunnelServer.tunnelUrl,
-                customUI: customUITunnelsServers
+                customUI: customUITunnelsServers.map(({ tunnelUrl, resourceKey }) => ({
+                    tunnelUrl,
+                    resourceKey
+                }))
             };
             await this.tunnelClient.registerTunnels(appId, environmentKey, tunnelDefinitions);
             const inspectorAddress = (0, index_1.isInspectorEnabled)() ? this.inspector.startServer(index_1.INSPECTOR_PORT) : undefined;
@@ -90,7 +86,14 @@ class StartTunnelCommand {
                     }
                 }
             };
-            return { localPort: faasTunnelServer.port, tunnelDefinitions, inspectorAddress, stopFunction, reloadSandboxes };
+            return {
+                localPort: faasTunnelServer.port,
+                tunnelDefinitions,
+                inspectorAddress,
+                stopFunction,
+                reloadSandboxes,
+                devServers: [faasTunnelServer.devServer, ...customUITunnelsServers.map(({ devServer }) => devServer)]
+            };
         }
         catch (e) {
             try {

package/out/tunnelling/servers/custom-ui-tunnel-server.d.ts

@@ -0,0 +1,18 @@
+import { Express } from 'express';
+import { ResourceTunnelServer, ResourceTunnelServerArgs } from './resource-tunnel-server';
+import { DevelopmentServer, StartDevServerResult } from './dev-server';
+export declare class CustomUITunnelServer extends ResourceTunnelServer implements DevelopmentServer {
+    private readonly tunnelArgs;
+    private readonly app;
+    private server;
+    private readonly proxy;
+    private socket;
+    constructor(tunnelArgs: ResourceTunnelServerArgs);
+    start(): Promise<Required<StartDevServerResult>>;
+    stop(): Promise<void>;
+    compileAndWatch(): Promise<any>;
+    getApp(): Express;
+    private handleProxyDestinationNotStarted;
+    private handleWebsocketUpgrade;
+}
+//# sourceMappingURL=custom-ui-tunnel-server.d.ts.map

package/out/tunnelling/servers/custom-ui-tunnel-server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-ui-tunnel-server.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/custom-ui-tunnel-server.ts"],"names":[],"mappings":"AAEA,OAAgB,EAAE,OAAO,EAAqB,MAAM,SAAS,CAAC;AAG9D,OAAO,EAAE,oBAAoB,EAAE,wBAAwB,EAAoB,MAAM,0BAA0B,CAAC;AAE5G,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AASvE,qBAAa,oBAAqB,SAAQ,oBAAqB,YAAW,iBAAiB;IAM7E,OAAO,CAAC,QAAQ,CAAC,UAAU;IALvC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAU;IAC9B,OAAO,CAAC,MAAM,CAAqB;IACnC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA6B;IACnD,OAAO,CAAC,MAAM,CAAqB;gBAEN,UAAU,EAAE,wBAAwB;IAwC3D,KAAK,IAAI,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAC;IAkBhD,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAcd,eAAe,IAAI,OAAO,CAAC,GAAG,CAAC;IAK5C,MAAM,IAAI,OAAO;IAIjB,OAAO,CAAC,gCAAgC;IAoBxC,OAAO,CAAC,sBAAsB;CAO/B"}

package/out/tunnelling/servers/custom-ui-tunnel-server.js

@@ -0,0 +1,102 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CustomUITunnelServer = void 0;
+const tslib_1 = require("tslib");
+const url_1 = require("url");
+const express_1 = tslib_1.__importDefault(require("express"));
+const http_proxy_middleware_1 = require("http-proxy-middleware");
+const resource_tunnel_server_1 = require("./resource-tunnel-server");
+const cli_shared_1 = require("@forge/cli-shared");
+var ConnectionErrorCode;
+(function (ConnectionErrorCode) {
+    ConnectionErrorCode["REFUSED"] = "ECONNREFUSED";
+})(ConnectionErrorCode || (ConnectionErrorCode = {}));
+class CustomUITunnelServer extends resource_tunnel_server_1.ResourceTunnelServer {
+    constructor(tunnelArgs) {
+        super(tunnelArgs);
+        this.tunnelArgs = tunnelArgs;
+        const { tunnel, permissions, remotes } = tunnelArgs;
+        this.app = (0, express_1.default)();
+        this.app.use(this.getCustomUIHtmlTransformMiddleware(permissions, remotes));
+        if (tunnel) {
+            const { port: tunnelPort } = tunnel;
+            this.proxy = (0, http_proxy_middleware_1.createProxyMiddleware)({
+                target: `http://${resource_tunnel_server_1.TUNNEL_LOCALHOST}:${tunnelPort}`,
+                ws: true,
+                logLevel: 'info',
+                logProvider: () => {
+                    return {
+                        log: this.logger.trace,
+                        debug: this.logger.trace,
+                        info: this.logger.trace,
+                        warn: this.logger.warn,
+                        error: this.logger.error
+                    };
+                },
+                onError: (err, req, res) => {
+                    this.handleProxyDestinationNotStarted(err, req.url, res, tunnelPort);
+                },
+                onProxyReq: (_proxyReq, req) => {
+                    this.logFileServed(req.url, (input) => cli_shared_1.Text.tunnel.customUI.fileProxied(input, this.key, tunnelPort));
+                }
+            });
+            this.app.use('/', this.proxy);
+        }
+        else {
+            this.app.use((req, _res, next) => {
+                this.logFileServed(req.url, (input) => cli_shared_1.Text.tunnel.customUI.fileServed(input, this.key));
+                next();
+            });
+            this.app.use(express_1.default.static(this.path));
+        }
+    }
+    async start() {
+        return new Promise((resolve) => {
+            const { key, port } = this.tunnelArgs;
+            const result = {
+                port,
+                devServer: this,
+                resourceKey: key,
+                tunnelUrl: new url_1.URL(`http://localhost:${port}`)
+            };
+            this.server = this.app.listen(this.port, () => resolve(result));
+            this.server.on('upgrade', (req, socket, head) => this.handleWebsocketUpgrade(req, socket, head));
+        });
+    }
+    async stop() {
+        if (this.socket) {
+            this.socket.end();
+        }
+        return new Promise((resolve, reject) => {
+            if (!this.server) {
+                return resolve();
+            }
+            this.server.close((err) => (err ? reject(err) : resolve()));
+        });
+    }
+    async compileAndWatch() {
+        return {};
+    }
+    getApp() {
+        return this.app;
+    }
+    handleProxyDestinationNotStarted(err, reqUrl, res, tunnelPort) {
+        if ((err === null || err === void 0 ? void 0 : err.code) !== ConnectionErrorCode.REFUSED || (reqUrl !== '/' && reqUrl !== 'index.html')) {
+            this.logger.error(err);
+            return;
+        }
+        res.writeHead(500, {
+            'Content-Type': 'text/plain'
+        });
+        this.logger.error(new Error(cli_shared_1.Text.tunnel.error.serverNotStartedOnPort(tunnelPort)));
+        res.end(cli_shared_1.Text.tunnel.error.serverNotStartedOnPort(tunnelPort));
+    }
+    handleWebsocketUpgrade(req, socket, head) {
+        var _a;
+        this.socket = socket;
+        if ((_a = this.proxy) === null || _a === void 0 ? void 0 : _a.upgrade) {
+            return this.proxy.upgrade(req, socket, head);
+        }
+    }
+}
+exports.CustomUITunnelServer = CustomUITunnelServer;

package/out/tunnelling/servers/dev-server.d.ts

@@ -1,10 +1,23 @@
+/// <reference types="node" />
 import express from 'express';
-import { Logger } from '@forge/cli-shared';
+import { URL } from 'url';
+import { ConfigFile, Logger } from '@forge/cli-shared';
 import { ExternalRequestBody } from '@forge/runtime';
 import { Permissions, Remotes } from '@forge/manifest';
+export interface WatchHooks<T = any> {
+    onBuildWillStart: () => Promise<void>;
+    onBuildFinished: (err: Error | null, result?: T) => Promise<void>;
+}
 export interface DevelopmentServer {
-    start(port?: number, permissions?: Permissions, remotes?: Remotes): Promise<number>;
+    start(port?: number, permissions?: Permissions, remotes?: Remotes): Promise<StartDevServerResult>;
     stop(): Promise<void>;
+    compileAndWatch<T = any>(hooks: WatchHooks<T>): Promise<any>;
+}
+export interface StartDevServerResult {
+    port: number;
+    devServer: DevelopmentServer;
+    resourceKey?: string;
+    tunnelUrl?: URL;
 }
 export interface InvocationService {
     invoke(handler: string, request: ExternalRequestBody): Promise<any>;
@@ -12,14 +25,18 @@ export interface InvocationService {
 export declare class LocalDevelopmentServer implements DevelopmentServer {
     private readonly invocationService;
     private readonly logger;
+    private readonly configFile;
     private app;
     private httpServer;
     private permissions;
     private remotes;
-    constructor(invocationService: InvocationService, logger: Logger);
-    start(port?: number, permissions?: Permissions, remotes?: Remotes): Promise<number>;
+    constructor(invocationService: InvocationService, logger: Logger, configFile: ConfigFile);
+    start(port?: number, permissions?: Permissions, remotes?: Remotes): Promise<StartDevServerResult>;
     stop(): Promise<void>;
+    compileAndWatch<BundlerOutput>({ onBuildWillStart, onBuildFinished }: WatchHooks<BundlerOutput>): Promise<BundlerOutput | undefined>;
     getApp(): express.Application;
     handleInvocation: express.Handler;
+    private getEntryPoints;
+    private getRuntimeCompiler;
 }
 //# sourceMappingURL=dev-server.d.ts.map

package/out/tunnelling/servers/dev-server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dev-server.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/dev-server.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,SAAS,CAAC;AAI9B,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAE,mBAAmB,EAAe,MAAM,gBAAgB,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,WAAW,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;IACpF,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;CACvB;AAED,MAAM,WAAW,iBAAiB;IAChC,MAAM,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,mBAAmB,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;CACrE;AAED,qBAAa,sBAAuB,YAAW,iBAAiB;IAMlD,OAAO,CAAC,QAAQ,CAAC,iBAAiB;IAAqB,OAAO,CAAC,QAAQ,CAAC,MAAM;IAL1F,OAAO,CAAC,GAAG,CAAsB;IACjC,OAAO,CAAC,UAAU,CAA0B;IAC5C,OAAO,CAAC,WAAW,CAA0B;IAC7C,OAAO,CAAC,OAAO,CAAsB;gBAER,iBAAiB,EAAE,iBAAiB,EAAmB,MAAM,EAAE,MAAM;IAOrF,KAAK,CAAC,IAAI,SAAI,EAAE,WAAW,CAAC,EAAE,WAAW,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC;IAY9E,IAAI;IAUV,MAAM,IAAI,OAAO,CAAC,WAAW;IAI7B,gBAAgB,EAAE,OAAO,CAAC,OAAO,CAsCtC;CACH"}
+{"version":3,"file":"dev-server.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/dev-server.ts"],"names":[],"mappings":";AAAA,OAAO,OAAO,MAAM,SAAS,CAAC;AAI9B,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAG1B,OAAO,EAAE,UAAU,EAAY,MAAM,EAAQ,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,mBAAmB,EAAe,MAAM,gBAAgB,CAAC;AAGlE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAQvD,MAAM,WAAW,UAAU,CAAC,CAAC,GAAG,GAAG;IACjC,gBAAgB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,eAAe,EAAE,CAAC,GAAG,EAAE,KAAK,GAAG,IAAI,EAAE,MAAM,CAAC,EAAE,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACnE;AACD,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,WAAW,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,oBAAoB,CAAC,CAAC;IAClG,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;IACtB,eAAe,CAAC,CAAC,GAAG,GAAG,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;CAC9D;AAED,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,iBAAiB,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,GAAG,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,MAAM,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,mBAAmB,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;CACrE;AAED,qBAAa,sBAAuB,YAAW,iBAAiB;IAO5D,OAAO,CAAC,QAAQ,CAAC,iBAAiB;IAClC,OAAO,CAAC,QAAQ,CAAC,MAAM;IACvB,OAAO,CAAC,QAAQ,CAAC,UAAU;IAR7B,OAAO,CAAC,GAAG,CAAsB;IACjC,OAAO,CAAC,UAAU,CAA0B;IAC5C,OAAO,CAAC,WAAW,CAA0B;IAC7C,OAAO,CAAC,OAAO,CAAsB;gBAGlB,iBAAiB,EAAE,iBAAiB,EACpC,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU;IAQ5B,KAAK,CAAC,IAAI,SAAI,EAAE,WAAW,CAAC,EAAE,WAAW,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,oBAAoB,CAAC;IAe5F,IAAI;IAUJ,eAAe,CAAC,aAAa,EAAE,EAC1C,gBAAgB,EAChB,eAAe,EAChB,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAwC1D,MAAM,IAAI,OAAO,CAAC,WAAW;IAI7B,gBAAgB,EAAE,OAAO,CAAC,OAAO,CAsCtC;IAEF,OAAO,CAAC,cAAc,CAepB;IAEF,OAAO,CAAC,kBAAkB,CAsBxB;CACH"}

package/out/tunnelling/servers/dev-server.js

@@ -3,12 +3,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LocalDevelopmentServer = void 0;
 const tslib_1 = require("tslib");
 const express_1 = tslib_1.__importDefault(require("express"));
+const path_1 = tslib_1.__importDefault(require("path"));
+const cli_shared_1 = require("@forge/cli-shared");
 const runtime_1 = require("@forge/runtime");
+const __1 = require("../");
 const util_1 = require("../util");
+const bundler_1 = require("@forge/bundler");
 class LocalDevelopmentServer {
-    constructor(invocationService, logger) {
+    constructor(invocationService, logger, configFile) {
         this.invocationService = invocationService;
         this.logger = logger;
+        this.configFile = configFile;
         this.handleInvocation = async (req, res) => {
             var _a, _b, _c, _d, _e, _f;
             const request = req.body;
@@ -39,6 +44,36 @@ class LocalDevelopmentServer {
                 }
             }
         };
+        this.getEntryPoints = async () => {
+            const handlers = await this.configFile.getAppHandlers();
+            const currentDirectory = process.cwd();
+            const entryPoints = [];
+            for (const handler of handlers) {
+                entryPoints.push({
+                    name: handler,
+                    path: path_1.default.join(currentDirectory, 'src', handler)
+                });
+            }
+            return entryPoints;
+        };
+        this.getRuntimeCompiler = async () => {
+            const entryPoints = await this.getEntryPoints();
+            if (!entryPoints.length) {
+                return {
+                    compiler: undefined,
+                    entryPoints
+                };
+            }
+            const config = (0, bundler_1.getSandboxedRuntimeBuildConfig)(entryPoints, {
+                isWatchMode: true,
+                isDebugMode: (0, __1.isInspectorEnabled)(),
+                appDirectory: process.cwd()
+            });
+            return {
+                compiler: (0, bundler_1.getCompiler)(config),
+                entryPoints
+            };
+        };
         this.app = (0, express_1.default)();
         this.app.use(express_1.default.json({ limit: '6mb' }));
         this.app.post(`/:fnKey`, this.handleInvocation);
@@ -50,7 +85,10 @@ class LocalDevelopmentServer {
             const httpServer = this.app.listen({ port });
             httpServer.on('error', reject).on('listening', () => resolve(httpServer));
         });
-        return this.httpServer.address().port;
+        return {
+            port: this.httpServer.address().port,
+            devServer: this
+        };
     }
     async stop() {
         if (!this.httpServer) {
@@ -60,6 +98,38 @@ class LocalDevelopmentServer {
         this.httpServer = undefined;
         await new Promise((resolve, reject) => server.close((err) => (err ? reject(err) : resolve())));
     }
+    async compileAndWatch({ onBuildWillStart, onBuildFinished }) {
+        const { compiler, entryPoints } = await this.getRuntimeCompiler();
+        if (!compiler) {
+            return;
+        }
+        let isFirstRun = true;
+        compiler.hooks.watchRun.tapAsync('watchRun', async (_, watchRunCallback) => {
+            if (!isFirstRun) {
+                await onBuildWillStart();
+            }
+            watchRunCallback();
+        });
+        return new Promise((resolve, reject) => {
+            compiler.watch({ poll: 1000 }, async (compilerError, stats) => {
+                try {
+                    (0, bundler_1.handleWebpackCompilationResult)(compilerError, stats);
+                    this.logger.info(cli_shared_1.LogColor.trace(cli_shared_1.Text.tunnel.functionsBundlingSucceeded));
+                    const bundle = (0, bundler_1.getInMemoryBundle)(entryPoints);
+                    if (!isFirstRun) {
+                        await onBuildFinished(null, bundle);
+                    }
+                    isFirstRun = false;
+                    resolve(bundle);
+                }
+                catch (err) {
+                    await onBuildFinished(err);
+                    isFirstRun = false;
+                    reject(err);
+                }
+            });
+        });
+    }
     getApp() {
         return this.app;
     }

package/out/tunnelling/servers/index.d.ts

@@ -1,4 +1,6 @@
 export * from './dev-server';
 export * from './resource-tunnel-server';
+export * from './custom-ui-tunnel-server';
+export * from './native-ui-tunnel-server';
 export * from './csp-reporter-server';
 //# sourceMappingURL=index.d.ts.map

package/out/tunnelling/servers/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC"}

package/out/tunnelling/servers/index.js

@@ -3,4 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./dev-server"), exports);
 tslib_1.__exportStar(require("./resource-tunnel-server"), exports);
+tslib_1.__exportStar(require("./custom-ui-tunnel-server"), exports);
+tslib_1.__exportStar(require("./native-ui-tunnel-server"), exports);
 tslib_1.__exportStar(require("./csp-reporter-server"), exports);

package/out/tunnelling/servers/native-ui-tunnel-server.d.ts

@@ -0,0 +1,11 @@
+import { ResourceTunnelServer, ResourceTunnelServerArgs } from './resource-tunnel-server';
+import { DevelopmentServer, StartDevServerResult, WatchHooks } from './dev-server';
+export declare class NativeUITunnelServer extends ResourceTunnelServer implements DevelopmentServer {
+    private readonly tunnelArgs;
+    private readonly server;
+    constructor(tunnelArgs: ResourceTunnelServerArgs);
+    start(): Promise<Required<StartDevServerResult>>;
+    compileAndWatch({ onBuildWillStart, onBuildFinished }: WatchHooks): Promise<void>;
+    stop(): Promise<void>;
+}
+//# sourceMappingURL=native-ui-tunnel-server.d.ts.map

package/out/tunnelling/servers/native-ui-tunnel-server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-ui-tunnel-server.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/native-ui-tunnel-server.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,wBAAwB,EAAoB,MAAM,0BAA0B,CAAC;AAG5G,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAEnF,qBAAa,oBAAqB,SAAQ,oBAAqB,YAAW,iBAAiB;IAG7E,OAAO,CAAC,QAAQ,CAAC,UAAU;IAFvC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAmB;gBAEb,UAAU,EAAE,wBAAwB;IAoD3D,KAAK,IAAI,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAC;IAWzC,eAAe,CAAC,EAAE,gBAAgB,EAAE,eAAe,EAAE,EAAE,UAAU,GAAG,OAAO,CAAC,IAAI,CAAC;IAsCxF,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;CAG5B"}

package/out/tunnelling/servers/native-ui-tunnel-server.js

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NativeUITunnelServer = void 0;
+const tslib_1 = require("tslib");
+const webpack_dev_server_1 = tslib_1.__importDefault(require("webpack-dev-server"));
+const bundler_1 = require("@forge/bundler");
+const resource_tunnel_server_1 = require("./resource-tunnel-server");
+const cli_shared_1 = require("@forge/cli-shared");
+const url_1 = require("url");
+class NativeUITunnelServer extends resource_tunnel_server_1.ResourceTunnelServer {
+    constructor(tunnelArgs) {
+        super(tunnelArgs);
+        this.tunnelArgs = tunnelArgs;
+        const { key, path, port, permissions, remotes } = tunnelArgs;
+        const entrypoint = { name: key, path };
+        const config = (0, bundler_1.getNativeUiBuildConfig)([entrypoint]);
+        const compiler = (0, bundler_1.getCompiler)(Object.assign(Object.assign({}, config), { infrastructureLogging: {
+                level: 'error'
+            }, stats: 'errors-only', watchOptions: {
+                aggregateTimeout: 200,
+                poll: 1000,
+                ignored: '**/node_modules'
+            } }));
+        this.server = new webpack_dev_server_1.default({
+            port,
+            host: resource_tunnel_server_1.TUNNEL_LOCALHOST,
+            setupMiddlewares: (middlewares) => {
+                const index = middlewares.findIndex((middleware) => middleware.name === 'webpack-dev-middleware');
+                middlewares.splice(index, 0, {
+                    name: 'custom-ui-scripts-middleware',
+                    middleware: this.getCustomUIHtmlTransformMiddleware(permissions, remotes)
+                });
+                middlewares.unshift({
+                    name: 'logging-middleware',
+                    middleware: (req, _, next) => {
+                        this.logFileServed(req.url, (input) => cli_shared_1.Text.tunnel.customUI.fileServed(input, this.key));
+                        next();
+                    }
+                });
+                return middlewares;
+            }
+        }, compiler);
+    }
+    async start() {
+        const { key, port } = this.tunnelArgs;
+        return {
+            port,
+            devServer: this,
+            resourceKey: key,
+            tunnelUrl: new url_1.URL(`http://${resource_tunnel_server_1.TUNNEL_LOCALHOST}:${port}`)
+        };
+    }
+    async compileAndWatch({ onBuildWillStart, onBuildFinished }) {
+        await this.server.start();
+        const compiler = this.server.compiler;
+        compiler.hooks.watchRun.tapAsync('watchRun', async (_, watchRunCallback) => {
+            await onBuildWillStart();
+            watchRunCallback();
+        });
+        let isFirtCompilation = true;
+        return new Promise((resolve, reject) => {
+            compiler.hooks.done.tapAsync('done', async (stats, doneCallback) => {
+                const maybeError = stats.hasErrors() ? stats.compilation.getErrors()[0] : undefined;
+                try {
+                    (0, bundler_1.handleWebpackCompilationResult)(maybeError, stats);
+                    this.logger.info(cli_shared_1.LogColor.trace(cli_shared_1.Text.tunnel.resourcesBundlingSucceeded));
+                    if (!isFirtCompilation) {
+                        await onBuildFinished(null);
+                    }
+                    else {
+                        isFirtCompilation = false;
+                    }
+                    resolve({});
+                }
+                catch (err) {
+                    await onBuildFinished(err);
+                    isFirtCompilation = false;
+                    reject(err);
+                }
+                finally {
+                    doneCallback();
+                }
+            });
+        });
+    }
+    async stop() {
+        return this.server.stop();
+    }
+}
+exports.NativeUITunnelServer = NativeUITunnelServer;

package/out/tunnelling/servers/resource-tunnel-server.d.ts

@@ -1,5 +1,7 @@
+/// <reference types="node" />
+import { RequestHandler } from 'http-proxy-middleware';
 import { Resource, Logger } from '@forge/cli-shared';
-import { Express } from 'express';
+import { CSPDetails } from '@forge/csp';
 import type { Permissions, Remotes } from '@forge/manifest';
 export interface ResourceTunnelServerArgs extends Resource {
     port: number;
@@ -8,18 +10,14 @@ export interface ResourceTunnelServerArgs extends Resource {
     cspReporterServerPort: number;
     remotes: Remotes;
 }
-export declare class ResourceTunnelServer {
-    private readonly port;
-    readonly key: string;
-    readonly path: string;
-    readonly logger: Logger;
-    private readonly app;
-    private server;
-    private readonly proxy;
-    private socket;
-    private cspReporterServerPort;
-    constructor({ port, key, path, tunnel, permissions, remotes, logger, cspReporterServerPort }: ResourceTunnelServerArgs);
-    getApp(): Express;
+export declare const TUNNEL_LOCALHOST: string;
+export declare abstract class ResourceTunnelServer {
+    protected readonly port: number;
+    protected readonly key: string;
+    protected readonly path: string;
+    protected readonly logger: Logger;
+    protected cspReporterServerPort: number;
+    constructor({ port, key, path, cspReporterServerPort, logger }: ResourceTunnelServerArgs);
     static transformPermissionsWithRemotes(permissions: Permissions, remotes: Remotes): {
         external: {
             fetch: {
@@ -37,14 +35,10 @@ export declare class ResourceTunnelServer {
         scopes?: import("packages/forge-manifest/out/schema/manifest").Scopes | undefined;
         content?: import("packages/forge-manifest/out/schema/manifest").Content1 | undefined;
     };
-    start(): Promise<void>;
-    stop(): Promise<void>;
-    private logFileServed;
-    private handleProxyDestinationNotStarted;
-    private handleWebsocketUpgrade;
-    private getCspHeader;
-    private injectGlobalBridgeScript;
-    private injectIframeResizerScript;
-    private getCustomUIResourceMiddleware;
+    protected logFileServed(reqUrl: string, textDecorator: (input: string) => string): void;
+    protected getCspHeader: (existingCsp: CSPDetails) => string;
+    protected injectGlobalBridgeScript: (htmlContent: Buffer) => Buffer;
+    protected injectIframeResizerScript: (htmlContent: Buffer) => Buffer;
+    protected getCustomUIHtmlTransformMiddleware: (permissions: Permissions, remotes: Remotes) => RequestHandler;
 }
 //# sourceMappingURL=resource-tunnel-server.d.ts.map

package/out/tunnelling/servers/resource-tunnel-server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"resource-tunnel-server.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/resource-tunnel-server.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EAMR,MAAM,EAGP,MAAM,mBAAmB,CAAC;AAC3B,OAAgB,EAAE,OAAO,EAAqB,MAAM,SAAS,CAAC;AAM9D,OAAO,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE5D,MAAM,WAAW,wBAAyB,SAAQ,QAAQ;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,WAAW,CAAC;IACzB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,OAAO,EAAE,OAAO,CAAC;CAClB;AAYD,qBAAa,oBAAoB;IAC/B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAS;IAC9B,SAAgB,GAAG,EAAE,MAAM,CAAC;IAC5B,SAAgB,IAAI,EAAE,MAAM,CAAC;IAC7B,SAAgB,MAAM,EAAE,MAAM,CAAC;IAC/B,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAU;IAC9B,OAAO,CAAC,MAAM,CAAqB;IACnC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA6B;IACnD,OAAO,CAAC,MAAM,CAAqB;IACnC,OAAO,CAAC,qBAAqB,CAAS;gBAE1B,EACV,IAAI,EACJ,GAAG,EACH,IAAI,EACJ,MAAM,EACN,WAAW,EACX,OAAO,EACP,MAAM,EACN,qBAAqB,EACtB,EAAE,wBAAwB;IA0C3B,MAAM,IAAI,OAAO;IAIjB,MAAM,CAAC,+BAA+B,CAAC,WAAW,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO;;;;;;;;;;;;;;;;;IAa3E,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC;IAStB,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAc3B,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,gCAAgC;IAoBxC,OAAO,CAAC,sBAAsB;IAQ9B,OAAO,CAAC,YAAY,CAOJ;IAEhB,OAAO,CAAC,wBAAwB,CAG3B;IAEL,OAAO,CAAC,yBAAyB,CAG5B;IAEL,OAAO,CAAC,6BAA6B,CAwBhC;CACN"}
+{"version":3,"file":"resource-tunnel-server.d.ts","sourceRoot":"","sources":["../../../src/tunnelling/servers/resource-tunnel-server.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EACL,QAAQ,EAMR,MAAM,EAEP,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAA6C,MAAM,YAAY,CAAC;AACnF,OAAO,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAG5D,MAAM,WAAW,wBAAyB,SAAQ,QAAQ;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,WAAW,CAAC;IACzB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,gBAAgB,QAAsE,CAAC;AAEpG,8BAAsB,oBAAoB;IACxC,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IAChC,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IAC/B,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IAChC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IAClC,SAAS,CAAC,qBAAqB,EAAE,MAAM,CAAC;gBAE5B,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,qBAAqB,EAAE,MAAM,EAAE,EAAE,wBAAwB;IAQxF,MAAM,CAAC,+BAA+B,CAAC,WAAW,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO;;;;;;;;;;;;;;;;;IAajF,SAAS,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,IAAI;IAMvF,SAAS,CAAC,YAAY,gBAAiB,UAAU,KAAG,MAAM,CAO1C;IAEhB,SAAS,CAAC,wBAAwB,gBAAiB,MAAM,YAGpD;IAEL,SAAS,CAAC,yBAAyB,gBAAiB,MAAM,YAGrD;IAEL,SAAS,CAAC,kCAAkC,gBAAiB,WAAW,uBAAqB,cAAc,CAqBpG;CACR"}

package/out/tunnelling/servers/resource-tunnel-server.js

@@ -1,19 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ResourceTunnelServer = void 0;
-const tslib_1 = require("tslib");
+exports.ResourceTunnelServer = exports.TUNNEL_LOCALHOST = void 0;
 const cli_shared_1 = require("@forge/cli-shared");
-const express_1 = tslib_1.__importDefault(require("express"));
-const http_proxy_middleware_1 = require("http-proxy-middleware");
 const csp_1 = require("@forge/csp");
-const express_mung_1 = require("express-mung");
-var ConnectionErrorCode;
-(function (ConnectionErrorCode) {
-    ConnectionErrorCode["REFUSED"] = "ECONNREFUSED";
-})(ConnectionErrorCode || (ConnectionErrorCode = {}));
-const HOST = process.env.FORGE_DEV_TUNNEL ? 'localhost' : 'host.docker.internal';
+const express_intercept_1 = require("express-intercept");
+exports.TUNNEL_LOCALHOST = process.env.FORGE_DEV_TUNNEL ? 'localhost' : 'host.docker.internal';
 class ResourceTunnelServer {
-    constructor({ port, key, path, tunnel, permissions, remotes, logger, cspReporterServerPort }) {
+    constructor({ port, key, path, cspReporterServerPort, logger }) {
         this.getCspHeader = (existingCsp) => new csp_1.CSPInjectionService()
             .getInjectableCSP(existingCsp, (0, cli_shared_1.getEnvironment)(cli_shared_1.CDNEnvironments), `http://localhost:${this.cspReporterServerPort}`)
             .join('; ');
@@ -23,11 +16,11 @@ class ResourceTunnelServer {
         this.injectIframeResizerScript = (htmlContent) => new cli_shared_1.IframeResizerScriptService().injectIframeResizer(htmlContent, () => {
             throw new Error('Malformed HTML document');
         });
-        this.getCustomUIResourceMiddleware = (permissions, remotes) => (0, express_mung_1.write)((body, _, __, res) => {
-            const contentType = res.getHeaders()['content-type'];
-            if (!contentType.startsWith('text/html'))
+        this.getCustomUIHtmlTransformMiddleware = (permissions, remotes) => (0, express_intercept_1.responseHandler)()
+            .if((res) => /html/i.test(res.get('content-type')))
+            .replaceBuffer((body, _, res) => {
+            if (!res)
                 return body;
-            res.removeHeader('content-length');
             const htmlContentWithIframeResizerScript = this.injectIframeResizerScript(body);
             const htmlContentWithBridgeScript = this.injectGlobalBridgeScript(htmlContentWithIframeResizerScript);
             const cspDetails = new csp_1.CSPProcessingService({ info: () => { } }).getCspDetails(htmlContentWithBridgeScript, ResourceTunnelServer.transformPermissionsWithRemotes(permissions, remotes));
@@ -39,42 +32,6 @@ class ResourceTunnelServer {
         this.path = path;
         this.logger = logger;
         this.cspReporterServerPort = cspReporterServerPort;
-        this.app = (0, express_1.default)();
-        this.app.use(this.getCustomUIResourceMiddleware(permissions, remotes));
-        if (tunnel) {
-            const { port: tunnelPort } = tunnel;
-            this.proxy = (0, http_proxy_middleware_1.createProxyMiddleware)({
-                target: `http://${HOST}:${tunnelPort}`,
-                ws: true,
-                logLevel: 'info',
-                logProvider: () => {
-                    return {
-                        log: this.logger.trace,
-                        debug: this.logger.trace,
-                        info: this.logger.trace,
-                        warn: this.logger.warn,
-                        error: this.logger.error
-                    };
-                },
-                onError: (err, req, res) => {
-                    this.handleProxyDestinationNotStarted(err, req.url, res, tunnelPort);
-                },
-                onProxyReq: (_proxyReq, req) => {
-                    this.logFileServed(req.url, (input) => cli_shared_1.Text.tunnel.customUI.fileProxied(input, this.key, tunnelPort));
-                }
-            });
-            this.app.use('/', this.proxy);
-        }
-        else {
-            this.app.use((req, _res, next) => {
-                this.logFileServed(req.url, (input) => cli_shared_1.Text.tunnel.customUI.fileServed(input, this.key));
-                next();
-            });
-            this.app.use(express_1.default.static(this.path));
-        }
-    }
-    getApp() {
-        return this.app;
     }
     static transformPermissionsWithRemotes(permissions, remotes) {
         var _a, _b, _c, _d, _e;
@@ -86,45 +43,10 @@ class ResourceTunnelServer {
         }).filter((item) => typeof item === 'string')) !== null && _d !== void 0 ? _d : undefined;
         return Object.assign(Object.assign({}, permissions), { external: Object.assign(Object.assign({}, permissions.external), { fetch: Object.assign(Object.assign({}, (_e = permissions.external) === null || _e === void 0 ? void 0 : _e.fetch), { client }) }) });
     }
-    async start() {
-        return new Promise((resolve) => {
-            this.server = this.app.listen(this.port, resolve);
-            this.server.on('upgrade', (req, socket, head) => this.handleWebsocketUpgrade(req, socket, head));
-        });
-    }
-    async stop() {
-        if (this.socket) {
-            this.socket.end();
-        }
-        return new Promise((resolve, reject) => {
-            if (!this.server) {
-                return resolve();
-            }
-            this.server.close((err) => (err ? reject(err) : resolve()));
-        });
-    }
     logFileServed(reqUrl, textDecorator) {
         if (reqUrl !== '/' && reqUrl !== '/index.html')
             return;
         this.logger.info(cli_shared_1.LogColor.trace(textDecorator('index.html')));
     }
-    handleProxyDestinationNotStarted(err, reqUrl, res, tunnelPort) {
-        if ((err === null || err === void 0 ? void 0 : err.code) !== ConnectionErrorCode.REFUSED || (reqUrl !== '/' && reqUrl !== 'index.html')) {
-            this.logger.error(err);
-            return;
-        }
-        res.writeHead(500, {
-            'Content-Type': 'text/plain'
-        });
-        this.logger.error(new Error(cli_shared_1.Text.tunnel.error.serverNotStartedOnPort(tunnelPort)));
-        res.end(cli_shared_1.Text.tunnel.error.serverNotStartedOnPort(tunnelPort));
-    }
-    handleWebsocketUpgrade(req, socket, head) {
-        var _a;
-        this.socket = socket;
-        if ((_a = this.proxy) === null || _a === void 0 ? void 0 : _a.upgrade) {
-            return this.proxy.upgrade(req, socket, head);
-        }
-    }
 }
 exports.ResourceTunnelServer = ResourceTunnelServer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@forge/tunnel",
-  "version": "2.1.5-next.3",
+  "version": "2.2.0-next.4",
   "description": "Tunnel functionality for Forge CLI",
   "author": "Atlassian",
   "license": "UNLICENSED",
@@ -16,24 +16,24 @@
     "postbuild": "chmod +x out/*.js"
   },
   "dependencies": {
-    "@forge/bundler": "4.0.3-next.1",
-    "@forge/cli-shared": "3.4.0-next.0",
+    "@forge/bundler": "4.1.0-next.2",
+    "@forge/cli-shared": "3.4.0-next.1",
     "@forge/csp": "^2.0.1",
     "@forge/isolated-vm": "3.3.10",
-    "@forge/runtime": "2.6.0-next.2",
+    "@forge/runtime": "2.6.0-next.3",
     "express": "^4.17.1",
-    "express-mung": "^0.5.1",
+    "express-intercept": "^0.8.10",
     "http-proxy-middleware": "^1.0.6",
     "ngrok": "^4.3.1",
     "node-cache": "^5.1.2",
     "tmp": "^0.1.0",
     "tslib": "^2.4.0",
-    "uuid": "^3.4.0"
+    "uuid": "^3.4.0",
+    "webpack-dev-server": "^4.11.1"
   },
   "devDependencies": {
     "@forge/manifest": "^4.5.1",
     "@types/express": "^4.17.2",
-    "@types/express-mung": "^0.5.2",
     "@types/jest": "^29.1.2",
     "@types/node": "^12.12.63",
     "@types/node-fetch": "^2.5.7",