Fix "app-init" injection (#15320)

* Fix "app-init" injection

The way we were injecting variables into the `app-init.js` bundle was
accidentally overwriting the bundle output with the raw `app-init.js`
source file. This is a problem because the bundling process handles a
lot of things we care about like source maps, polyfills and other
necessary Babel transformations, environment variable injection, and
minification.

Instead of using string replacement to inject variables, we are now
using environment variables. The old string replacement strategy has
been removed, and the `app-init.js` module is now generated using the
same process as our other bundles.

A new option, "extraEnvironmentVariables", was added to allow us to
inject environment variables specifically for this bundle.

* Add check to ensure APPLY_LAVAMOAT is set

app/scripts/app-init.js

@@ -5,9 +5,7 @@
 // eslint-disable-next-line
 let scriptsLoadInitiated = false;
 
-// Variable testMode is set to true when preparing test build.
-// This helps in changing service worker execution in test environment.
-const testMode = false;
+const testMode = process.env.IN_TEST;
 
 const loadTimeLogs = [];
 
@@ -52,13 +50,18 @@ function importAllScripts() {
   };
 
   const startImportScriptsTime = Date.now();
+
   // value of applyLavaMoat below is dynamically replaced at build time with actual value
-  const applyLavaMoat = true;
+  const applyLavaMoat = process.env.APPLY_LAVAMOAT;
+  if (typeof applyLavaMoat !== 'boolean') {
+    throw new Error('Missing APPLY_LAVAMOAT environment variable');
+  }
 
   loadFile('./globalthis.js');
   loadFile('./sentry-install.js');
 
-  if (applyLavaMoat) {
+  // Always apply LavaMoat in e2e test builds, so that we can capture initialization stats
+  if (testMode || applyLavaMoat) {
     loadFile('./runtime-lavamoat.js');
     loadFile('./lockdown-more.js');
     loadFile('./policy-load.js');
@@ -70,12 +73,9 @@ function importAllScripts() {
     loadFile('./runtime-cjs.js');
   }
 
-  const fileList = [
-    // The list of files is injected at build time by replacing comment below with comma separated strings of file names
-    // https://github.com/MetaMask/metamask-extension/blob/496d9d81c3367931031edc11402552690c771acf/development/build/scripts.js#L406
-    /** FILE NAMES */
-  ];
-
+  // This environment variable is set to a string of comma-separated relative file paths.
+  const rawFileList = process.env.FILE_NAMES;
+  const fileList = rawFileList.split(',');
   fileList.forEach((fileName) => loadFile(fileName));
 
   // Import all required resources

development/build/scripts.js

@@ -439,30 +439,6 @@ function createScriptTasks({
   }
 }
 
-const postProcessServiceWorker = (
-  mv3BrowserPlatforms,
-  fileList,
-  applyLavaMoat,
-  testing,
-) => {
-  mv3BrowserPlatforms.forEach((browser) => {
-    const appInitFile = `./dist/${browser}/app-init.js`;
-    const fileContent = readFileSync('./app/scripts/app-init.js', 'utf8');
-    let fileOutput = fileContent.replace('/** FILE NAMES */', fileList);
-    if (testing) {
-      fileOutput = fileOutput.replace('testMode = false', 'testMode = true');
-    } else {
-      // Setting applyLavaMoat to true in testing mode
-      // This is to enable capturing initialisation time stats using e2e with lavamoat statsMode enabled
-      fileOutput = fileOutput.replace(
-        'const applyLavaMoat = true;',
-        `const applyLavaMoat = ${applyLavaMoat};`,
-      );
-    }
-    writeFileSync(appInitFile, fileOutput);
-  });
-};
-
 /**
  * Create the bundle for the app initialization module used in manifest v3
  * builds.
@@ -510,10 +486,19 @@ async function createManifestV3AppInitializationBundle({
   const mv3BrowserPlatforms = browserPlatforms.filter(
     (platform) => platform !== 'firefox',
   );
-  const fileList = jsBundles.reduce(
-    (result, file) => `${result}'${file}',\n    `,
-    '',
-  );
+
+  for (const filename of jsBundles) {
+    if (filename.includes(',')) {
+      throw new Error(
+        `Invalid filename "${filename}", not allowed to contain comma.`,
+      );
+    }
+  }
+
+  const extraEnvironmentVariables = {
+    APPLY_LAVAMOAT: applyLavaMoat,
+    FILE_NAMES: jsBundles.join(','),
+  };
 
   await createNormalBundle({
     browserPlatforms: mv3BrowserPlatforms,
@@ -521,6 +506,7 @@ async function createManifestV3AppInitializationBundle({
     destFilepath: 'app-init.js',
     devMode,
     entryFilepath: './app/scripts/app-init.js',
+    extraEnvironmentVariables,
     ignoredFiles,
     label,
     testing,
@@ -529,29 +515,6 @@ async function createManifestV3AppInitializationBundle({
     version,
   })();
 
-  postProcessServiceWorker(
-    mv3BrowserPlatforms,
-    fileList,
-    applyLavaMoat,
-    testing,
-  );
-
-  // If the application is running in development mode, we watch service worker file to
-  // in case the file is changes we need to process it again to replace "/** FILE NAMES */", "testMode" etc.
-  if (devMode && !testing) {
-    let prevChromeFileContent;
-    watch('./dist/chrome/app-init.js', () => {
-      const chromeFileContent = readFileSync(
-        './dist/chrome/app-init.js',
-        'utf8',
-      );
-      if (chromeFileContent !== prevChromeFileContent) {
-        prevChromeFileContent = chromeFileContent;
-        postProcessServiceWorker(mv3BrowserPlatforms, fileList, applyLavaMoat);
-      }
-    });
-  }
-
   // Code below is used to set statsMode to true when testing in MV3
   // This is used to capture module initialisation stats using lavamoat.
   if (testing) {
@@ -811,6 +774,8 @@ function createFactoredBuild({
  * development.
  * @param {string[]} options.entryFilepath - The entry point file path,
  * relative to the repository root directory.
+ * @param {Record<string, unknown>} options.extraEnvironmentVariables - Extra
+ * environment variables to inject just into this bundle.
  * @param {string[] | null} options.ignoredFiles - A list of files to exclude
  * from the current build.
  * @param {string} options.label - A label used to describe this bundle in any
@@ -831,6 +796,7 @@ function createNormalBundle({
   destFilepath,
   devMode,
   entryFilepath,
+  extraEnvironmentVariables,
   ignoredFiles,
   label,
   policyOnly,
@@ -848,12 +814,15 @@ function createNormalBundle({
     const reloadOnChange = Boolean(devMode);
     const minify = Boolean(devMode) === false;
 
-    const envVars = getEnvironmentVariables({
-      buildType,
-      devMode,
-      testing,
-      version,
-    });
+    const envVars = {
+      ...getEnvironmentVariables({
+        buildType,
+        devMode,
+        testing,
+        version,
+      }),
+      ...extraEnvironmentVariables,
+    };
     setupBundlerDefaults(buildConfiguration, {
       buildType,
       devMode,