From 58ca7af401213bb35783f2c9cc4fae8a0fec69cf Mon Sep 17 00:00:00 2001
From: David Murdoch <187813+davidmurdoch@users.noreply.github.com>
Date: Mon, 16 Dec 2024 12:35:54 -0500
Subject: [PATCH] build(webpack): fix `--zip` in Node.js 22 by cloning assets
 into `Uint8Array`s before zipping (#29177)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Use a copy of the Buffer via `Buffer.from(asset)`, as Zip will *consume*
it, which breaks things if we are compiling for multiple browsers at
once. `Buffer.from` uses the internal pool, so it's superior to `new
Uint8Array` if we don't need to pass it off to a worker thread.

Additionally, in Node.js 22+ a Buffer marked as "Untransferable" (like
ours) can't be passed to a worker, which `AsyncZipDeflate` uses. See:
https://github.com/101arrowz/fflate/issues/227#issuecomment-2540024304

This can probably be simplified to `zipFile.push(Buffer.from(asset),
true);` if the above issue is resolved.

This fix should hopefully unblock
https://github.com/MetaMask/metamask-extension/pull/28368


<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.


## **Description**

<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?


[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/29177?quickstart=1)

## **Related issues**

Fixes:

## **Manual testing steps**

1. Go to this page...
2.
3.

## **Screenshots/Recordings**


### **Before**


### **After**


## **Pre-merge author checklist**

- [ ] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding
Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] I've completed the PR template to the best of my ability
- [ ] I’ve included tests if applicable
- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [ ] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

-->
---
 .../utils/plugins/ManifestPlugin/index.ts     | 35 +++++++++----------
 1 file changed, 17 insertions(+), 18 deletions(-)

diff --git a/development/webpack/utils/plugins/ManifestPlugin/index.ts b/development/webpack/utils/plugins/ManifestPlugin/index.ts
index bd18541cc1e3..a29219084de6 100644
--- a/development/webpack/utils/plugins/ManifestPlugin/index.ts
+++ b/development/webpack/utils/plugins/ManifestPlugin/index.ts
@@ -25,16 +25,6 @@ type Assets = Compilation['assets'];
 const NAME = 'ManifestPlugin';
 const BROWSER_TEMPLATE_RE = /\[browser\]/gu;
 
-/**
- * Clones a Buffer or Uint8Array and returns it
- *
- * @param data
- * @returns
- */
-function clone(data: Buffer | Uint8Array): Buffer {
-  return Buffer.from(data);
-}
-
 /**
  * Adds the given asset to the zip file
  *
@@ -54,12 +44,23 @@ function addAssetToZip(
   zip: Zip,
 ): void {
   const zipFile = compress
-    ? new AsyncZipDeflate(assetName, compressionOptions)
-    : new ZipPassThrough(assetName);
+    ? // AsyncZipDeflate uses workers
+      new AsyncZipDeflate(assetName, compressionOptions)
+    : // ZipPassThrough doesn't use workers
+      new ZipPassThrough(assetName);
   zipFile.mtime = mtime;
   zip.add(zipFile);
-  // use a copy of the Buffer, as Zip will consume it
-  zipFile.push(asset, true);
+  // Use a copy of the Buffer via `Buffer.from(asset)`, as Zip will *consume*
+  // it, which breaks things if we are compiling for multiple browsers at once.
+  // `Buffer.from` uses the internal pool, so it's superior to `new Uint8Array`
+  // if we don't need to pass it off to a worker thread.
+  //
+  // Additionally, in Node.js 22+ a Buffer marked as "Untransferable" (like
+  // ours) can't be passed to a worker, which `AsyncZipDeflate` uses.
+  // See: https://github.com/101arrowz/fflate/issues/227#issuecomment-2540024304
+  // this can probably be simplified to `zipFile.push(Buffer.from(asset), true);`
+  // if the above issue is resolved.
+  zipFile.push(compress ? new Uint8Array(asset) : Buffer.from(asset), true);
 }
 
 /**
@@ -145,7 +146,7 @@ export class ManifestPlugin<Z extends boolean> {
             errored = true;
             reject(error);
           } else {
-            zipSource.add(new RawSource(clone(data)));
+            zipSource.add(new RawSource(Buffer.from(data)));
             // we've received our final bit of data, return the zipSource
             if (final) resolve(zipSource);
           }
@@ -171,9 +172,7 @@ export class ManifestPlugin<Z extends boolean> {
           if (excludeExtensions.includes(extName)) continue;
 
           addAssetToZip(
-            // make a copy of the asset Buffer as Zipping will *consume* it,
-            // which breaks things if we are compiling for multiple browsers.
-            clone(asset.buffer()),
+            asset.buffer(),
             assetName,
             ManifestPlugin.compressibleFileTypes.has(extName),
             compressionOptions,