Use steve with embedded dashboard

This converts Rancher Desktop to use steve with embedded dashboard, instead
of manually running a second server to handle the static assets.  Since we
already need to run a standalone forked steve, this makes it easier without
significantly making anything more difficult.

Note that the copy of steve we are using is already significantly outdated
(as is the copy of dashboard), so we will need to update those at some
point.

Signed-off-by: Mark Yen <mark.yen@suse.com>

Author: mook-as

.gitignore

@@ -13,7 +13,6 @@
 /resources/linux/*
 !/resources/linux/rancher-desktop.desktop
 /resources/preload.js*
-/resources/rancher-dashboard/
 /resources/rdx-proxy.tar
 /resources/spin-operator*
 /resources/win32/

background.ts

@@ -27,15 +27,14 @@ import { BackendState, CommandWorkerInterface, HttpCommandServer } from '@pkg/ma
 import SettingsValidator from '@pkg/main/commandServer/settingsValidator';
 import { ContainerExecHandler } from '@pkg/main/containerExec';
 import { HttpCredentialHelperServer } from '@pkg/main/credentialServer/httpCredentialHelperServer';
-import { DashboardServer } from '@pkg/main/dashboardServer';
 import { DeploymentProfileError, readDeploymentProfiles } from '@pkg/main/deploymentProfiles';
 import { DiagnosticsManager, DiagnosticsResultCollection } from '@pkg/main/diagnostics/diagnostics';
 import { ExtensionErrorCode, isExtensionError } from '@pkg/main/extensions';
 import { ImageEventHandler } from '@pkg/main/imageEvents';
 import { getIpcMainProxy } from '@pkg/main/ipcMain';
 import mainEvents from '@pkg/main/mainEvents';
 import buildApplicationMenu from '@pkg/main/mainmenu';
-import setupNetworking, { setSteveCertPort } from '@pkg/main/networking';
+import setupNetworking from '@pkg/main/networking';
 import { Snapshots } from '@pkg/main/snapshots/snapshots';
 import { Snapshot, SnapshotDialog } from '@pkg/main/snapshots/types';
 import { Tray } from '@pkg/main/tray';
@@ -229,8 +228,6 @@ Electron.app.whenReady().then(async() => {
 
     await setupNetworking();
 
-    DashboardServer.getInstance().init();
-
     try {
       deploymentProfiles = await readDeploymentProfiles();
     } catch (ex: any) {
@@ -1272,14 +1269,7 @@ function newK8sManager() {
 
         if (enabledK8s) {
           try {
-            const [stevePort] = await getAvailablePorts(1);
-
-            console.log(`Steve HTTPS port: ${ stevePort }`);
-            // Set the Steve HTTPS port for certificate checking before setting
-            // up Steve itself.
-            setSteveCertPort(stevePort);
-            await Steve.getInstance().start(stevePort);
-            DashboardServer.getInstance().setStevePort(stevePort); // recreate proxy middleware
+            await Steve.getInstance().start();
           } catch (ex) {
             console.error('Failed to start Steve:', ex);
           }

e2e/extensions.e2e.spec.ts

@@ -3,6 +3,7 @@
  * An E2E test is required to have access to the web page context.
  */
 
+import http from 'http';
 import os from 'os';
 import path from 'path';
 
@@ -279,22 +280,6 @@ test.describe.serial('Extensions', () => {
           exitCodes: [0],
         }));
       });
-
-      test('bypass CORS', async() => {
-        // This is the dashboard URL; it does not have CORS set up so it would
-        // normally fail to fetch due to CORS reasons.  However, this test case
-        // checks that our CORS bypass is working.
-        const url = 'http://127.0.0.1:6120/c/local/explorer/node';
-        const script = `
-          (async () => {
-            const result = await fetch('${ url }');
-            return Object.fromEntries(result.headers.entries());
-          })()
-        `;
-        const result = await evalInView(script);
-
-        expect(result).toHaveProperty('content-type');
-      });
     });
 
     test.describe('ddClient.docker', () => {
@@ -423,13 +408,26 @@ test.describe.serial('Extensions', () => {
         });
       });
       test('can fetch from external sources', async() => {
-        const url = 'http://127.0.0.1:6120/c/local/explorer/node'; // dashboard
+        const contents = 'Hello from E2E tests';
+        const server = http.createServer((req, res) => {
+          // This server does not include CORS headers; it would fail without
+          // CORS bypass.
+          res.writeHead(200, { 'Content-Type': 'text/plain' });
+          res.end(contents);
+        });
+        await new Promise<void>(resolve => server.listen(0, '127.0.0.1', resolve));
+        try {
+          const port = (server.address() as any).port;
+          const url = `http://127.0.0.1:${ port }/`;
 
-        await retry(async() => {
-          const result = evalInView(`ddClient.extension.vm.service.get("${ url }")`);
+          await retry(async() => {
+            const result = evalInView(`ddClient.extension.vm.service.get("${ url }")`);
 
-          await expect(result).resolves.toContain('<title>Rancher</title>');
-        });
+            await expect(result).resolves.toContain(contents);
+          });
+        } finally {
+          server.close();
+        }
       });
       test.describe('can post values', () => {
         test('with string body', async() => {

pkg/rancher-desktop/backend/steve.ts

@@ -6,6 +6,7 @@ import { setTimeout } from 'timers/promises';
 import Electron from 'electron';
 
 import K3sHelper from '@pkg/backend/k3sHelper';
+import Latch from '@pkg/utils/latch';
 import Logging from '@pkg/utils/logging';
 import paths from '@pkg/utils/paths';
 
@@ -16,10 +17,10 @@ const console = Logging.steve;
  */
 export class Steve {
   private static instance: Steve;
-  private process!:        ChildProcess;
+  private process:         ChildProcess | undefined;
 
   private isRunning: boolean;
-  private httpsPort = 0;
+  #port = 0;
 
   private constructor() {
     this.isRunning = false;
@@ -40,19 +41,17 @@ export class Steve {
   /**
    * @description Starts the Steve API if one is not already running.
    * Returns only after Steve is ready to accept connections.
-   * @param httpsPort The HTTPS port for Steve to listen on.
+   * @returns The port Steve is listening on.
    */
-  public async start(httpsPort: number) {
+  public async start(): Promise<number> {
     const { pid } = this.process || { };
 
     if (this.isRunning && pid) {
       console.debug(`Steve is already running with pid: ${ pid }`);
 
-      return;
+      return this.#port;
     }
 
-    this.httpsPort = httpsPort;
-
     const osSpecificName = /^win/i.test(os.platform()) ? 'steve.exe' : 'steve';
     const stevePath = path.join(paths.resources, os.platform(), 'internal', osSpecificName);
     const env = Object.assign({}, process.env);
@@ -62,33 +61,37 @@ export class Steve {
     } catch {
       // do nothing
     }
+    console.debug(`Starting Steve with KUBECONFIG=${ env.KUBECONFIG }`);
     this.process = spawn(
       stevePath,
       [
         '--context',
         'rancher-desktop',
-        '--ui-path',
-        path.join(paths.resources, 'rancher-dashboard'),
         '--offline',
         'true',
-        '--https-listen-port',
-        String(httpsPort),
-        '--http-listen-port',
-        '0', // Disable HTTP support; it does not work correctly anyway.
       ],
-      { env },
+      { env, stdio: ['ignore', 'pipe', 'pipe'], windowsHide: true },
     );
 
     const { stdout, stderr } = this.process;
+    let portBuffer = '';
+    const portLatch = Latch<number>();
 
     if (!stdout || !stderr) {
       console.error('Unable to get child process...');
 
-      return;
+      throw new Error(`Failed to start Steve: could not get output`);
     }
 
+    console.debug('Waiting for Steve to output port...');
     stdout.on('data', (data: any) => {
-      console.log(`stdout: ${ data }`);
+      portBuffer += data.toString();
+    });
+    stdout.on('end', () => {
+      const port = parseInt(portBuffer, 10);
+      if (port) {
+        portLatch.resolve(port);
+      }
     });
 
     stderr.on('data', (data: any) => {
@@ -101,23 +104,32 @@ export class Steve {
     });
 
     await new Promise<void>((resolve, reject) => {
-      this.process.once('spawn', () => {
+      this.process?.once('spawn', () => {
         this.isRunning = true;
-        console.debug(`Spawned child pid: ${ this.process.pid }`);
+        console.debug(`Spawned child pid: ${ this.process?.pid }`);
         resolve();
       });
-      this.process.once('error', (err) => {
+      this.process?.once('error', (err) => {
         reject(new Error(`Failed to spawn Steve: ${ err.message }`, { cause: err }));
       });
+      setTimeout(10_000).then(() => reject(new Error('Timed out waiting for Steve to start')));
     });
+    this.#port = await portLatch;
+    console.debug(`Steve is listening on port: ${ this.#port }`);
 
-    await this.waitForReady();
+    await this.waitForReady(this.#port);
+
+    return this.#port;
+  }
+
+  public get port() {
+    return this.#port;
   }
 
   /**
    * Wait for Steve to be ready to serve API requests.
    */
-  private async waitForReady(): Promise<void> {
+  private async waitForReady(port: number): Promise<void> {
     const maxAttempts = 60;
     const delayMs = 500;
 
@@ -126,7 +138,7 @@ export class Steve {
         throw new Error('Steve process exited before becoming ready');
       }
 
-      if (await this.isPortReady()) {
+      if (await this.isPortReady(port)) {
         console.debug(`Steve is ready after ${ attempt } / ${ maxAttempts } attempt(s)`);
 
         return;
@@ -146,55 +158,17 @@ export class Steve {
    * we probe a core resource endpoint that returns 404 until the
    * schema controller has registered it.
    */
-  private isPortReady(): Promise<boolean> {
-    // Steve's HTTP port just redirects to HTTPS, so we might as well go to the
-    // HTTPS port directly.  We will need to ignore certificate errors; however,
-    // neither the NodeJS stack nor Electron.net.request() would pass through
-    // the `Electron.app.on('certificate-error', ...)` handler, so we cannot use
-    // the normal certificate handling for this health check.  Instead, we
-    // create a temporary session with a certificate verify proc that ignores
-    // errors, and use that session for the health check request.
-    return new Promise((resolve) => {
-      const session = Electron.session.fromPartition('steve-healthcheck', { cache: false });
-
-      session.setCertificateVerifyProc((request, callback) => {
-        if (request.hostname === '127.0.0.1') {
-          // We do not have any more information to narrow down the certificate;
-          // given that we're doing this in a private partition, it should be
-          // safe to allow all localhost certificates.  In particular, we do not
-          // get access to the port number, and all the Steve certificates have
-          // generic fields (e.g. subject).
-          callback(0);
-        } else {
-          // Unexpected request; not sure how this could happen in a new session,
-          // but we can at least pretend to do the right thing.
-          callback(-3); // Use Chromium's default verification.
-        }
-      });
-
-      const req = Electron.net.request({
-        protocol: 'https:',
-        hostname: '127.0.0.1',
-        port:     this.httpsPort,
-        path:     '/v1/namespaces',
-        method:   'GET',
-        redirect: 'error',
-        session,
-      });
-
-      req.on('response', (res) => resolve(res.statusCode === 200));
-      req.on('error', () => resolve(false));
-      // Timeout if we don't get a response in a reasonable time.
-      setTimeout(1_000).then(() => {
-        try {
-          req.abort();
-        } catch {
-          // ignore
-        }
-        resolve(false);
-      });
-      req.end();
-    });
+  private async isPortReady(port: number): Promise<boolean> {
+    try {
+      // Set up a short time out, so we don't wait too long.
+      const signal = AbortSignal.timeout(1_000);
+      const resp = await Electron.net.fetch(
+        `http://127.0.0.1:${ port }/v1/namespaces`,
+        { redirect: 'error', signal });
+      return resp.ok;
+    } catch {
+      return false;
+    }
   }
 
   /**
@@ -205,6 +179,7 @@ export class Steve {
       return;
     }
 
-    this.process.kill('SIGINT');
+    this.process?.kill('SIGINT');
+    this.#port = 0;
   }
 }