metro 0.76.4 → 0.76.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "metro",
-  "version": "0.76.4",
+  "version": "0.76.5",
   "description": "🚇 The JavaScript bundler for React Native.",
   "main": "src/index.js",
   "bin": "src/cli.js",
@@ -33,23 +33,24 @@
     "image-size": "^1.0.2",
     "invariant": "^2.2.4",
     "jest-worker": "^27.2.0",
+    "jsc-safe-url": "^0.2.2",
     "lodash.throttle": "^4.1.1",
-    "metro-babel-transformer": "0.76.4",
-    "metro-cache": "0.76.4",
-    "metro-cache-key": "0.76.4",
-    "metro-config": "0.76.4",
-    "metro-core": "0.76.4",
-    "metro-file-map": "0.76.4",
-    "metro-inspector-proxy": "0.76.4",
-    "metro-minify-terser": "0.76.4",
-    "metro-minify-uglify": "0.76.4",
-    "metro-react-native-babel-preset": "0.76.4",
-    "metro-resolver": "0.76.4",
-    "metro-runtime": "0.76.4",
-    "metro-source-map": "0.76.4",
-    "metro-symbolicate": "0.76.4",
-    "metro-transform-plugins": "0.76.4",
-    "metro-transform-worker": "0.76.4",
+    "metro-babel-transformer": "0.76.5",
+    "metro-cache": "0.76.5",
+    "metro-cache-key": "0.76.5",
+    "metro-config": "0.76.5",
+    "metro-core": "0.76.5",
+    "metro-file-map": "0.76.5",
+    "metro-inspector-proxy": "0.76.5",
+    "metro-minify-terser": "0.76.5",
+    "metro-minify-uglify": "0.76.5",
+    "metro-react-native-babel-preset": "0.76.5",
+    "metro-resolver": "0.76.5",
+    "metro-runtime": "0.76.5",
+    "metro-source-map": "0.76.5",
+    "metro-symbolicate": "0.76.5",
+    "metro-transform-plugins": "0.76.5",
+    "metro-transform-worker": "0.76.5",
     "mime-types": "^2.1.27",
     "node-fetch": "^2.2.0",
     "nullthrows": "^1.1.1",
@@ -62,15 +63,15 @@
     "yargs": "^17.6.2"
   },
   "devDependencies": {
-    "@babel/plugin-transform-flow-strip-types": "^7.0.0",
+    "@babel/plugin-transform-flow-strip-types": "^7.20.0",
     "babel-jest": "^29.2.1",
     "dedent": "^0.7.0",
     "jest-snapshot": "^26.5.2",
     "jest-snapshot-serializer-raw": "^1.2.0",
-    "metro-babel-register": "0.76.4",
-    "metro-memory-fs": "0.76.4",
-    "metro-react-native-babel-preset": "0.76.4",
-    "metro-react-native-babel-transformer": "0.76.4",
+    "metro-babel-register": "0.76.5",
+    "metro-memory-fs": "0.76.5",
+    "metro-react-native-babel-preset": "0.76.5",
+    "metro-react-native-babel-transformer": "0.76.5",
     "mock-req": "^0.2.0",
     "mock-res": "^0.6.0",
     "stack-trace": "^0.0.10"

package/src/Assets.js

@@ -11,15 +11,45 @@
 
 "use strict";
 
-const { isAssetTypeAnImage } = require("./Bundler/util");
 const AssetPaths = require("./node-haste/lib/AssetPaths");
 const crypto = require("crypto");
 const denodeify = require("denodeify");
 const fs = require("fs");
-const imageSize = require("image-size");
+const getImageSize = require("image-size");
 const path = require("path");
 const readDir = denodeify(fs.readdir);
 const readFile = denodeify(fs.readFile);
+// Test extension against all types supported by image-size module.
+// If it's not one of these, we won't treat it as an image.
+function isAssetTypeAnImage(type) {
+  return (
+    [
+      "png",
+      "jpg",
+      "jpeg",
+      "bmp",
+      "gif",
+      "webp",
+      "psd",
+      "svg",
+      "tiff",
+      "ktx",
+    ].indexOf(type) !== -1
+  );
+}
+function getAssetSize(type, content, filePath) {
+  if (!isAssetTypeAnImage(type)) {
+    return null;
+  }
+  if (content.length === 0) {
+    throw new Error(`Image asset \`${filePath}\` cannot be an empty file.`);
+  }
+  const { width, height } = getImageSize(content);
+  return {
+    width,
+    height,
+  };
+}
 const hashFiles = denodeify(function hashFilesCb(files, hash, callback) {
   if (!files.length) {
     callback(null);
@@ -141,7 +171,7 @@ async function getAssetData(
   const isImageInput = assetInfo.files[0].includes(".zip/")
     ? fs.readFileSync(assetInfo.files[0])
     : assetInfo.files[0];
-  const dimensions = isImage ? imageSize(isImageInput) : null;
+  const dimensions = isImage ? getImageSize(isImageInput) : null;
   const scale = assetInfo.scales[0];
   const assetData = {
     __packager_asset: true,
@@ -227,6 +257,8 @@ function pathBelongsToRoots(pathToCheck, roots) {
 }
 module.exports = {
   getAsset,
+  getAssetSize,
   getAssetData,
   getAssetFiles,
+  isAssetTypeAnImage,
 };

package/src/Assets.js.flow

@@ -13,12 +13,11 @@
 
 import type {AssetPath} from './node-haste/lib/AssetPaths';
 
-const {isAssetTypeAnImage} = require('./Bundler/util');
 const AssetPaths = require('./node-haste/lib/AssetPaths');
 const crypto = require('crypto');
 const denodeify = require('denodeify');
 const fs = require('fs');
-const imageSize = require('image-size');
+const getImageSize = require('image-size');
 const path = require('path');
 
 const readDir = denodeify(fs.readdir);
@@ -56,6 +55,40 @@ export type AssetDataFiltered = {
   ...
 };
 
+// Test extension against all types supported by image-size module.
+// If it's not one of these, we won't treat it as an image.
+function isAssetTypeAnImage(type: string): boolean {
+  return (
+    [
+      'png',
+      'jpg',
+      'jpeg',
+      'bmp',
+      'gif',
+      'webp',
+      'psd',
+      'svg',
+      'tiff',
+      'ktx',
+    ].indexOf(type) !== -1
+  );
+}
+
+function getAssetSize(
+  type: string,
+  content: Buffer,
+  filePath: string,
+): ?{+width: number, +height: number} {
+  if (!isAssetTypeAnImage(type)) {
+    return null;
+  }
+  if (content.length === 0) {
+    throw new Error(`Image asset \`${filePath}\` cannot be an empty file.`);
+  }
+  const {width, height} = getImageSize(content);
+  return {width, height};
+}
+
 export type AssetData = AssetDataWithoutFiles & {+files: Array<string>, ...};
 
 export type AssetDataPlugin = (
@@ -209,7 +242,7 @@ async function getAssetData(
   const isImageInput = assetInfo.files[0].includes('.zip/')
     ? fs.readFileSync(assetInfo.files[0])
     : assetInfo.files[0];
-  const dimensions = isImage ? imageSize(isImageInput) : null;
+  const dimensions = isImage ? getImageSize(isImageInput) : null;
   const scale = assetInfo.scales[0];
 
   const assetData = {
@@ -317,6 +350,8 @@ function pathBelongsToRoots(
 
 module.exports = {
   getAsset,
+  getAssetSize,
   getAssetData,
   getAssetFiles,
+  isAssetTypeAnImage,
 };

package/src/Bundler/util.js

@@ -14,11 +14,6 @@
 const babylon = require("@babel/parser");
 const template = require("@babel/template").default;
 const babelTypes = require("@babel/types");
-const nullthrows = require("nullthrows");
-const getImageSize = require("image-size");
-
-// Structure of the object: dir.name.scale = asset
-
 const assetPropertyBlockList = new Set(["files", "fileSystemLocation", "path"]);
 function generateAssetCodeFileAst(assetRegistryPath, assetDescriptor) {
   const properDescriptor = filterObject(
@@ -45,94 +40,6 @@ function generateAssetCodeFileAst(assetRegistryPath, assetDescriptor) {
     ])
   );
 }
-
-/**
- * Generates the code involved in requiring an asset, but to be loaded remotely.
- * If the asset cannot be found within the map, then it falls back to the
- * standard asset.
- */
-function generateRemoteAssetCodeFileAst(
-  assetUtilsPath,
-  assetDescriptor,
-  remoteServer,
-  remoteFileMap
-) {
-  const t = babelTypes;
-  const file = remoteFileMap[assetDescriptor.fileSystemLocation];
-  const descriptor = file && file[assetDescriptor.name];
-  const data = {};
-  if (!descriptor) {
-    return null;
-  }
-  for (const scale in descriptor) {
-    data[+scale] = descriptor[+scale].handle;
-  }
-
-  // {2: 'path/to/image@2x', 3: 'path/to/image@3x', ...}
-  const astData = babylon.parseExpression(JSON.stringify(data));
-
-  // URI to remote server
-  const URI = t.stringLiteral(remoteServer);
-
-  // Size numbers.
-  const WIDTH = t.numericLiteral(nullthrows(assetDescriptor.width));
-  const HEIGHT = t.numericLiteral(nullthrows(assetDescriptor.height));
-  const buildRequire = template.program(`
-    const {pickScale, getUrlCacheBreaker}= require(ASSET_UTILS_PATH);
-    module.exports = {
-      "width": WIDTH,
-      "height": HEIGHT,
-      "uri": URI + OBJECT_AST[pickScale(SCALE_ARRAY)] + getUrlCacheBreaker()
-    };
-  `);
-  return t.file(
-    buildRequire({
-      WIDTH,
-      HEIGHT,
-      URI,
-      OBJECT_AST: astData,
-      ASSET_UTILS_PATH: t.stringLiteral(assetUtilsPath),
-      SCALE_ARRAY: t.arrayExpression(
-        Object.keys(descriptor)
-          .map(Number)
-          .sort((a, b) => a - b)
-          .map((scale) => t.numericLiteral(scale))
-      ),
-    })
-  );
-}
-
-// Test extension against all types supported by image-size module.
-// If it's not one of these, we won't treat it as an image.
-function isAssetTypeAnImage(type) {
-  return (
-    [
-      "png",
-      "jpg",
-      "jpeg",
-      "bmp",
-      "gif",
-      "webp",
-      "psd",
-      "svg",
-      "tiff",
-      "ktx",
-    ].indexOf(type) !== -1
-  );
-}
-function getAssetSize(type, content, filePath) {
-  if (!isAssetTypeAnImage(type)) {
-    return null;
-  }
-  if (content.length === 0) {
-    throw new Error(`Image asset \`${filePath}\` cannot be an empty file.`);
-  }
-  const { width, height } = getImageSize(content);
-  return {
-    width,
-    height,
-  };
-}
 function filterObject(object, blockList) {
   const copied = {
     ...object,
@@ -213,7 +120,4 @@ class ArrayMap extends Map {
 module.exports = {
   createRamBundleGroups,
   generateAssetCodeFileAst,
-  generateRemoteAssetCodeFileAst,
-  getAssetSize,
-  isAssetTypeAnImage,
 };

package/src/Bundler/util.js.flow

@@ -18,32 +18,6 @@ import type {File} from '@babel/types';
 const babylon = require('@babel/parser');
 const template = require('@babel/template').default;
 const babelTypes = require('@babel/types');
-const nullthrows = require('nullthrows');
-const getImageSize = require('image-size');
-
-// Structure of the object: dir.name.scale = asset
-export type RemoteFileMap = {
-  [string]: {
-    [string]: {
-      [number]: {
-        handle: string,
-        hash: string,
-        ...
-      },
-      ...
-    },
-    ...
-  },
-  __proto__: null,
-  ...
-};
-
-// Structure of the object: platform.dir.name.scale = asset
-export type PlatformRemoteFileMap = {
-  [string]: RemoteFileMap,
-  __proto__: null,
-  ...
-};
 
 type SubTree<T: ModuleTransportLike> = (
   moduleTransport: T,
@@ -82,101 +56,6 @@ function generateAssetCodeFileAst(
   );
 }
 
-/**
- * Generates the code involved in requiring an asset, but to be loaded remotely.
- * If the asset cannot be found within the map, then it falls back to the
- * standard asset.
- */
-function generateRemoteAssetCodeFileAst(
-  assetUtilsPath: string,
-  assetDescriptor: AssetDataWithoutFiles,
-  remoteServer: string,
-  remoteFileMap: RemoteFileMap,
-): ?File {
-  const t = babelTypes;
-
-  const file = remoteFileMap[assetDescriptor.fileSystemLocation];
-  const descriptor = file && file[assetDescriptor.name];
-  const data: {[number]: string} = {};
-
-  if (!descriptor) {
-    return null;
-  }
-
-  for (const scale in descriptor) {
-    data[+scale] = descriptor[+scale].handle;
-  }
-
-  // {2: 'path/to/image@2x', 3: 'path/to/image@3x', ...}
-  const astData = babylon.parseExpression(JSON.stringify(data));
-
-  // URI to remote server
-  const URI = t.stringLiteral(remoteServer);
-
-  // Size numbers.
-  const WIDTH = t.numericLiteral(nullthrows(assetDescriptor.width));
-  const HEIGHT = t.numericLiteral(nullthrows(assetDescriptor.height));
-
-  const buildRequire = template.program(`
-    const {pickScale, getUrlCacheBreaker}= require(ASSET_UTILS_PATH);
-    module.exports = {
-      "width": WIDTH,
-      "height": HEIGHT,
-      "uri": URI + OBJECT_AST[pickScale(SCALE_ARRAY)] + getUrlCacheBreaker()
-    };
-  `);
-
-  return t.file(
-    buildRequire({
-      WIDTH,
-      HEIGHT,
-      URI,
-      OBJECT_AST: astData,
-      ASSET_UTILS_PATH: t.stringLiteral(assetUtilsPath),
-      SCALE_ARRAY: t.arrayExpression(
-        Object.keys(descriptor)
-          .map(Number)
-          .sort((a: number, b: number) => a - b)
-          .map((scale: number) => t.numericLiteral(scale)),
-      ),
-    }),
-  );
-}
-
-// Test extension against all types supported by image-size module.
-// If it's not one of these, we won't treat it as an image.
-function isAssetTypeAnImage(type: string): boolean {
-  return (
-    [
-      'png',
-      'jpg',
-      'jpeg',
-      'bmp',
-      'gif',
-      'webp',
-      'psd',
-      'svg',
-      'tiff',
-      'ktx',
-    ].indexOf(type) !== -1
-  );
-}
-
-function getAssetSize(
-  type: string,
-  content: Buffer,
-  filePath: string,
-): ?{+width: number, +height: number} {
-  if (!isAssetTypeAnImage(type)) {
-    return null;
-  }
-  if (content.length === 0) {
-    throw new Error(`Image asset \`${filePath}\` cannot be an empty file.`);
-  }
-  const {width, height} = getImageSize(content);
-  return {width, height};
-}
-
 function filterObject(
   object: AssetDataWithoutFiles,
   blockList: Set<string>,
@@ -271,7 +150,4 @@ class ArrayMap<K, V> extends Map<K, Array<V>> {
 module.exports = {
   createRamBundleGroups,
   generateAssetCodeFileAst,
-  generateRemoteAssetCodeFileAst,
-  getAssetSize,
-  isAssetTypeAnImage,
 };

package/src/DeltaBundler/DeltaCalculator.js

@@ -277,10 +277,17 @@ class DeltaCalculator extends EventEmitter {
         reset: false,
       };
     }
+    debug("Traversing dependencies for %s paths", modifiedDependencies.length);
     const { added, modified, deleted } = await this._graph.traverseDependencies(
       modifiedDependencies,
       this._options
     );
+    debug(
+      "Calculated graph delta {added: %s, modified: %d, deleted: %d}",
+      added.size,
+      modified.size,
+      deleted.size
+    );
     return {
       added,
       modified,

package/src/DeltaBundler/DeltaCalculator.js.flow

@@ -323,10 +323,17 @@ class DeltaCalculator<T> extends EventEmitter {
       };
     }
 
+    debug('Traversing dependencies for %s paths', modifiedDependencies.length);
     const {added, modified, deleted} = await this._graph.traverseDependencies(
       modifiedDependencies,
       this._options,
     );
+    debug(
+      'Calculated graph delta {added: %s, modified: %d, deleted: %d}',
+      added.size,
+      modified.size,
+      deleted.size,
+    );
 
     return {
       added,