refactor(electron): fix vitest and add behavior test (#4655)

packages/frontend/electron/scripts/common.ts

@@ -9,22 +9,13 @@ export const rootDir = resolve(electronDir, '..', '..', '..');
 
 export const NODE_MAJOR_VERSION = 18;
 
-// hard-coded for now:
-// fixme(xp): report error if app is not running on DEV_SERVER_URL
-const DEV_SERVER_URL = process.env.DEV_SERVER_URL;
-
 export const mode = (process.env.NODE_ENV =
   process.env.NODE_ENV || 'development');
 
 export const config = (): BuildOptions => {
-  const define = Object.fromEntries([
-    ['process.env.NODE_ENV', `"${mode}"`],
-    ['process.env.USE_WORKER', '"true"'],
-  ]);
+  const define: Record<string, string> = {};
 
-  if (DEV_SERVER_URL) {
-    define['process.env.DEV_SERVER_URL'] = `"${DEV_SERVER_URL}"`;
-  }
+  define['REPLACE_ME_BUILD_ENV'] = `"${process.env.BUILD_TYPE ?? 'stable'}"`;
 
   return {
     entryPoints: [
@@ -45,11 +36,11 @@ export const config = (): BuildOptions => {
       'semver',
       'tinykeys',
     ],
-    define: define,
     format: 'cjs',
     loader: {
       '.node': 'copy',
     },
+    define,
     assetNames: '[name]',
     treeShaking: true,
     sourcemap: 'linked',

packages/frontend/electron/scripts/dev.ts

@@ -1,11 +1,10 @@
-/* eslint-disable no-async-promise-executor */
 import { spawn } from 'node:child_process';
 
 import type { ChildProcessWithoutNullStreams } from 'child_process';
-import electronPath from 'electron';
+import type { BuildContext } from 'esbuild';
 import * as esbuild from 'esbuild';
 
-import { config } from './common';
+import { config, electronDir } from './common';
 
 // this means we don't spawn electron windows, mainly for testing
 const watchMode = process.argv.includes('--watch');
@@ -30,7 +29,10 @@ function spawnOrReloadElectron() {
     spawnProcess = null;
   }
 
-  spawnProcess = spawn(String(electronPath), ['.']);
+  spawnProcess = spawn('electron', ['.'], {
+    cwd: electronDir,
+    env: process.env,
+  });
 
   spawnProcess.stdout.on('data', d => {
     const str = d.toString().trim();
@@ -38,6 +40,7 @@ function spawnOrReloadElectron() {
       console.log(str);
     }
   });
+
   spawnProcess.stderr.on('data', d => {
     const data = d.toString().trim();
     if (!data) return;
@@ -47,16 +50,20 @@ function spawnOrReloadElectron() {
   });
 
   // Stops the watch script when the application has quit
-  spawnProcess.on('exit', process.exit);
+  spawnProcess.on('exit', code => {
+    if (code && code !== 0) {
+      console.log(`Electron exited with code ${code}`);
+    }
+    process.exit(code ?? 0);
+  });
 }
 
 const common = config();
 
 async function watchLayers() {
-  return new Promise<void>(async resolve => {
-    let initialBuild = false;
-
-    const buildContext = await esbuild.context({
+  let initialBuild = false;
+  return new Promise<BuildContext>(resolve => {
+    const buildContextPromise = esbuild.context({
       ...common,
       plugins: [
         ...(common.plugins ?? []),
@@ -68,7 +75,7 @@ async function watchLayers() {
                 console.log(`[layers] has changed, [re]launching electron...`);
                 spawnOrReloadElectron();
               } else {
-                resolve();
+                buildContextPromise.then(resolve);
                 initialBuild = true;
               }
             });
@@ -76,19 +83,18 @@ async function watchLayers() {
         },
       ],
     });
-    await buildContext.watch();
+    buildContextPromise.then(async buildContext => {
+      await buildContext.watch();
+    });
   });
 }
 
-async function main() {
-  await watchLayers();
+await watchLayers();
 
-  if (watchMode) {
-    console.log(`Watching for changes...`);
-  } else {
-    spawnOrReloadElectron();
-    console.log(`Electron is started, watching for changes...`);
-  }
+if (watchMode) {
+  console.log(`Watching for changes...`);
+} else {
+  console.log('Starting electron...');
+  spawnOrReloadElectron();
+  console.log(`Electron is started, watching for changes...`);
 }
-
-main();