metro 0.83.3 → 0.83.5

package/src/lib/CountingSet.d.ts

@@ -10,7 +10,6 @@
 
 export interface ReadOnlyCountingSet<T> extends Iterable<T> {
   has(item: T): boolean;
-  [Symbol.iterator](): Iterator<T>;
   readonly size: number;
   count(item: T): number;
   forEach<ThisT>(
@@ -23,26 +22,27 @@ export interface ReadOnlyCountingSet<T> extends Iterable<T> {
     thisArg: ThisT,
   ): void;
 }
-
-export default class CountingSet<T> implements ReadOnlyCountingSet<T> {
+/**
+ * A Set that only deletes a given item when the number of delete(item) calls
+ * matches the number of add(item) calls. Iteration and `size` are in terms of
+ * *unique* items.
+ */
+declare class CountingSet<T> implements ReadOnlyCountingSet<T> {
   constructor(items?: Iterable<T>);
-  get size(): number;
   has(item: T): boolean;
   add(item: T): void;
   delete(item: T): void;
   keys(): Iterator<T>;
   values(): Iterator<T>;
+  entries(): Iterator<[T, T]>;
   [Symbol.iterator](): Iterator<T>;
+  get size(): number;
   count(item: T): number;
   clear(): void;
   forEach<ThisT>(
-    callbackFn: (
-      this: ThisT,
-      value: T,
-      key: T,
-      set: ReadOnlyCountingSet<T>,
-    ) => unknown,
+    callbackFn: (this: ThisT, value: T, key: T, set: CountingSet<T>) => unknown,
     thisArg: ThisT,
   ): void;
   toJSON(): unknown;
 }
+export default CountingSet;

package/src/lib/CountingSet.js.flow

@@ -11,7 +11,6 @@
 
 export interface ReadOnlyCountingSet<T> extends Iterable<T> {
   has(item: T): boolean;
-  @@iterator(): Iterator<T>;
   +size: number;
   count(item: T): number;
   forEach<ThisT>(
@@ -20,7 +19,7 @@ export interface ReadOnlyCountingSet<T> extends Iterable<T> {
       value: T,
       key: T,
       set: ReadOnlyCountingSet<T>,
-    ) => mixed,
+    ) => unknown,
 
     // NOTE: Should be optional, but Flow seems happy to infer undefined here
     // which is what we want.
@@ -88,6 +87,7 @@ export default class CountingSet<T> implements ReadOnlyCountingSet<T> {
 
   /*::
   // For Flow's benefit
+  // $FlowFixMe[duplicate-class-member]
   @@iterator(): Iterator<T> {
     return this.values();
   }
@@ -108,7 +108,7 @@ export default class CountingSet<T> implements ReadOnlyCountingSet<T> {
   }
 
   forEach<ThisT>(
-    callbackFn: (this: ThisT, value: T, key: T, set: CountingSet<T>) => mixed,
+    callbackFn: (this: ThisT, value: T, key: T, set: CountingSet<T>) => unknown,
     thisArg: ThisT,
   ): void {
     for (const item of this) {
@@ -121,7 +121,7 @@ export default class CountingSet<T> implements ReadOnlyCountingSet<T> {
   // extend to custom collection classes. Instead let's assume values are
   // sortable ( = strings) and make this look like an array with some stable
   // order.
-  toJSON(): mixed {
+  toJSON(): unknown {
     return [...this].sort();
   }
 }

package/src/lib/JsonReporter.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @oncall react_native
+ */
+
+import type {Writable} from 'stream';
+
+export type SerializedError = {
+  message: string;
+  stack: string;
+  errors?: ReadonlyArray<SerializedError>;
+  cause?: SerializedError;
+};
+export type SerializedEvent<
+  TEvent extends {readonly [$$Key$$: string]: unknown},
+> = TEvent extends {error: Error}
+  ? Omit<Omit<TEvent, 'error'>, keyof {error: SerializedError}> & {
+      error: SerializedError;
+    }
+  : TEvent;
+declare class JsonReporter<
+  TEvent extends {readonly [$$Key$$: string]: unknown},
+> {
+  _stream: Writable;
+  constructor(stream: Writable);
+  /**
+   * There is a special case for errors because they have non-enumerable fields.
+   * (Perhaps we should switch in favor of plain object?)
+   */
+  update(event: TEvent): void;
+}
+export default JsonReporter;

package/src/lib/JsonReporter.js

@@ -9,15 +9,17 @@ class JsonReporter {
     this._stream = stream;
   }
   update(event) {
+    let eventToWrite = event;
     if (event.error instanceof Error) {
       const { message, stack } = event.error;
-      event = Object.assign(event, {
+      eventToWrite = {
+        ...eventToWrite,
         error: serializeError(event.error),
         message,
         stack,
-      });
+      };
     }
-    this._stream.write(JSON.stringify(event) + "\n");
+    this._stream.write(JSON.stringify(eventToWrite) + "\n");
   }
 }
 exports.default = JsonReporter;

package/src/lib/JsonReporter.js.flow

@@ -4,7 +4,7 @@
  * 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
  */
@@ -14,23 +14,24 @@ import type {Writable} from 'stream';
 export type SerializedError = {
   message: string,
   stack: string,
-  errors?: $ReadOnlyArray<SerializedError>,
+  errors?: ReadonlyArray<SerializedError>,
   cause?: SerializedError,
   ...
 };
 
-export type SerializedEvent<TEvent: {[string]: any, ...}> = TEvent extends {
-  error: Error,
-  ...
-}
-  ? {
-      ...Omit<TEvent, 'error'>,
-      error: SerializedError,
-      ...
-    }
-  : TEvent;
+export type SerializedEvent<TEvent: {+[string]: unknown, ...}> =
+  TEvent extends {
+    error: Error,
+    ...
+  }
+    ? {
+        ...Omit<TEvent, 'error'>,
+        error: SerializedError,
+        ...
+      }
+    : TEvent;
 
-export default class JsonReporter<TEvent: {[string]: any, ...}> {
+export default class JsonReporter<TEvent: {+[string]: unknown, ...}> {
   _stream: Writable;
 
   constructor(stream: Writable) {
@@ -42,19 +43,20 @@ export default class JsonReporter<TEvent: {[string]: any, ...}> {
    * (Perhaps we should switch in favor of plain object?)
    */
   update(event: TEvent): void {
+    let eventToWrite = event;
     if (event.error instanceof Error) {
       const {message, stack} = event.error;
-      // $FlowFixMe[unsafe-object-assign]
-      event = Object.assign(event, {
+      eventToWrite = {
+        ...eventToWrite,
         error: serializeError(event.error),
         // TODO: Preexisting issue - this writes message, stack, etc. as
         // top-level siblings of event.error (which was serialized to {}), whereas it was presumably
         // intended to nest them _under_ error. Fix this in a breaking change.
         message,
         stack,
-      });
+      };
     }
-    this._stream.write(JSON.stringify(event) + '\n');
+    this._stream.write(JSON.stringify(eventToWrite) + '\n');
   }
 }
 

package/src/lib/RamBundleParser.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+/**
+ * Implementation of a RAM bundle parser in JS.
+ *
+ * It receives a Buffer as an input and implements two main methods, which are
+ * able to run in constant time no matter the size of the bundle:
+ *
+ * getStartupCode(): returns the runtime and the startup code of the bundle.
+ * getModule(): returns the code for the specified module.
+ */
+declare class RamBundleParser {
+  _buffer: Buffer;
+  _numModules: number;
+  _startupCodeLength: number;
+  _startOffset: number;
+  constructor(buffer: Buffer);
+  _readPosition(pos: number): number;
+  getStartupCode(): string;
+  getModule(id: number): string;
+}
+export default RamBundleParser;

package/src/lib/RamBundleParser.js.flow

@@ -4,8 +4,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @format
  * @flow strict
+ * @format
  */
 
 import MAGIC_NUMBER from '../shared/output/RamBundle/magic-number';

package/src/lib/TerminalReporter.d.ts

@@ -8,9 +8,17 @@
  * @oncall react_native
  */
 
-import {ReportableEvent} from './reporting';
-import {Terminal} from 'metro-core';
+import type {BundleDetails, ReportableEvent} from './reporting';
+import type {Terminal} from 'metro-core';
+import type {HealthCheckResult, WatcherStatus} from 'metro-file-map';
 
+type BundleProgress = {
+  bundleDetails: BundleDetails;
+  transformedFileCount: number;
+  totalFileCount: number;
+  ratio: number;
+  isPrefetch?: boolean;
+};
 export type TerminalReportableEvent =
   | ReportableEvent
   | {
@@ -18,10 +26,93 @@ export type TerminalReportableEvent =
       type: 'bundle_transform_progressed_throttled';
       transformedFileCount: number;
       totalFileCount: number;
-    };
-
-export class TerminalReporter {
-  constructor(terminal: Terminal);
+    }
+  | {
+      type: 'unstable_server_log';
+      level: 'info' | 'warn' | 'error';
+      data: string | Array<unknown>;
+    }
+  | {type: 'unstable_server_menu_updated'; message: string}
+  | {type: 'unstable_server_menu_cleared'};
+type BuildPhase = 'in_progress' | 'done' | 'failed';
+interface SnippetError extends Error {
+  code?: string;
+  filename?: string;
+  snippet?: string;
+}
+/**
+ * We try to print useful information to the terminal for interactive builds.
+ * This implements the `Reporter` interface from the './reporting' module.
+ */
+declare class TerminalReporter {
+  /**
+   * The bundle builds for which we are actively maintaining the status on the
+   * terminal, ie. showing a progress bar. There can be several bundles being
+   * built at the same time.
+   */
+  _activeBundles: Map<string, BundleProgress>;
+  _interactionStatus: null | undefined | string;
+  _scheduleUpdateBundleProgress: {
+    (data: {
+      buildID: string;
+      transformedFileCount: number;
+      totalFileCount: number;
+    }): void;
+    cancel(): void;
+  };
+  _prevHealthCheckResult: null | undefined | HealthCheckResult;
   readonly terminal: Terminal;
+  constructor(terminal: Terminal);
+  /**
+   * Construct a message that represents the progress of a
+   * single bundle build, for example:
+   *
+   *     BUNDLE path/to/bundle.js ▓▓▓▓▓░░░░░░░░░░░ 36.6% (4790/7922)
+   */
+  _getBundleStatusMessage(
+    $$PARAM_0$$: BundleProgress,
+    phase: BuildPhase,
+  ): string;
+  _logBundleBuildDone(buildID: string): void;
+  _logBundleBuildFailed(buildID: string): void;
+  _logInitializing(port: number, hasReducedPerformance: boolean): void;
+  _logInitializingFailed(port: number, error: SnippetError): void;
+  /**
+   * This function is only concerned with logging and should not do state
+   * or terminal status updates.
+   */
+  _log(event: TerminalReportableEvent): void;
+  /**
+   * We do not want to log the whole stacktrace for bundling error, because
+   * these are operational errors, not programming errors, and the stacktrace
+   * is not actionable to end users.
+   */
+  _logBundlingError(error: SnippetError): void;
+  _logWorkerChunk(origin: 'stdout' | 'stderr', chunk: string): void;
+  _updateBundleProgress($$PARAM_0$$: {
+    buildID: string;
+    transformedFileCount: number;
+    totalFileCount: number;
+  }): void;
+  /**
+   * This function is exclusively concerned with updating the internal state.
+   * No logging or status updates should be done at this point.
+   */
+  _updateState(event: TerminalReportableEvent): void;
+  /**
+   * Return a status message that is always consistent with the current state
+   * of the application. Having this single function ensures we don't have
+   * different callsites overriding each other status messages.
+   */
+  _getStatusMessage(): string;
+  _logHmrClientError(e: Error): void;
+  _logWarning(message: string): void;
+  _logWatcherHealthCheckResult(result: HealthCheckResult): void;
+  _logWatcherStatus(status: WatcherStatus): void;
+  /**
+   * Single entry point for reporting events. That allows us to implement the
+   * corresponding JSON reporter easily and have a consistent reporting.
+   */
   update(event: TerminalReportableEvent): void;
 }
+export default TerminalReporter;

package/src/lib/TerminalReporter.js

@@ -4,34 +4,39 @@ Object.defineProperty(exports, "__esModule", {
   value: true,
 });
 exports.default = void 0;
+var _bundleProgressUtils = require("./bundleProgressUtils");
 var _logToConsole = _interopRequireDefault(require("./logToConsole"));
 var reporting = _interopRequireWildcard(require("./reporting"));
 var _chalk = _interopRequireDefault(require("chalk"));
 var _lodash = _interopRequireDefault(require("lodash.throttle"));
 var _metroCore = require("metro-core");
 var _path = _interopRequireDefault(require("path"));
-function _getRequireWildcardCache(e) {
-  if ("function" != typeof WeakMap) return null;
-  var r = new WeakMap(),
-    t = new WeakMap();
-  return (_getRequireWildcardCache = function (e) {
-    return e ? t : r;
-  })(e);
-}
-function _interopRequireWildcard(e, r) {
-  if (!r && e && e.__esModule) return e;
-  if (null === e || ("object" != typeof e && "function" != typeof e))
-    return { default: e };
-  var t = _getRequireWildcardCache(r);
-  if (t && t.has(e)) return t.get(e);
-  var n = { __proto__: null },
-    a = Object.defineProperty && Object.getOwnPropertyDescriptor;
-  for (var u in e)
-    if ("default" !== u && {}.hasOwnProperty.call(e, u)) {
-      var i = a ? Object.getOwnPropertyDescriptor(e, u) : null;
-      i && (i.get || i.set) ? Object.defineProperty(n, u, i) : (n[u] = e[u]);
+function _interopRequireWildcard(e, t) {
+  if ("function" == typeof WeakMap)
+    var r = new WeakMap(),
+      n = new WeakMap();
+  return (_interopRequireWildcard = function (e, t) {
+    if (!t && e && e.__esModule) return e;
+    var o,
+      i,
+      f = { __proto__: null, default: e };
+    if (null === e || ("object" != typeof e && "function" != typeof e))
+      return f;
+    if ((o = t ? n : r)) {
+      if (o.has(e)) return o.get(e);
+      o.set(e, f);
     }
-  return ((n.default = e), t && t.set(e, n), n);
+    for (const t in e)
+      "default" !== t &&
+        {}.hasOwnProperty.call(e, t) &&
+        ((i =
+          (o = Object.defineProperty) &&
+          Object.getOwnPropertyDescriptor(e, t)) &&
+        (i.get || i.set)
+          ? o(f, t, i)
+          : (f[t] = e[t]));
+    return f;
+  })(e, t);
 }
 function _interopRequireDefault(e) {
   return e && e.__esModule ? e : { default: e };
@@ -60,9 +65,6 @@ class TerminalReporter {
     },
     phase,
   ) {
-    if (isPrefetch) {
-      bundleType = "PREBUNDLE";
-    }
     const localPath = _path.default.relative(".", entryFile);
     const filledBar = Math.floor(ratio * MAX_PROGRESS_BAR_CHAR_WIDTH);
     const bundleTypeColor =
@@ -77,11 +79,13 @@ class TerminalReporter {
           _chalk.default.bgWhite.white(
             LIGHT_BLOCK_CHAR.repeat(MAX_PROGRESS_BAR_CHAR_WIDTH - filledBar),
           ) +
-          _chalk.default.bold(` ${(100 * ratio).toFixed(1)}% `) +
+          _chalk.default.bold(` ${Math.floor(100 * ratio)}% `) +
           _chalk.default.dim(`(${transformedFileCount}/${totalFileCount})`)
         : "";
     return (
-      bundleTypeColor.inverse.bold(` ${bundleType.toUpperCase()} `) +
+      bundleTypeColor.inverse.bold(
+        ` ${isPrefetch === true ? "PREBUNDLE" : bundleType.toUpperCase()} `,
+      ) +
       _chalk.default.reset.dim(` ${_path.default.dirname(localPath)}/`) +
       _chalk.default.bold(_path.default.basename(localPath)) +
       " " +
@@ -261,8 +265,9 @@ class TerminalReporter {
         message = error.stack;
       }
     }
-    if (error.filename && !message.includes(error.filename)) {
-      message += ` [${error.filename}]`;
+    const filename = error.filename;
+    if (filename?.length && !message.includes(filename)) {
+      message += ` [${filename}]`;
     }
     if (error.snippet != null) {
       message += "\n" + error.snippet;
@@ -283,12 +288,10 @@ class TerminalReporter {
     if (currentProgress == null) {
       return;
     }
-    const ratio = Math.min(
-      Math.max(
-        Math.pow(transformedFileCount / Math.max(totalFileCount, 10), 2),
-        currentProgress.ratio,
-      ),
-      0.999,
+    const ratio = (0, _bundleProgressUtils.calculateBundleProgressRatio)(
+      transformedFileCount,
+      totalFileCount,
+      currentProgress.ratio,
     );
     Object.assign(currentProgress, {
       ratio,

package/src/lib/TerminalReporter.js.flow

@@ -4,7 +4,7 @@
  * 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
  */
@@ -13,9 +13,11 @@ import type {BundleDetails, ReportableEvent} from './reporting';
 import type {Terminal} from 'metro-core';
 import type {HealthCheckResult, WatcherStatus} from 'metro-file-map';
 
+import {calculateBundleProgressRatio} from './bundleProgressUtils';
 import logToConsole from './logToConsole';
 import * as reporting from './reporting';
 import chalk from 'chalk';
+// $FlowFixMe[untyped-import] lodash.throttle
 import throttle from 'lodash.throttle';
 import {AmbiguousModuleResolutionError} from 'metro-core';
 import path from 'path';
@@ -41,7 +43,7 @@ export type TerminalReportableEvent =
   | {
       type: 'unstable_server_log',
       level: 'info' | 'warn' | 'error',
-      data: string | Array<mixed>,
+      data: string | Array<unknown>,
       ...
     }
   | {
@@ -56,11 +58,11 @@ export type TerminalReportableEvent =
 
 type BuildPhase = 'in_progress' | 'done' | 'failed';
 
-type SnippetError = ErrnoError &
-  interface {
-    filename?: string,
-    snippet?: string,
-  };
+interface SnippetError extends Error {
+  code?: string;
+  filename?: string;
+  snippet?: string;
+}
 
 const DARK_BLOCK_CHAR = '\u2593';
 const LIGHT_BLOCK_CHAR = '\u2591';
@@ -117,10 +119,6 @@ export default class TerminalReporter {
     }: BundleProgress,
     phase: BuildPhase,
   ): string {
-    if (isPrefetch) {
-      bundleType = 'PREBUNDLE';
-    }
-
     const localPath = path.relative('.', entryFile);
     const filledBar = Math.floor(ratio * MAX_PROGRESS_BAR_CHAR_WIDTH);
     const bundleTypeColor =
@@ -135,12 +133,14 @@ export default class TerminalReporter {
           chalk.bgWhite.white(
             LIGHT_BLOCK_CHAR.repeat(MAX_PROGRESS_BAR_CHAR_WIDTH - filledBar),
           ) +
-          chalk.bold(` ${(100 * ratio).toFixed(1)}% `) +
+          chalk.bold(` ${Math.floor(100 * ratio)}% `) +
           chalk.dim(`(${transformedFileCount}/${totalFileCount})`)
         : '';
 
     return (
-      bundleTypeColor.inverse.bold(` ${bundleType.toUpperCase()} `) +
+      bundleTypeColor.inverse.bold(
+        ` ${isPrefetch === true ? 'PREBUNDLE' : bundleType.toUpperCase()} `,
+      ) +
       chalk.reset.dim(` ${path.dirname(localPath)}/`) +
       chalk.bold(path.basename(localPath)) +
       ' ' +
@@ -273,6 +273,7 @@ export default class TerminalReporter {
       case 'dep_graph_loading':
         const color = event.hasReducedPerformance ? chalk.red : chalk.blue;
         // eslint-disable-next-line import/no-commonjs
+        // $FlowFixMe[untyped-import] package.json
         const version = 'v' + require('../../package.json').version;
         this.terminal.log(
           color.bold(
@@ -331,9 +332,9 @@ export default class TerminalReporter {
       }
     }
 
-    if (error.filename && !message.includes(error.filename)) {
-      // $FlowFixMe[incompatible-type]
-      message += ` [${error.filename}]`;
+    const filename = error.filename;
+    if (filename?.length && !message.includes(filename)) {
+      message += ` [${filename}]`;
     }
 
     if (error.snippet != null) {
@@ -352,14 +353,6 @@ export default class TerminalReporter {
     });
   }
 
-  /**
-   * Because we know the `totalFileCount` is going to progressively increase
-   * starting with 1:
-   * - We use Math.max(totalFileCount, 10) to prevent the ratio to raise too
-   *   quickly when the total file count is low. (e.g 1/2 5/6)
-   * - We prevent the ratio from going backwards.
-   * - Instead, we use Math.pow(ratio, 2) to as a conservative measure of progress.
-   */
   _updateBundleProgress({
     buildID,
     transformedFileCount,
@@ -375,12 +368,10 @@ export default class TerminalReporter {
       return;
     }
 
-    const ratio = Math.min(
-      Math.max(
-        Math.pow(transformedFileCount / Math.max(totalFileCount, 10), 2),
-        currentProgress.ratio,
-      ),
-      0.999, // make sure not to go above 99.9% to not get rounded to 100%,
+    const ratio = calculateBundleProgressRatio(
+      transformedFileCount,
+      totalFileCount,
+      currentProgress.ratio,
     );
 
     // $FlowFixMe[unsafe-object-assign]

package/src/lib/bundleProgressUtils.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @oncall react_native
+ */
+
+/**
+ * Calculates a conservative progress ratio for bundle building.
+ *
+ * Because we know the `totalFileCount` is going to progressively increase
+ * starting with 1:
+ * - We use Math.max(totalFileCount, 10) to prevent the ratio from raising too
+ *   quickly when the total file count is low. (e.g 1/2 5/6)
+ * - We use Math.pow(ratio, 2) as a conservative measure of progress.
+ * - The ratio is capped at 0.999 to ensure we don't display 100% until done.
+ * - If previousRatio is provided, the ratio will not go backwards.
+ */
+export declare function calculateBundleProgressRatio(
+  transformedFileCount: number,
+  totalFileCount: number,
+  previousRatio?: number,
+): number;

package/src/lib/bundleProgressUtils.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true,
+});
+exports.calculateBundleProgressRatio = calculateBundleProgressRatio;
+function calculateBundleProgressRatio(
+  transformedFileCount,
+  totalFileCount,
+  previousRatio,
+) {
+  const baseRatio = Math.pow(
+    transformedFileCount / Math.max(totalFileCount, 10),
+    2,
+  );
+  const ratio =
+    previousRatio != null ? Math.max(baseRatio, previousRatio) : baseRatio;
+  return Math.min(ratio, 0.999);
+}