metro 0.76.4 → 0.76.6

package/src/DeltaBundler/Graph.js

@@ -137,16 +137,23 @@ class Graph {
 
     // Record the paths that are part of the dependency graph before we start
     // traversing - we'll use this to ensure we don't report modules modified
-    // that only exist as part of the graph mid-traversal.
-    const existingPaths = paths.filter((path) => this.dependencies.has(path));
-    for (const path of existingPaths) {
+    // that only exist as part of the graph mid-traversal, and to eliminate
+    // modules that end up in the same state that they started from the delta.
+    const originalModules = new Map();
+    for (const path of paths) {
+      const originalModule = this.dependencies.get(path);
+      if (originalModule) {
+        originalModules.set(path, originalModule);
+      }
+    }
+    for (const [path] of originalModules) {
       // Traverse over modules that are part of the dependency graph.
       //
       // Note: A given path may not be part of the graph *at this time*, in
       // particular it may have been removed since we started traversing, but
       // in that case the path will be visited if and when we add it back to
       // the graph in a subsequent iteration.
-      if (this.dependencies.get(path)) {
+      if (this.dependencies.has(path)) {
         await this._traverseDependenciesForSingleFile(
           path,
           delta,
@@ -165,17 +172,35 @@ class Graph {
     // but may not actually differ, may be new, or may have been deleted after
     // processing. The actually-modified modules are the intersection of
     // delta.modified with the pre-existing paths, minus modules deleted.
-    for (const path of existingPaths) {
+    for (const [path, originalModule] of originalModules) {
       invariant(
         !delta.added.has(path),
         "delta.added has %s, but this path was already in the graph.",
         path
       );
       if (delta.modified.has(path)) {
-        // Only report a module as modified if we're not already reporting it
-        // as added or deleted.
+        // It's expected that a module may be both modified and subsequently
+        // deleted - we'll only return it as deleted.
         if (!delta.deleted.has(path)) {
-          modified.set(path, nullthrows(this.dependencies.get(path)));
+          // If a module existed before and has not been deleted, it must be
+          // in the dependencies map.
+          const newModule = nullthrows(this.dependencies.get(path));
+          if (
+            // Module.dependencies is mutable, so it's not obviously the case
+            // that referential equality implies no modification. However, we
+            // only mutate dependencies in two cases:
+            // 1. Within _processModule. In that case, we always mutate a new
+            //    module and set a new reference in this.dependencies.
+            // 2. During _releaseModule, when recursively removing
+            //    dependencies. In that case, we immediately discard the module
+            //    object.
+            // TODO: Refactor for more explicit immutability
+            newModule !== originalModule ||
+            transfromOutputMayDiffer(newModule, originalModule) ||
+            !allDependenciesEqual(newModule, originalModule)
+          ) {
+            modified.set(path, newModule);
+          }
         }
       }
     }
@@ -226,10 +251,6 @@ class Graph {
   async _processModule(path, delta, options) {
     const resolvedContext = this.#resolvedContexts.get(path);
 
-    // Mark any module processed as potentially modified. Once we've finished
-    // traversing we'll filter this set down.
-    delta.modified.add(path);
-
     // Transform the file via the given option.
     // TODO: Unbind the transform method from options
     const result = await options.transform(path, resolvedContext);
@@ -241,47 +262,63 @@ class Graph {
       result.dependencies,
       options
     );
-    const previousModule = this.dependencies.get(path) || {
-      inverseDependencies:
-        delta.earlyInverseDependencies.get(path) || new _CountingSet.default(),
-      path,
-    };
-    const previousDependencies = previousModule.dependencies || new Map();
-
-    // Update the module information.
-    const module = {
-      ...previousModule,
+    const previousModule = this.dependencies.get(path);
+    const previousDependencies = previousModule?.dependencies ?? new Map();
+    const nextModule = {
+      ...(previousModule ?? {
+        inverseDependencies:
+          delta.earlyInverseDependencies.get(path) ??
+          new _CountingSet.default(),
+        path,
+      }),
       dependencies: new Map(previousDependencies),
       getSource: result.getSource,
       output: result.output,
+      unstable_transformResultKey: result.unstable_transformResultKey,
     };
-    this.dependencies.set(module.path, module);
+
+    // Update the module information.
+    this.dependencies.set(nextModule.path, nextModule);
 
     // Diff dependencies (1/2): remove dependencies that have changed or been removed.
+    let dependenciesRemoved = false;
     for (const [key, prevDependency] of previousDependencies) {
       const curDependency = currentDependencies.get(key);
       if (
         !curDependency ||
         !dependenciesEqual(prevDependency, curDependency, options)
       ) {
-        this._removeDependency(module, key, prevDependency, delta, options);
+        dependenciesRemoved = true;
+        this._removeDependency(nextModule, key, prevDependency, delta, options);
       }
     }
 
     // Diff dependencies (2/2): add dependencies that have changed or been added.
-    const promises = [];
+    const addDependencyPromises = [];
     for (const [key, curDependency] of currentDependencies) {
       const prevDependency = previousDependencies.get(key);
       if (
         !prevDependency ||
         !dependenciesEqual(prevDependency, curDependency, options)
       ) {
-        promises.push(
-          this._addDependency(module, key, curDependency, delta, options)
+        addDependencyPromises.push(
+          this._addDependency(nextModule, key, curDependency, delta, options)
         );
       }
     }
-    await Promise.all(promises);
+    if (
+      previousModule &&
+      !transfromOutputMayDiffer(previousModule, nextModule) &&
+      !dependenciesRemoved &&
+      addDependencyPromises.length === 0
+    ) {
+      // We have not operated on nextModule, so restore previousModule
+      // to aid diffing.
+      this.dependencies.set(previousModule.path, previousModule);
+      return previousModule;
+    }
+    delta.modified.add(path);
+    await Promise.all(addDependencyPromises);
 
     // Replace dependencies with the correctly-ordered version. As long as all
     // the above promises have resolved, this will be the same map but without
@@ -291,11 +328,11 @@ class Graph {
 
     // Catch obvious errors with a cheap assertion.
     invariant(
-      module.dependencies.size === currentDependencies.size,
+      nextModule.dependencies.size === currentDependencies.size,
       "Failed to add the correct dependencies"
     );
-    module.dependencies = currentDependencies;
-    return module;
+    nextModule.dependencies = currentDependencies;
+    return nextModule;
   }
   async _addDependency(parentModule, key, dependency, delta, options) {
     const path = dependency.absolutePath;
@@ -686,6 +723,18 @@ function dependenciesEqual(a, b, options) {
       contextParamsEqual(a.data.data.contextParams, b.data.data.contextParams))
   );
 }
+function allDependenciesEqual(a, b, options) {
+  if (a.dependencies.size !== b.dependencies.size) {
+    return false;
+  }
+  for (const [key, depA] of a.dependencies) {
+    const depB = b.dependencies.get(key);
+    if (!depB || !dependenciesEqual(depA, depB, options)) {
+      return false;
+    }
+  }
+  return true;
+}
 function contextParamsEqual(a, b) {
   return (
     a === b ||
@@ -698,3 +747,9 @@ function contextParamsEqual(a, b) {
       a.mode === b.mode)
   );
 }
+function transfromOutputMayDiffer(a, b) {
+  return (
+    a.unstable_transformResultKey == null ||
+    a.unstable_transformResultKey !== b.unstable_transformResultKey
+  );
+}

package/src/DeltaBundler/Graph.js.flow

@@ -176,17 +176,24 @@ export class Graph<T = MixedOutput> {
 
     // Record the paths that are part of the dependency graph before we start
     // traversing - we'll use this to ensure we don't report modules modified
-    // that only exist as part of the graph mid-traversal.
-    const existingPaths = paths.filter(path => this.dependencies.has(path));
+    // that only exist as part of the graph mid-traversal, and to eliminate
+    // modules that end up in the same state that they started from the delta.
+    const originalModules = new Map<string, Module<T>>();
+    for (const path of paths) {
+      const originalModule = this.dependencies.get(path);
+      if (originalModule) {
+        originalModules.set(path, originalModule);
+      }
+    }
 
-    for (const path of existingPaths) {
+    for (const [path] of originalModules) {
       // Traverse over modules that are part of the dependency graph.
       //
       // Note: A given path may not be part of the graph *at this time*, in
       // particular it may have been removed since we started traversing, but
       // in that case the path will be visited if and when we add it back to
       // the graph in a subsequent iteration.
-      if (this.dependencies.get(path)) {
+      if (this.dependencies.has(path)) {
         await this._traverseDependenciesForSingleFile(
           path,
           delta,
@@ -208,17 +215,35 @@ export class Graph<T = MixedOutput> {
     // but may not actually differ, may be new, or may have been deleted after
     // processing. The actually-modified modules are the intersection of
     // delta.modified with the pre-existing paths, minus modules deleted.
-    for (const path of existingPaths) {
+    for (const [path, originalModule] of originalModules) {
       invariant(
         !delta.added.has(path),
         'delta.added has %s, but this path was already in the graph.',
         path,
       );
       if (delta.modified.has(path)) {
-        // Only report a module as modified if we're not already reporting it
-        // as added or deleted.
+        // It's expected that a module may be both modified and subsequently
+        // deleted - we'll only return it as deleted.
         if (!delta.deleted.has(path)) {
-          modified.set(path, nullthrows(this.dependencies.get(path)));
+          // If a module existed before and has not been deleted, it must be
+          // in the dependencies map.
+          const newModule = nullthrows(this.dependencies.get(path));
+          if (
+            // Module.dependencies is mutable, so it's not obviously the case
+            // that referential equality implies no modification. However, we
+            // only mutate dependencies in two cases:
+            // 1. Within _processModule. In that case, we always mutate a new
+            //    module and set a new reference in this.dependencies.
+            // 2. During _releaseModule, when recursively removing
+            //    dependencies. In that case, we immediately discard the module
+            //    object.
+            // TODO: Refactor for more explicit immutability
+            newModule !== originalModule ||
+            transfromOutputMayDiffer(newModule, originalModule) ||
+            !allDependenciesEqual(newModule, originalModule)
+          ) {
+            modified.set(path, newModule);
+          }
         }
       }
     }
@@ -290,10 +315,6 @@ export class Graph<T = MixedOutput> {
   ): Promise<Module<T>> {
     const resolvedContext = this.#resolvedContexts.get(path);
 
-    // Mark any module processed as potentially modified. Once we've finished
-    // traversing we'll filter this set down.
-    delta.modified.add(path);
-
     // Transform the file via the given option.
     // TODO: Unbind the transform method from options
     const result = await options.transform(path, resolvedContext);
@@ -306,48 +327,67 @@ export class Graph<T = MixedOutput> {
       options,
     );
 
-    const previousModule = this.dependencies.get(path) || {
-      inverseDependencies:
-        delta.earlyInverseDependencies.get(path) || new CountingSet(),
-      path,
-    };
-    const previousDependencies = previousModule.dependencies || new Map();
+    const previousModule = this.dependencies.get(path);
 
-    // Update the module information.
-    const module = {
-      ...previousModule,
+    const previousDependencies = previousModule?.dependencies ?? new Map();
+
+    const nextModule = {
+      ...(previousModule ?? {
+        inverseDependencies:
+          delta.earlyInverseDependencies.get(path) ?? new CountingSet(),
+        path,
+      }),
       dependencies: new Map(previousDependencies),
       getSource: result.getSource,
       output: result.output,
+      unstable_transformResultKey: result.unstable_transformResultKey,
     };
-    this.dependencies.set(module.path, module);
+
+    // Update the module information.
+    this.dependencies.set(nextModule.path, nextModule);
 
     // Diff dependencies (1/2): remove dependencies that have changed or been removed.
+    let dependenciesRemoved = false;
     for (const [key, prevDependency] of previousDependencies) {
       const curDependency = currentDependencies.get(key);
       if (
         !curDependency ||
         !dependenciesEqual(prevDependency, curDependency, options)
       ) {
-        this._removeDependency(module, key, prevDependency, delta, options);
+        dependenciesRemoved = true;
+        this._removeDependency(nextModule, key, prevDependency, delta, options);
       }
     }
 
     // Diff dependencies (2/2): add dependencies that have changed or been added.
-    const promises = [];
+    const addDependencyPromises = [];
     for (const [key, curDependency] of currentDependencies) {
       const prevDependency = previousDependencies.get(key);
       if (
         !prevDependency ||
         !dependenciesEqual(prevDependency, curDependency, options)
       ) {
-        promises.push(
-          this._addDependency(module, key, curDependency, delta, options),
+        addDependencyPromises.push(
+          this._addDependency(nextModule, key, curDependency, delta, options),
         );
       }
     }
 
-    await Promise.all(promises);
+    if (
+      previousModule &&
+      !transfromOutputMayDiffer(previousModule, nextModule) &&
+      !dependenciesRemoved &&
+      addDependencyPromises.length === 0
+    ) {
+      // We have not operated on nextModule, so restore previousModule
+      // to aid diffing.
+      this.dependencies.set(previousModule.path, previousModule);
+      return previousModule;
+    }
+
+    delta.modified.add(path);
+
+    await Promise.all(addDependencyPromises);
 
     // Replace dependencies with the correctly-ordered version. As long as all
     // the above promises have resolved, this will be the same map but without
@@ -357,13 +397,13 @@ export class Graph<T = MixedOutput> {
 
     // Catch obvious errors with a cheap assertion.
     invariant(
-      module.dependencies.size === currentDependencies.size,
+      nextModule.dependencies.size === currentDependencies.size,
       'Failed to add the correct dependencies',
     );
 
-    module.dependencies = currentDependencies;
+    nextModule.dependencies = currentDependencies;
 
-    return module;
+    return nextModule;
   }
 
   async _addDependency(
@@ -470,7 +510,10 @@ export class Graph<T = MixedOutput> {
   /**
    * Collect a list of context modules which include a given file.
    */
-  markModifiedContextModules(filePath: string, modifiedPaths: Set<string>) {
+  markModifiedContextModules(
+    filePath: string,
+    modifiedPaths: Set<string> | CountingSet<string>,
+  ) {
     for (const [absolutePath, context] of this.#resolvedContexts) {
       if (
         !modifiedPaths.has(absolutePath) &&
@@ -814,6 +857,23 @@ function dependenciesEqual(
   );
 }
 
+function allDependenciesEqual<T>(
+  a: Module<T>,
+  b: Module<T>,
+  options: $ReadOnly<{lazy: boolean, ...}>,
+): boolean {
+  if (a.dependencies.size !== b.dependencies.size) {
+    return false;
+  }
+  for (const [key, depA] of a.dependencies) {
+    const depB = b.dependencies.get(key);
+    if (!depB || !dependenciesEqual(depA, depB, options)) {
+      return false;
+    }
+  }
+  return true;
+}
+
 function contextParamsEqual(
   a: ?RequireContextParams,
   b: ?RequireContextParams,
@@ -829,3 +889,10 @@ function contextParamsEqual(
       a.mode === b.mode)
   );
 }
+
+function transfromOutputMayDiffer<T>(a: Module<T>, b: Module<T>): boolean {
+  return (
+    a.unstable_transformResultKey == null ||
+    a.unstable_transformResultKey !== b.unstable_transformResultKey
+  );
+}

package/src/DeltaBundler/Serializers/helpers/js.js

@@ -12,6 +12,7 @@
 "use strict";
 
 const invariant = require("invariant");
+const jscSafeUrl = require("jsc-safe-url");
 const { addParamsToDefineCall } = require("metro-transform-plugins");
 const path = require("path");
 function wrapModule(module, options) {
@@ -41,7 +42,9 @@ function getModuleParams(module, options) {
         // Construct a server-relative URL for the split bundle, propagating
         // most parameters from the main bundle's URL.
 
-        const { searchParams } = new URL(options.sourceUrl);
+        const { searchParams } = new URL(
+          jscSafeUrl.toNormalUrl(options.sourceUrl)
+        );
         searchParams.set("modulesOnly", "true");
         searchParams.set("runModule", "false");
         const bundlePath = path.relative(

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

@@ -15,6 +15,7 @@ import type {MixedOutput, Module} from '../../types.flow';
 import type {JsOutput} from 'metro-transform-worker';
 
 const invariant = require('invariant');
+const jscSafeUrl = require('jsc-safe-url');
 const {addParamsToDefineCall} = require('metro-transform-plugins');
 const path = require('path');
 
@@ -59,7 +60,9 @@ function getModuleParams(module: Module<>, options: Options): Array<mixed> {
         // Construct a server-relative URL for the split bundle, propagating
         // most parameters from the main bundle's URL.
 
-        const {searchParams} = new URL(options.sourceUrl);
+        const {searchParams} = new URL(
+          jscSafeUrl.toNormalUrl(options.sourceUrl),
+        );
         searchParams.set('modulesOnly', 'true');
         searchParams.set('runModule', 'false');
 

package/src/DeltaBundler/Serializers/hmrJSBundle.js

@@ -12,6 +12,7 @@
 "use strict";
 
 const { isJsModule, wrapModule } = require("./helpers/js");
+const jscSafeUrl = require("jsc-safe-url");
 const { addParamsToDefineCall } = require("metro-transform-plugins");
 const path = require("path");
 const url = require("url");
@@ -33,7 +34,7 @@ function generateModules(sourceModules, graph, options) {
         return url.format(options.clientUrl);
       };
       const sourceMappingURL = getURL("map");
-      const sourceURL = getURL("bundle");
+      const sourceURL = jscSafeUrl.toJscSafeUrl(getURL("bundle"));
       const code =
         prepareModule(module, graph, options) +
         `\n//# sourceMappingURL=${sourceMappingURL}\n` +

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

@@ -16,6 +16,7 @@ import type {DeltaResult, Module, ReadOnlyGraph} from '../types.flow';
 import type {HmrModule} from 'metro-runtime/src/modules/types.flow';
 
 const {isJsModule, wrapModule} = require('./helpers/js');
+const jscSafeUrl = require('jsc-safe-url');
 const {addParamsToDefineCall} = require('metro-transform-plugins');
 const path = require('path');
 const url = require('url');
@@ -53,7 +54,7 @@ function generateModules(
       };
 
       const sourceMappingURL = getURL('map');
-      const sourceURL = getURL('bundle');
+      const sourceURL = jscSafeUrl.toJscSafeUrl(getURL('bundle'));
       const code =
         prepareModule(module, graph, options) +
         `\n//# sourceMappingURL=${sourceMappingURL}\n` +

package/src/DeltaBundler/Transformer.js

@@ -130,6 +130,7 @@ class Transformer {
     cache.set(fullKey, data.result);
     return {
       ...data.result,
+      unstable_transformResultKey: fullKey.toString(),
       getSource() {
         if (fileBuffer) {
           return fileBuffer;

package/src/DeltaBundler/Transformer.js.flow

@@ -155,6 +155,7 @@ class Transformer {
 
     return {
       ...data.result,
+      unstable_transformResultKey: fullKey.toString(),
       getSource(): Buffer {
         if (fileBuffer) {
           return fileBuffer;

package/src/DeltaBundler/types.flow.js.flow

@@ -61,13 +61,14 @@ export type Dependency = {
   +data: TransformResultDependency,
 };
 
-export type Module<T = MixedOutput> = {
-  +dependencies: Map<string, Dependency>,
-  +inverseDependencies: CountingSet<string>,
-  +output: $ReadOnlyArray<T>,
-  +path: string,
-  +getSource: () => Buffer,
-};
+export type Module<T = MixedOutput> = $ReadOnly<{
+  dependencies: Map<string, Dependency>,
+  inverseDependencies: CountingSet<string>,
+  output: $ReadOnlyArray<T>,
+  path: string,
+  getSource: () => Buffer,
+  unstable_transformResultKey?: ?string,
+}>;
 
 export type Dependencies<T = MixedOutput> = Map<string, Module<T>>;
 export type ReadOnlyDependencies<T = MixedOutput> = $ReadOnlyMap<
@@ -102,6 +103,7 @@ export type {Graph};
 export type TransformResult<T = MixedOutput> = $ReadOnly<{
   dependencies: $ReadOnlyArray<TransformResultDependency>,
   output: $ReadOnlyArray<T>,
+  unstable_transformResultKey?: ?string,
 }>;
 
 export type TransformResultWithSource<T = MixedOutput> = $ReadOnly<{

package/src/Server.js

@@ -34,6 +34,8 @@ const { codeFrameColumns } = require("@babel/code-frame");
 const MultipartResponse = require("./Server/MultipartResponse");
 const debug = require("debug")("Metro:Server");
 const fs = require("graceful-fs");
+const invariant = require("invariant");
+const jscSafeUrl = require("jsc-safe-url");
 const {
   Logger,
   Logger: { createActionStartEntry, createActionEndEntry, log },
@@ -355,9 +357,14 @@ class Server {
   _parseOptions(url) {
     return parseOptionsFromUrl(url, new Set(this._config.resolver.platforms));
   }
+  _rewriteAndNormalizeUrl(requestUrl) {
+    return jscSafeUrl.toNormalUrl(
+      this._config.server.rewriteRequestUrl(jscSafeUrl.toNormalUrl(requestUrl))
+    );
+  }
   async _processRequest(req, res, next) {
     const originalUrl = req.url;
-    req.url = this._config.server.rewriteRequestUrl(req.url);
+    req.url = this._rewriteAndNormalizeUrl(req.url);
     const urlObj = url.parse(req.url, true);
     const { host } = req.headers;
     debug(
@@ -704,7 +711,7 @@ class Server {
         bundle: bundleCode,
       };
     },
-    finish({ req, mres, result }) {
+    finish({ req, mres, serializerOptions, result }) {
       if (
         // We avoid parsing the dates since the client should never send a more
         // recent date than the one returned by the Delta Bundler (if that's the
@@ -721,6 +728,9 @@ class Server {
           String(result.numModifiedFiles)
         );
         mres.setHeader(DELTA_ID_HEADER, String(result.nextRevId));
+        if (serializerOptions?.sourceUrl != null) {
+          mres.setHeader("Content-Location", serializerOptions.sourceUrl);
+        }
         mres.setHeader("Content-Type", "application/javascript; charset=UTF-8");
         mres.setHeader("Last-Modified", result.lastModifiedDate.toUTCString());
         mres.setHeader(
@@ -899,18 +909,27 @@ class Server {
       /* $FlowFixMe: where is `rawBody` defined? Is it added by the `connect` framework? */
       const body = await req.rawBody;
       const parsedBody = JSON.parse(body);
-      const stack = parsedBody.stack.map((frame) => {
-        if (frame.file && frame.file.includes("://")) {
+      const rewriteAndNormalizeStackFrame = (frame, lineNumber) => {
+        invariant(
+          frame != null && typeof frame === "object",
+          "Bad stack frame at line %d, expected object, received: %s",
+          lineNumber,
+          typeof frame
+        );
+        const frameFile = frame.file;
+        if (typeof frameFile === "string" && frameFile.includes("://")) {
           return {
             ...frame,
-            file: this._config.server.rewriteRequestUrl(frame.file),
+            file: this._rewriteAndNormalizeUrl(frameFile),
           };
         }
         return frame;
-      });
+      };
+      const stack = parsedBody.stack.map(rewriteAndNormalizeStackFrame);
       // In case of multiple bundles / HMR, some stack frames can have different URLs from others
       const urls = new Set();
       stack.forEach((frame) => {
+        // These urls have been rewritten and normalized above.
         const sourceUrl = frame.file;
         // Skip `/debuggerWorker.js` which does not need symbolication.
         if (
@@ -924,8 +943,11 @@ class Server {
       });
       debug("Getting source maps for symbolication");
       const sourceMaps = await Promise.all(
-        // $FlowFixMe[method-unbinding] added when improving typing for this parameters
-        Array.from(urls.values()).map(this._explodedSourceMapForURL, this)
+        Array.from(urls.values()).map((normalizedUrl) =>
+          this._explodedSourceMapForBundleOptions(
+            this._parseOptions(normalizedUrl)
+          )
+        )
       );
       debug("Performing fast symbolication");
       const symbolicatedStack = await symbolicate(
@@ -954,11 +976,7 @@ class Server {
       );
     }
   }
-  async _explodedSourceMapForURL(reqUrl) {
-    const options = parseOptionsFromUrl(
-      reqUrl,
-      new Set(this._config.resolver.platforms)
-    );
+  async _explodedSourceMapForBundleOptions(bundleOptions) {
     const {
       entryFile,
       graphOptions,
@@ -966,7 +984,7 @@ class Server {
       resolverOptions,
       serializerOptions,
       transformOptions,
-    } = splitBundleOptions(options);
+    } = splitBundleOptions(bundleOptions);
 
     /**
      * `entryFile` is relative to projectRoot, we need to use resolution function