metro 0.81.0 → 0.81.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "metro",
-  "version": "0.81.0",
+  "version": "0.81.1",
   "description": "🚇 The JavaScript bundler for React Native.",
   "main": "src/index.js",
   "bin": "src/cli.js",
@@ -25,33 +25,31 @@
     "ci-info": "^2.0.0",
     "connect": "^3.6.5",
     "debug": "^2.2.0",
-    "denodeify": "^1.2.1",
     "error-stack-parser": "^2.0.6",
     "flow-enums-runtime": "^0.0.6",
     "graceful-fs": "^4.2.4",
-    "hermes-parser": "0.24.0",
+    "hermes-parser": "0.25.1",
     "image-size": "^1.0.2",
     "invariant": "^2.2.4",
     "jest-worker": "^29.6.3",
     "jsc-safe-url": "^0.2.2",
     "lodash.throttle": "^4.1.1",
-    "metro-babel-transformer": "0.81.0",
-    "metro-cache": "0.81.0",
-    "metro-cache-key": "0.81.0",
-    "metro-config": "0.81.0",
-    "metro-core": "0.81.0",
-    "metro-file-map": "0.81.0",
-    "metro-resolver": "0.81.0",
-    "metro-runtime": "0.81.0",
-    "metro-source-map": "0.81.0",
-    "metro-symbolicate": "0.81.0",
-    "metro-transform-plugins": "0.81.0",
-    "metro-transform-worker": "0.81.0",
+    "metro-babel-transformer": "0.81.1",
+    "metro-cache": "0.81.1",
+    "metro-cache-key": "0.81.1",
+    "metro-config": "0.81.1",
+    "metro-core": "0.81.1",
+    "metro-file-map": "0.81.1",
+    "metro-resolver": "0.81.1",
+    "metro-runtime": "0.81.1",
+    "metro-source-map": "0.81.1",
+    "metro-symbolicate": "0.81.1",
+    "metro-transform-plugins": "0.81.1",
+    "metro-transform-worker": "0.81.1",
     "mime-types": "^2.1.27",
     "nullthrows": "^1.1.1",
     "serialize-error": "^2.1.0",
     "source-map": "^0.5.6",
-    "strip-ansi": "^6.0.0",
     "throat": "^5.0.0",
     "ws": "^7.5.10",
     "yargs": "^17.6.2"
@@ -65,8 +63,8 @@
     "dedent": "^0.7.0",
     "jest-snapshot": "^29.6.3",
     "jest-snapshot-serializer-raw": "^1.2.0",
-    "metro-babel-register": "0.81.0",
-    "metro-memory-fs": "0.81.0",
+    "metro-babel-register": "0.81.1",
+    "metro-memory-fs": "0.81.1",
     "mock-req": "^0.2.0",
     "mock-res": "^0.6.0",
     "stack-trace": "^0.0.10"

package/src/Assets.js

@@ -2,12 +2,9 @@
 
 const AssetPaths = require("./node-haste/lib/AssetPaths");
 const crypto = require("crypto");
-const denodeify = require("denodeify");
 const fs = require("fs");
 const getImageSize = require("image-size");
 const path = require("path");
-const readDir = denodeify(fs.readdir);
-const readFile = denodeify(fs.readFile);
 function isAssetTypeAnImage(type) {
   return (
     [
@@ -37,22 +34,6 @@ function getAssetSize(type, content, filePath) {
     height,
   };
 }
-const hashFiles = denodeify(function hashFilesCb(files, hash, callback) {
-  if (!files.length) {
-    callback(null);
-    return;
-  }
-  const file = files.shift();
-  fs.readFile(file, (err, data) => {
-    if (err) {
-      callback(err);
-      return;
-    } else {
-      hash.update(data);
-      hashFilesCb(files, hash, callback);
-    }
-  });
-});
 function buildAssetMap(dir, files, platform) {
   const platforms = new Set(platform != null ? [platform] : []);
   const assets = files.map((file) => AssetPaths.tryParse(file, platforms));
@@ -93,7 +74,7 @@ function getAssetKey(assetName, platform) {
 async function getAbsoluteAssetRecord(assetPath, platform = null) {
   const filename = path.basename(assetPath);
   const dir = path.dirname(assetPath);
-  const files = await readDir(dir);
+  const files = await fs.promises.readdir(dir);
   const assetData = AssetPaths.parse(
     filename,
     new Set(platform != null ? [platform] : [])
@@ -124,8 +105,11 @@ async function getAbsoluteAssetInfo(assetPath, platform = null) {
   const { name, type } = nameData;
   const { scales, files } = await getAbsoluteAssetRecord(assetPath, platform);
   const hasher = crypto.createHash("md5");
-  if (files.length > 0) {
-    await hashFiles(Array.from(files), hasher);
+  const fileData = await Promise.all(
+    files.map((file) => fs.promises.readFile(file))
+  );
+  for (const data of fileData) {
+    hasher.update(data);
   }
   return {
     files,
@@ -207,10 +191,10 @@ async function getAsset(
   const record = await getAbsoluteAssetRecord(absolutePath, platform);
   for (let i = 0; i < record.scales.length; i++) {
     if (record.scales[i] >= assetData.resolution) {
-      return readFile(record.files[i]);
+      return fs.promises.readFile(record.files[i]);
     }
   }
-  return readFile(record.files[record.files.length - 1]);
+  return fs.promises.readFile(record.files[record.files.length - 1]);
 }
 function pathBelongsToRoots(pathToCheck, roots) {
   for (const rootFolder of roots) {

package/src/Assets.js.flow

@@ -15,14 +15,10 @@ import type {AssetPath} from './node-haste/lib/AssetPaths';
 
 const AssetPaths = require('./node-haste/lib/AssetPaths');
 const crypto = require('crypto');
-const denodeify = require('denodeify');
 const fs = require('fs');
 const getImageSize = require('image-size');
 const path = require('path');
 
-const readDir = denodeify(fs.readdir);
-const readFile = denodeify(fs.readFile);
-
 export type AssetInfo = {
   +files: Array<string>,
   +hash: string,
@@ -95,25 +91,6 @@ export type AssetDataPlugin = (
   assetData: AssetData,
 ) => AssetData | Promise<AssetData>;
 
-const hashFiles = denodeify(function hashFilesCb(files, hash, callback): void {
-  if (!files.length) {
-    callback(null);
-    return;
-  }
-
-  const file = files.shift();
-
-  fs.readFile(file, (err, data: Buffer) => {
-    if (err) {
-      callback(err);
-      return;
-    } else {
-      hash.update(data);
-      hashFilesCb(files, hash, callback);
-    }
-  });
-});
-
 function buildAssetMap(
   dir: string,
   files: $ReadOnlyArray<string>,
@@ -168,7 +145,7 @@ async function getAbsoluteAssetRecord(
 ): Promise<{files: Array<string>, scales: Array<number>}> {
   const filename = path.basename(assetPath);
   const dir = path.dirname(assetPath);
-  const files = await readDir(dir);
+  const files = await fs.promises.readdir(dir);
 
   const assetData = AssetPaths.parse(
     filename,
@@ -210,8 +187,12 @@ async function getAbsoluteAssetInfo(
   const {scales, files} = await getAbsoluteAssetRecord(assetPath, platform);
   const hasher = crypto.createHash('md5');
 
-  if (files.length > 0) {
-    await hashFiles(Array.from(files), hasher);
+  const fileData = await Promise.all(
+    files.map(file => fs.promises.readFile(file)),
+  );
+
+  for (const data of fileData) {
+    hasher.update(data);
   }
 
   return {files, hash: hasher.digest('hex'), name, scales, type};
@@ -328,11 +309,11 @@ async function getAsset(
 
   for (let i = 0; i < record.scales.length; i++) {
     if (record.scales[i] >= assetData.resolution) {
-      return readFile(record.files[i]);
+      return fs.promises.readFile(record.files[i]);
     }
   }
 
-  return readFile(record.files[record.files.length - 1]);
+  return fs.promises.readFile(record.files[record.files.length - 1]);
 }
 
 function pathBelongsToRoots(

package/src/DeltaBundler/DeltaCalculator.js.flow

@@ -13,7 +13,7 @@
 
 import type {DeltaResult, Options} from './types.flow';
 import type {RootPerfLogger} from 'metro-config';
-import type {ChangeEventMetadata} from 'metro-file-map';
+import type {ChangeEvent} from 'metro-file-map';
 
 import {Graph} from './Graph';
 import path from 'path';
@@ -173,9 +173,7 @@ class DeltaCalculator<T> extends EventEmitter {
     return this._graph;
   }
 
-  /* $FlowFixMe[missing-local-annot] The type annotation(s) required by Flow's
-   * LTI update could not be added via codemod */
-  _handleMultipleFileChanges = changeEvent => {
+  _handleMultipleFileChanges = (changeEvent: ChangeEvent) => {
     changeEvent.eventsQueue.forEach(eventInfo => {
       this._handleFileChange(eventInfo, changeEvent.logger);
     });
@@ -187,16 +185,7 @@ class DeltaCalculator<T> extends EventEmitter {
    * when the delta needs to be calculated.
    */
   _handleFileChange = (
-    {
-      type,
-      filePath,
-      metadata,
-    }: {
-      type: string,
-      filePath: string,
-      metadata: ChangeEventMetadata,
-      ...
-    },
+    {type, filePath, metadata}: ChangeEvent['eventsQueue'][number],
     logger: ?RootPerfLogger,
   ): mixed => {
     debug('Handling %s: %s (type: %s)', type, filePath, metadata.type);

package/src/DeltaBundler/Serializers/hmrJSBundle.js

@@ -10,7 +10,9 @@ function generateModules(sourceModules, graph, options) {
   for (const module of sourceModules) {
     if (isJsModule(module)) {
       const getURL = (extension) => {
-        options.clientUrl.pathname = path.relative(
+        const moduleUrl = url.parse(url.format(options.clientUrl), true);
+        moduleUrl.search = "";
+        moduleUrl.pathname = path.relative(
           options.serverRoot ?? options.projectRoot,
           path.join(
             path.dirname(module.path),
@@ -19,7 +21,8 @@ function generateModules(sourceModules, graph, options) {
               extension
           )
         );
-        return url.format(options.clientUrl);
+        delete moduleUrl.query.excludeSource;
+        return url.format(moduleUrl);
       };
       const sourceMappingURL = getURL("map");
       const sourceURL = jscSafeUrl.toJscSafeUrl(getURL("bundle"));

package/src/DeltaBundler/Serializers/hmrJSBundle.js.flow

@@ -41,7 +41,12 @@ function generateModules(
     if (isJsModule(module)) {
       // Construct a bundle URL for this specific module only
       const getURL = (extension: 'bundle' | 'map') => {
-        options.clientUrl.pathname = path.relative(
+        const moduleUrl = url.parse(url.format(options.clientUrl), true);
+        // the legacy url object is parsed with both "search" and "query" fields.
+        // for the "query" field to be used when formatting the object bach to string, the "search" field must be empty.
+        // https://nodejs.org/api/url.html#urlformaturlobject:~:text=If%20the%20urlObject.search%20property%20is%20undefined
+        moduleUrl.search = '';
+        moduleUrl.pathname = path.relative(
           options.serverRoot ?? options.projectRoot,
           path.join(
             path.dirname(module.path),
@@ -50,7 +55,8 @@ function generateModules(
               extension,
           ),
         );
-        return url.format(options.clientUrl);
+        delete moduleUrl.query.excludeSource;
+        return url.format(moduleUrl);
       };
 
       const sourceMappingURL = getURL('map');

package/src/HmrServer.js.flow

@@ -169,6 +169,9 @@ class HmrServer<TClient: Client> {
         runModule: runModule || 'false',
         shallow: 'true',
       };
+      // the legacy url object is parsed with both "search" and "query" fields.
+      // for the "query" field to be used when formatting the object bach to string, the "search" field must be empty.
+      // https://nodejs.org/api/url.html#urlformaturlobject:~:text=If%20the%20urlObject.search%20property%20is%20undefined
       clientUrl.search = '';
 
       clientGroup = {

package/src/index.flow.js

@@ -264,7 +264,12 @@ exports.runBuild = async (
         dev,
         platform,
       };
-      await output.save(metroBundle, outputOptions, console.log);
+      await output.save(metroBundle, outputOptions, (message) =>
+        config.reporter.update({
+          type: "bundle_save_log",
+          message,
+        })
+      );
     }
     return metroBundle;
   } finally {

package/src/index.flow.js.flow

@@ -98,7 +98,7 @@ export type RunBuildOptions = {
   onComplete?: () => void,
   onProgress?: (transformedFileCount: number, totalFileCount: number) => void,
   minify?: boolean,
-  output?: {
+  output?: $ReadOnly<{
     build: (
       MetroServer,
       RequestOptions,
@@ -114,10 +114,10 @@ export type RunBuildOptions = {
         ...
       },
       OutputOptions,
-      (...args: Array<string>) => void,
+      (logMessage: string) => void,
     ) => Promise<mixed>,
     ...
-  },
+  }>,
   platform?: string,
   sourceMap?: boolean,
   sourceMapUrl?: string,
@@ -428,8 +428,12 @@ exports.runBuild = async (
         platform,
       };
 
-      // eslint-disable-next-line no-console
-      await output.save(metroBundle, outputOptions, console.log);
+      await output.save(metroBundle, outputOptions, message =>
+        config.reporter.update({
+          type: 'bundle_save_log',
+          message,
+        }),
+      );
     }
 
     return metroBundle;

package/src/integration_tests/metro.config.js

@@ -11,7 +11,7 @@ module.exports = {
   },
   watchFolders: [path.resolve(__dirname, "../../../")],
   server: {
-    port: 10028,
+    port: 0,
   },
   resolver: {
     blockList: [/excluded_from_file_map\.js$/],

package/src/lib/TerminalReporter.js

@@ -136,6 +136,9 @@ class TerminalReporter {
       case "bundle_build_done":
         this._logBundleBuildDone(event.buildID);
         break;
+      case "bundle_save_log":
+        this.terminal.log("LOG:" + event.message);
+        break;
       case "bundle_build_failed":
         this._logBundleBuildFailed(event.buildID);
         break;

package/src/lib/TerminalReporter.js.flow

@@ -237,6 +237,9 @@ class TerminalReporter {
       case 'bundle_build_done':
         this._logBundleBuildDone(event.buildID);
         break;
+      case 'bundle_save_log':
+        this.terminal.log('LOG:' + event.message);
+        break;
       case 'bundle_build_failed':
         this._logBundleBuildFailed(event.buildID);
         break;

package/src/lib/getMaxWorkers.js

@@ -2,7 +2,7 @@
 
 const os = require("os");
 module.exports = (workers) => {
-  const cores = os.cpus().length;
+  const cores = os.availableParallelism();
   return typeof workers === "number" && Number.isInteger(workers)
     ? Math.min(cores, workers > 0 ? workers : 1)
     : Math.max(1, Math.ceil(cores * (0.5 + 0.5 * Math.exp(-cores * 0.07)) - 1));

package/src/lib/getMaxWorkers.js.flow

@@ -14,7 +14,8 @@
 const os = require('os');
 
 module.exports = (workers: ?number): number => {
-  const cores = os.cpus().length;
+  // $FlowFixMe[prop-missing] Missing Flow lib def for availableParallelism
+  const cores = os.availableParallelism();
   return typeof workers === 'number' && Number.isInteger(workers)
     ? Math.min(cores, workers > 0 ? workers : 1)
     : Math.max(1, Math.ceil(cores * (0.5 + 0.5 * Math.exp(-cores * 0.07)) - 1));

package/src/lib/reporting.js

@@ -1,7 +1,6 @@
 "use strict";
 
 const chalk = require("chalk");
-const stripAnsi = require("strip-ansi");
 const util = require("util");
 function logWarning(terminal, format, ...args) {
   const str = util.format(format, ...args);
@@ -11,7 +10,10 @@ function logError(terminal, format, ...args) {
   terminal.log(
     "%s %s",
     chalk.red.inverse.bold(" ERROR "),
-    util.format(chalk.supportsColor ? format : stripAnsi(format), ...args)
+    util.format(
+      chalk.supportsColor ? format : util.stripVTControlCharacters(format),
+      ...args
+    )
   );
 }
 function logInfo(terminal, format, ...args) {

package/src/lib/reporting.js.flow

@@ -17,7 +17,6 @@ import type {CustomResolverOptions} from 'metro-resolver';
 import type {CustomTransformOptions} from 'metro-transform-worker';
 
 const chalk = require('chalk');
-const stripAnsi = require('strip-ansi');
 const util = require('util');
 
 export type BundleDetails = {
@@ -62,6 +61,11 @@ export type ReportableEvent =
       type: 'bundle_build_failed',
       ...
     }
+  | {
+      type: 'bundle_save_log',
+      message: string,
+      ...
+    }
   | {
       buildID: string,
       bundleDetails: BundleDetails,
@@ -207,7 +211,10 @@ function logError(
     // in various places outside of where Metro is currently running.
     // If the current terminal does not support color, we'll strip the colors
     // here.
-    util.format(chalk.supportsColor ? format : stripAnsi(format), ...args),
+    util.format(
+      chalk.supportsColor ? format : util.stripVTControlCharacters(format),
+      ...args,
+    ),
   );
 }
 

package/src/lib/transformHelpers.js

@@ -12,6 +12,7 @@ const baseIgnoredInlineRequires = [
   "react",
   "react/jsx-dev-runtime",
   "react/jsx-runtime",
+  "react-compiler-runtime",
   "react-native",
 ];
 async function calcTransformerOptions(
@@ -78,6 +79,10 @@ async function calcTransformerOptions(
   );
   return {
     ...baseOptions,
+    inlinePlatform:
+      transform?.unstable_inlinePlatform != null
+        ? transform.unstable_inlinePlatform
+        : true,
     inlineRequires: transform?.inlineRequires || false,
     experimentalImportSupport: transform?.experimentalImportSupport || false,
     unstable_disableES6Transforms:

package/src/lib/transformHelpers.js.flow

@@ -41,6 +41,7 @@ const baseIgnoredInlineRequires = [
   'react',
   'react/jsx-dev-runtime',
   'react/jsx-runtime',
+  'react-compiler-runtime',
   'react-native',
 ];
 
@@ -112,6 +113,10 @@ async function calcTransformerOptions(
 
   return {
     ...baseOptions,
+    inlinePlatform:
+      transform?.unstable_inlinePlatform != null
+        ? transform.unstable_inlinePlatform
+        : true,
     inlineRequires: transform?.inlineRequires || false,
     experimentalImportSupport: transform?.experimentalImportSupport || false,
     unstable_disableES6Transforms:

package/src/node-haste/DependencyGraph.js

@@ -37,6 +37,7 @@ class DependencyGraph extends EventEmitter {
       hasReducedPerformance: !!hasReducedPerformance,
     });
     const fileMap = createFileMap(config, {
+      throwOnModuleCollision: false,
       watch,
     });
     fileMap.setMaxListeners(1000);

package/src/node-haste/DependencyGraph.js.flow

@@ -101,7 +101,10 @@ class DependencyGraph extends EventEmitter {
       type: 'dep_graph_loading',
       hasReducedPerformance: !!hasReducedPerformance,
     });
-    const fileMap = createFileMap(config, {watch});
+    const fileMap = createFileMap(config, {
+      throwOnModuleCollision: false,
+      watch,
+    });
 
     // We can have a lot of graphs listening to Haste for changes.
     // Bump this up to silence the max listeners EventEmitter warning.

package/src/shared/output/RamBundle/write-sourcemap.js

@@ -6,7 +6,7 @@ function writeSourcemap(fileName, contents, log) {
     return Promise.resolve();
   }
   log("Writing sourcemap output to:", fileName);
-  const writeMap = writeFile(fileName, contents, null);
+  const writeMap = writeFile(fileName, contents);
   writeMap.then(() => log("Done writing sourcemap output"));
   return writeMap;
 }

package/src/shared/output/RamBundle/write-sourcemap.js.flow

@@ -22,7 +22,7 @@ function writeSourcemap(
     return Promise.resolve();
   }
   log('Writing sourcemap output to:', fileName);
-  const writeMap = writeFile(fileName, contents, null);
+  const writeMap = writeFile(fileName, contents);
   // $FlowFixMe[unused-promise]
   writeMap.then(() => log('Done writing sourcemap output'));
   return writeMap;

package/src/shared/output/bundle.flow.js

@@ -37,7 +37,7 @@ async function saveBundleAndMap(bundle, options, log) {
     }
     writeFns.push(async () => {
       log(`Writing sourcemap output to: ${sourcemapOutput}`);
-      await writeFile(sourcemapOutput, map, null);
+      await writeFile(sourcemapOutput, map);
       log("Done writing sourcemap output");
     });
   }

package/src/shared/output/bundle.flow.js.flow

@@ -49,7 +49,7 @@ async function saveBundleAndMap(
     ...
   },
   options: OutputOptions,
-  log: (...args: Array<string>) => void,
+  log: string => void,
 ): Promise<mixed> {
   const {
     bundleOutput,
@@ -76,7 +76,7 @@ async function saveBundleAndMap(
 
     writeFns.push(async () => {
       log(`Writing sourcemap output to: ${sourcemapOutput}`);
-      await writeFile(sourcemapOutput, map, null);
+      await writeFile(sourcemapOutput, map);
       log('Done writing sourcemap output');
     });
   }

package/src/shared/output/writeFile.js

@@ -1,7 +1,6 @@
 "use strict";
 
-const denodeify = require("denodeify");
 const fs = require("fs");
 const throat = require("throat");
-const writeFile = throat(128, denodeify(fs.writeFile));
+const writeFile = throat(128, fs.promises.writeFile);
 module.exports = writeFile;

package/src/shared/output/writeFile.js.flow

@@ -4,22 +4,19 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict-local
  * @format
  * @oncall react_native
  */
 
 'use strict';
 
-const denodeify = require('denodeify');
 const fs = require('fs');
 const throat = require('throat');
 
-type WriteFn = (
-  file: string,
-  data: string | Buffer,
-  encoding?: ?string,
-) => Promise<mixed>;
-const writeFile: WriteFn = throat(128, denodeify(fs.writeFile));
+const writeFile: typeof fs.promises.writeFile = throat(
+  128,
+  fs.promises.writeFile,
+);
 
 module.exports = writeFile;