metro 0.65.2 → 0.67.0

package/src/commands/build.js.flow

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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.
@@ -10,22 +10,20 @@
 
 'use strict';
 
-const MetroApi = require('../index');
-const TerminalReporter = require('../lib/TerminalReporter');
+import type {RunBuildOptions} from '../index';
+import type {YargArguments} from 'metro-config/src/configTypes.flow';
+import typeof Yargs from 'yargs';
 
 const {makeAsyncCommand} = require('../cli-utils');
+const MetroApi = require('../index');
+const TerminalReporter = require('../lib/TerminalReporter');
 const {loadConfig} = require('metro-config');
 const {Terminal} = require('metro-core');
 
-import type {RunBuildOptions} from '../index';
-import type {YargArguments} from 'metro-config/src/configTypes.flow';
-import typeof Yargs from 'yargs';
-
 const term = new Terminal(process.stdout);
 const updateReporter = new TerminalReporter(term);
 
 module.exports = (): ({|
-  // $FlowFixMe[value-as-type]
   builder: (yargs: Yargs) => void,
   command: string,
   description: string,
@@ -36,7 +34,6 @@ module.exports = (): ({|
   description:
     'Generates a JavaScript bundle containing the specified entrypoint and its descendants',
 
-  // $FlowFixMe[value-as-type]
   builder: (yargs: Yargs): void => {
     yargs.option('project-roots', {
       alias: 'P',

package/src/commands/dependencies.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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.
@@ -8,19 +8,21 @@
  */
 "use strict";
 
+const { makeAsyncCommand } = require("../cli-utils");
+
 const Server = require("../Server");
 
 const denodeify = require("denodeify");
 
 const fs = require("fs");
 
-const path = require("path");
-
-const { makeAsyncCommand } = require("../cli-utils");
-
 const { loadConfig } = require("metro-config");
 
+const path = require("path");
+
 async function dependencies(args, config) {
+  var _config$server$unstab;
+
   const rootModuleAbsolutePath = args.entryFile;
 
   if (!fs.existsSync(rootModuleAbsolutePath)) {
@@ -31,7 +33,10 @@ async function dependencies(args, config) {
 
   config.cacheStores = [];
   const relativePath = path.relative(
-    config.projectRoot,
+    (_config$server$unstab = config.server.unstable_serverRoot) !== null &&
+      _config$server$unstab !== void 0
+      ? _config$server$unstab
+      : config.projectRoot,
     rootModuleAbsolutePath
   );
   const options = {
@@ -39,7 +44,7 @@ async function dependencies(args, config) {
     entryFile: relativePath,
     dev: args.dev,
     minify: false,
-    generateSourceMaps: !args.dev
+    generateSourceMaps: !args.dev,
   };
   const writeToFile = args.output;
   const outStream = writeToFile
@@ -47,13 +52,13 @@ async function dependencies(args, config) {
     : process.stdout;
   const server = new Server(config);
   const deps = await server.getOrderedDependencyPaths(options);
-  deps.forEach(modulePath => {
+  deps.forEach((modulePath) => {
     // Temporary hack to disable listing dependencies not under this directory.
     // Long term, we need either
     // (a) JS code to not depend on anything outside this directory, or
     // (b) Come up with a way to declare this dependency in Buck.
     const isInsideProjectRoots =
-      config.watchFolders.filter(root => modulePath.startsWith(root)).length >
+      config.watchFolders.filter((root) => modulePath.startsWith(root)).length >
       0;
 
     if (isInsideProjectRoots) {
@@ -69,44 +74,45 @@ async function dependencies(args, config) {
 module.exports = () => ({
   command: "get-dependencies",
   description: "List dependencies",
-  builder: yargs => {
+  builder: (yargs) => {
     yargs.option("entry-file", {
       type: "string",
       demandOption: true,
-      describe: "Absolute path to the root JS file"
+      describe: "Absolute path to the root JS file",
     });
     yargs.option("output", {
       type: "string",
-      describe: "File name where to store the output, ex. /tmp/dependencies.txt"
+      describe:
+        "File name where to store the output, ex. /tmp/dependencies.txt",
     });
     yargs.option("platform", {
       type: "string",
-      describe: "The platform extension used for selecting modules"
+      describe: "The platform extension used for selecting modules",
     });
     yargs.option("transformer", {
       type: "string",
-      describe: "Specify a custom transformer to be used"
+      describe: "Specify a custom transformer to be used",
     });
     yargs.option("max-workers", {
       type: "number",
       describe:
         "Specifies the maximum number of workers the worker-pool " +
         "will spawn for transforming files. This defaults to the number of the " +
-        "cores available on your machine."
+        "cores available on your machine.",
     });
     yargs.option("dev", {
       type: "boolean",
       default: true,
-      describe: "If false, skip all dev-only code path"
+      describe: "If false, skip all dev-only code path",
     });
     yargs.option("verbose", {
       type: "boolean",
       default: false,
-      description: "Enables logging"
+      description: "Enables logging",
     });
   },
-  handler: makeAsyncCommand(async argv => {
+  handler: makeAsyncCommand(async (argv) => {
     const config = await loadConfig(argv);
     await dependencies(argv, config);
-  })
+  }),
 });

package/src/commands/serve.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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.
@@ -9,9 +9,9 @@
  */
 "use strict";
 
-const MetroApi = require("../index");
+const { makeAsyncCommand, watchFile } = require("../cli-utils");
 
-const { watchFile, makeAsyncCommand } = require("../cli-utils");
+const MetroApi = require("../index");
 
 const { loadConfig, resolveConfig } = require("metro-config");
 
@@ -20,55 +20,54 @@ const { promisify } = require("util");
 module.exports = () => ({
   command: "serve",
   description: "Starts Metro on the given port, building bundles on the fly",
-  // $FlowFixMe[value-as-type]
-  builder: yargs => {
+  builder: (yargs) => {
     yargs.option("project-roots", {
       alias: "P",
       type: "string",
-      array: true
+      array: true,
     });
     yargs.option("host", {
       alias: "h",
       type: "string",
-      default: "localhost"
+      default: "localhost",
     });
     yargs.option("port", {
       alias: "p",
       type: "number",
-      default: 8080
+      default: 8080,
     });
     yargs.option("max-workers", {
       alias: "j",
-      type: "number"
+      type: "number",
     });
     yargs.option("secure", {
       type: "boolean",
-      describe: "(deprecated)"
+      describe: "(deprecated)",
     });
     yargs.option("secure-key", {
       type: "string",
-      describe: "(deprecated)"
+      describe: "(deprecated)",
     });
     yargs.option("secure-cert", {
       type: "string",
-      describe: "(deprecated)"
+      describe: "(deprecated)",
     });
     yargs.option("secure-server-options", {
       alias: "s",
       type: "string",
-      describe: "Use dot notation for object path"
+      describe: "Use dot notation for object path",
     });
     yargs.option("hmr-enabled", {
       alias: "hmr",
-      type: "boolean"
+      type: "boolean",
     });
     yargs.option("config", {
       alias: "c",
-      type: "string"
+      type: "string",
     }); // Deprecated
 
     yargs.option("reset-cache", {
-      type: "boolean"
+      type: "boolean",
     }); // Examples
 
     yargs.example(
@@ -76,7 +75,7 @@ module.exports = () => ({
       '-s.cert="$(cat path/to/cert)" -s.key="$(cat path/to/key")'
     );
   },
-  handler: makeAsyncCommand(async argv => {
+  handler: makeAsyncCommand(async (argv) => {
     let server = null;
     let restarting = false;
 
@@ -89,7 +88,8 @@ module.exports = () => ({
 
       if (server) {
         // eslint-disable-next-line no-console
-        console.log("Configuration changed. Restarting the server...");
+        console.log("Configuration changed. Restarting the server..."); // $FlowFixMe[method-unbinding] added when improving typing for this parameters
+
         await promisify(server.close).call(server);
       }
 
@@ -106,5 +106,5 @@ module.exports = () => ({
     } else {
       await restart();
     }
-  })
+  }),
 });

package/src/commands/serve.js.flow

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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.
@@ -10,18 +10,16 @@
 
 'use strict';
 
-const MetroApi = require('../index');
-
-const {watchFile, makeAsyncCommand} = require('../cli-utils');
-const {loadConfig, resolveConfig} = require('metro-config');
-const {promisify} = require('util');
-
 import type {RunServerOptions} from '../index';
 import type {YargArguments} from 'metro-config/src/configTypes.flow';
 import typeof Yargs from 'yargs';
 
+const {makeAsyncCommand, watchFile} = require('../cli-utils');
+const MetroApi = require('../index');
+const {loadConfig, resolveConfig} = require('metro-config');
+const {promisify} = require('util');
+
 module.exports = (): ({|
-  // $FlowFixMe[value-as-type]
   builder: (yargs: Yargs) => void,
   command: $TEMPORARY$string<'serve'>,
   description: string,
@@ -31,7 +29,6 @@ module.exports = (): ({|
 
   description: 'Starts Metro on the given port, building bundles on the fly',
 
-  // $FlowFixMe[value-as-type]
   builder: (yargs: Yargs): void => {
     yargs.option('project-roots', {
       alias: 'P',
@@ -81,6 +78,7 @@ module.exports = (): ({|
       if (server) {
         // eslint-disable-next-line no-console
         console.log('Configuration changed. Restarting the server...');
+        // $FlowFixMe[method-unbinding] added when improving typing for this parameters
         await promisify(server.close).call(server);
       }
 

package/src/index.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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.
@@ -9,13 +9,21 @@
  */
 "use strict";
 
-const IncrementalBundler = require("./IncrementalBundler");
+const makeBuildCommand = require("./commands/build");
+
+const makeDependenciesCommand = require("./commands/dependencies");
+
+const makeServeCommand = require("./commands/serve");
 
 const MetroHmrServer = require("./HmrServer");
 
+const IncrementalBundler = require("./IncrementalBundler");
+
+const createWebsocketServer = require("./lib/createWebsocketServer");
+
 const MetroServer = require("./Server");
 
-const attachWebsocketServer = require("./lib/attachWebsocketServer");
+const outputBundle = require("./shared/output/bundle");
 
 const chalk = require("chalk");
 
@@ -25,17 +33,13 @@ const http = require("http");
 
 const https = require("https");
 
-const makeBuildCommand = require("./commands/build");
+const { getDefaultConfig, loadConfig, mergeConfig } = require("metro-config");
 
-const makeDependenciesCommand = require("./commands/dependencies");
-
-const makeServeCommand = require("./commands/serve");
-
-const outputBundle = require("./shared/output/bundle");
+const { InspectorProxy } = require("metro-inspector-proxy");
 
-const { loadConfig, mergeConfig, getDefaultConfig } = require("metro-config");
+const { parse } = require("url");
 
-const { InspectorProxy } = require("metro-inspector-proxy");
+const ws = require("ws");
 
 async function getConfig(config) {
   const defaultConfig = await getDefaultConfig(config.projectRoot);
@@ -44,20 +48,47 @@ async function getConfig(config) {
 
 async function runMetro(config, options) {
   const mergedConfig = await getConfig(config);
-  mergedConfig.reporter.update({
+  const {
+    reporter,
+    server: { port },
+  } = mergedConfig;
+  reporter.update({
     hasReducedPerformance: options
       ? Boolean(options.hasReducedPerformance)
       : false,
-    port: mergedConfig.server.port,
-    type: "initialize_started"
+    port,
+    type: "initialize_started",
   });
-  return new MetroServer(mergedConfig, options);
+  const { waitForBundler = false, ...serverOptions } =
+    options !== null && options !== void 0 ? options : {};
+  const server = new MetroServer(mergedConfig, serverOptions);
+  const readyPromise = server
+    .ready()
+    .then(() => {
+      reporter.update({
+        type: "initialize_done",
+        port,
+      });
+    })
+    .catch((error) => {
+      reporter.update({
+        type: "initialize_failed",
+        port,
+        error,
+      });
+    });
+
+  if (waitForBundler) {
+    await readyPromise;
+  }
+
+  return server;
 }
 
 exports.runMetro = runMetro;
 exports.loadConfig = loadConfig;
 
-exports.createConnectMiddleware = async function(config, options) {
+const createConnectMiddleware = async function (config, options) {
   const metroServer = await runMetro(config, options);
   let enhancedMiddleware = metroServer.processRequest; // Enhance the resulting middleware using the config options
 
@@ -70,14 +101,23 @@ exports.createConnectMiddleware = async function(config, options) {
 
   return {
     attachHmrServer(httpServer) {
-      attachWebsocketServer({
-        httpServer,
-        path: "/hot",
+      const wss = createWebsocketServer({
         websocketServer: new MetroHmrServer(
           metroServer.getBundler(),
           metroServer.getCreateModuleId(),
           config
-        )
+        ),
+      });
+      httpServer.on("upgrade", (request, socket, head) => {
+        const { pathname } = parse(request.url);
+
+        if (pathname === "/hot") {
+          wss.handleUpgrade(request, socket, head, (ws) => {
+            wss.emit("connection", ws, request);
+          });
+        } else {
+          socket.destroy();
+        }
       });
     },
 
@@ -86,10 +126,12 @@ exports.createConnectMiddleware = async function(config, options) {
 
     end() {
       metroServer.end();
-    }
+    },
   };
 };
 
+exports.createConnectMiddleware = createConnectMiddleware;
+
 exports.runServer = async (
   config,
   {
@@ -102,7 +144,10 @@ exports.runServer = async (
     //deprecated
     secureCert,
     // deprecated
-    secureKey // deprecated
+    secureKey,
+    // deprecated
+    waitForBundler = false,
+    websocketEndpoints = {},
   }
 ) => {
   if (secure != null || secureCert != null || secureKey != null) {
@@ -118,13 +163,13 @@ exports.runServer = async (
   const connect = require("connect");
 
   const serverApp = connect();
-  const {
-    attachHmrServer,
-    middleware,
-    end
-  } = await exports.createConnectMiddleware(config, {
-    hasReducedPerformance
-  });
+  const { middleware, end, metroServer } = await createConnectMiddleware(
+    config,
+    {
+      hasReducedPerformance,
+      waitForBundler,
+    }
+  );
   serverApp.use(middleware);
   let inspectorProxy = null;
 
@@ -141,7 +186,7 @@ exports.runServer = async (
       options = Object.assign(
         {
           key: fs.readFileSync(secureKey),
-          cert: fs.readFileSync(secureCert)
+          cert: fs.readFileSync(secureCert),
         },
         secureServerOptions
       );
@@ -152,7 +197,7 @@ exports.runServer = async (
     httpServer = http.createServer(serverApp);
   }
 
-  httpServer.on("error", error => {
+  httpServer.on("error", (error) => {
     if (onError) {
       onError(error);
     }
@@ -165,13 +210,40 @@ exports.runServer = async (
         onReady(httpServer);
       }
 
-      attachHmrServer(httpServer);
+      Object.assign(websocketEndpoints, {
+        ...(inspectorProxy
+          ? { ...inspectorProxy.createWebSocketListeners(httpServer) }
+          : {}),
+        "/hot": createWebsocketServer({
+          websocketServer: new MetroHmrServer(
+            metroServer.getBundler(),
+            metroServer.getCreateModuleId(),
+            config
+          ),
+        }),
+      });
+      httpServer.on("upgrade", (request, socket, head) => {
+        const { pathname } = parse(request.url);
+
+        if (pathname != null && websocketEndpoints[pathname]) {
+          websocketEndpoints[pathname].handleUpgrade(
+            request,
+            socket,
+            head,
+            (ws) => {
+              websocketEndpoints[pathname].emit("connection", ws, request);
+            }
+          );
+        } else {
+          socket.destroy();
+        }
+      });
 
       if (inspectorProxy) {
-        inspectorProxy.addWebSocketListener(httpServer); // TODO(hypuk): Refactor inspectorProxy.processRequest into separate request handlers
+        // TODO(hypuk): Refactor inspectorProxy.processRequest into separate request handlers
         // so that we could provide routes (/json/list and /json/version) here.
         // Currently this causes Metro to give warning about T31407894.
-
+        // $FlowFixMe[method-unbinding] added when improving typing for this parameters
         serverApp.use(inspectorProxy.processRequest.bind(inspectorProxy));
       }
 
@@ -181,7 +253,7 @@ exports.runServer = async (
     // timeout of 120 seconds to respond to a request.
 
     httpServer.timeout = 0;
-    httpServer.on("error", error => {
+    httpServer.on("error", (error) => {
       end();
       reject(error);
     });
@@ -204,11 +276,11 @@ exports.runBuild = async (
     out,
     platform = "web",
     sourceMap = false,
-    sourceMapUrl
+    sourceMapUrl,
   }
 ) => {
   const metroServer = await runMetro(config, {
-    watch: false
+    watch: false,
   });
 
   try {
@@ -220,7 +292,7 @@ exports.runBuild = async (
       platform,
       sourceMapUrl: sourceMap === false ? undefined : sourceMapUrl,
       createModuleIdFactory: config.serializer.createModuleIdFactory,
-      onProgress
+      onProgress,
     };
 
     if (onBegin) {
@@ -241,7 +313,7 @@ exports.runBuild = async (
         bundleOutput,
         sourcemapOutput,
         dev,
-        platform
+        platform,
       }; // eslint-disable-next-line no-console
 
       await output.save(metroBundle, outputOptions, console.log);
@@ -253,7 +325,7 @@ exports.runBuild = async (
   }
 };
 
-exports.buildGraph = async function(
+exports.buildGraph = async function (
   config,
   {
     customTransformOptions = Object.create(null),
@@ -262,7 +334,7 @@ exports.buildGraph = async function(
     minify = false,
     onProgress,
     platform = "web",
-    type = "module"
+    type = "module",
   }
 ) {
   const mergedConfig = await getConfig(config);
@@ -275,15 +347,14 @@ exports.buildGraph = async function(
       dev,
       minify,
       platform,
-      type
+      type,
     });
   } finally {
     bundler.end();
   }
 };
 
-exports.attachMetroCli = function(
-  // $FlowFixMe[value-as-type]
+exports.attachMetroCli = function (
   yargs,
   { build = {}, serve = {}, dependencies = {} } = {}
 ) {
@@ -298,12 +369,8 @@ exports.attachMetroCli = function(
   }
 
   if (dependencies) {
-    const {
-      command,
-      description,
-      builder,
-      handler
-    } = makeDependenciesCommand();
+    const { command, description, builder, handler } =
+      makeDependenciesCommand();
     yargs.command(command, description, builder, handler);
   }