@react-native/dev-middleware 0.73.0 → 0.73.2

package/dist/types/EventReporter.js.flow

@@ -0,0 +1,81 @@
+/**
+ * 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.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+type SuccessResult<Props: { ... } | void = {}> = {
+  status: "success",
+  ...Props,
+};
+
+type ErrorResult<ErrorT = mixed> = {
+  status: "error",
+  error: ErrorT,
+};
+
+type CodedErrorResult<ErrorCode: string> = {
+  status: "coded_error",
+  errorCode: ErrorCode,
+  errorDetails?: string,
+};
+
+type DebuggerSessionIDs = {
+  appId: string,
+  deviceName: string,
+  deviceId: string,
+  pageId: string | null,
+};
+
+export type ReportableEvent =
+  | {
+      type: "launch_debugger_frontend",
+      launchType: "launch" | "redirect",
+      ...
+        | SuccessResult<{ appId: string }>
+        | ErrorResult<mixed>
+        | CodedErrorResult<"NO_APPS_FOUND">,
+    }
+  | {
+      type: "connect_debugger_frontend",
+      ...
+        | SuccessResult<{
+            ...DebuggerSessionIDs,
+            frontendUserAgent: string | null,
+          }>
+        | ErrorResult<mixed>,
+    }
+  | {
+      type: "debugger_command",
+      protocol: "CDP",
+      // With some errors, the method might not be known
+      method: string | null,
+      requestOrigin: "proxy" | "debugger" | null,
+      responseOrigin: "proxy" | "device",
+      timeSinceStart: number | null,
+      ...DebuggerSessionIDs,
+      frontendUserAgent: string | null,
+      ...
+        | SuccessResult<void>
+        | CodedErrorResult<
+            | "TIMED_OUT"
+            | "DEVICE_DISCONNECTED"
+            | "DEBUGGER_DISCONNECTED"
+            | "UNMATCHED_REQUEST_ID"
+            | "PROTOCOL_ERROR",
+          >,
+    };
+
+/**
+ * A simple interface for logging events, to be implemented by integrators of
+ * `dev-middleware`.
+ *
+ * This is an unstable API with no semver guarantees.
+ */
+export interface EventReporter {
+  logEvent(event: ReportableEvent): void;
+}

package/dist/types/Experiments.d.ts

@@ -0,0 +1,25 @@
+/**
+ * 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
+ */
+
+export type Experiments = Readonly<{
+  /**
+   * Enables the use of the custom debugger frontend (@react-native/debugger-frontend)
+   * in the /open-debugger endpoint.
+   */
+  enableCustomDebuggerFrontend: boolean;
+  /**
+   * Enables the handling of GET requests in the /open-debugger endpoint,
+   * in addition to POST requests. GET requests respond by redirecting to
+   * the debugger frontend, instead of opening it using the BrowserLauncher
+   * interface.
+   */
+  enableOpenDebuggerRedirect: boolean;
+}>;
+export type ExperimentsConfig = Partial<Experiments>;

package/dist/types/Experiments.js

@@ -0,0 +1 @@
+"use strict";

package/dist/types/Experiments.js.flow

@@ -0,0 +1,27 @@
+/**
+ * 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.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+export type Experiments = $ReadOnly<{
+  /**
+   * Enables the use of the custom debugger frontend (@react-native/debugger-frontend)
+   * in the /open-debugger endpoint.
+   */
+  enableCustomDebuggerFrontend: boolean,
+
+  /**
+   * Enables the handling of GET requests in the /open-debugger endpoint,
+   * in addition to POST requests. GET requests respond by redirecting to
+   * the debugger frontend, instead of opening it using the BrowserLauncher
+   * interface.
+   */
+  enableOpenDebuggerRedirect: boolean,
+}>;
+
+export type ExperimentsConfig = Partial<Experiments>;

package/dist/types/Logger.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 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
+ */
+
+export type Logger = Readonly<{
+  error: (...message: Array<string>) => void;
+  info: (...message: Array<string>) => void;
+  warn: (...message: Array<string>) => void;
+}>;

package/dist/utils/DefaultBrowserLauncher.d.ts

@@ -0,0 +1,18 @@
+/**
+ * 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 { BrowserLauncher } from "../types/BrowserLauncher";
+/**
+ * Default `BrowserLauncher` implementation which opens URLs on the host
+ * machine.
+ */
+declare const DefaultBrowserLauncher: BrowserLauncher;
+export default DefaultBrowserLauncher;

package/dist/utils/DefaultBrowserLauncher.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true,
+});
+exports.default = void 0;
+var _fs = require("fs");
+var _path = _interopRequireDefault(require("path"));
+var _tempDir = _interopRequireDefault(require("temp-dir"));
+function _interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : { default: obj };
+}
+/**
+ * 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
+ */
+
+const ChromeLauncher = require("chrome-launcher");
+const { Launcher: EdgeLauncher } = require("chromium-edge-launcher");
+
+/**
+ * Default `BrowserLauncher` implementation which opens URLs on the host
+ * machine.
+ */
+const DefaultBrowserLauncher = {
+  /**
+   * Attempt to open the debugger frontend in a Google Chrome or Microsoft Edge
+   * app window.
+   */
+  launchDebuggerAppWindow: async (url) => {
+    let browserType = "chrome";
+    let chromePath;
+    try {
+      // Locate Chrome installation path, will throw if not found
+      chromePath = ChromeLauncher.getChromePath();
+    } catch (e) {
+      browserType = "edge";
+      chromePath = EdgeLauncher.getFirstInstallation();
+      if (chromePath == null) {
+        throw new Error(
+          "Unable to find a browser on the host to open the debugger. " +
+            "Supported browsers: Google Chrome, Microsoft Edge.\n" +
+            url
+        );
+      }
+    }
+    const userDataDir = await createTempDir(
+      `react-native-debugger-frontend-${browserType}`
+    );
+    const launchedChrome = await ChromeLauncher.launch({
+      chromePath,
+      chromeFlags: [
+        `--app=${url}`,
+        `--user-data-dir=${userDataDir}`,
+        "--window-size=1200,600",
+      ],
+    });
+    return {
+      kill: async () => launchedChrome.kill(),
+    };
+  },
+};
+async function createTempDir(dirName) {
+  const tempDir = _path.default.join(_tempDir.default, dirName);
+  await _fs.promises.mkdir(tempDir, {
+    recursive: true,
+  });
+  return tempDir;
+}
+var _default = DefaultBrowserLauncher;
+exports.default = _default;

package/dist/utils/DefaultBrowserLauncher.js.flow

@@ -0,0 +1,20 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ * @format
+ * @oncall react_native
+ */
+
+import type { BrowserLauncher } from "../types/BrowserLauncher";
+
+/**
+ * Default `BrowserLauncher` implementation which opens URLs on the host
+ * machine.
+ */
+declare const DefaultBrowserLauncher: BrowserLauncher;
+
+declare export default DefaultBrowserLauncher;

package/dist/utils/getDevToolsFrontendUrl.d.ts

@@ -0,0 +1,21 @@
+/**
+ * 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 { Experiments } from "../types/Experiments";
+/**
+ * Construct the URL to Chrome DevTools connected to a given debugger target.
+ */
+declare function getDevToolsFrontendUrl(
+  webSocketDebuggerUrl: string,
+  devServerUrl: string,
+  experiments: Experiments
+): string;
+export default getDevToolsFrontendUrl;

package/dist/utils/getDevToolsFrontendUrl.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true,
+});
+exports.default = getDevToolsFrontendUrl;
+/**
+ * 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
+ */
+
+/**
+ * The Chrome DevTools frontend revision to use. This should be set to the
+ * latest version known to be compatible with Hermes.
+ *
+ * Revision should be the full identifier from:
+ * https://chromium.googlesource.com/chromium/src.git
+ */
+const DEVTOOLS_FRONTEND_REV = "d9568d04d7dd79269c5a655d7ada69650c5a8336"; // Chrome 100.0.4896.75
+
+/**
+ * Construct the URL to Chrome DevTools connected to a given debugger target.
+ */
+function getDevToolsFrontendUrl(
+  webSocketDebuggerUrl,
+  devServerUrl,
+  experiments
+) {
+  const scheme = new URL(webSocketDebuggerUrl).protocol.slice(0, -1);
+  const webSocketUrlWithoutProtocol = webSocketDebuggerUrl.replace(
+    /^wss?:\/\//,
+    ""
+  );
+  if (experiments.enableCustomDebuggerFrontend) {
+    return `${`${devServerUrl}/debugger-frontend/rn_inspector.html`}?${scheme}=${encodeURIComponent(
+      webSocketUrlWithoutProtocol
+    )}&sources.hide_add_folder=true`;
+  }
+  return `${`https://chrome-devtools-frontend.appspot.com/serve_rev/@${DEVTOOLS_FRONTEND_REV}/devtools_app.html`}?panel=console&${scheme}=${encodeURIComponent(
+    webSocketUrlWithoutProtocol
+  )}`;
+}

package/dist/utils/getDevToolsFrontendUrl.js.flow

@@ -0,0 +1,21 @@
+/**
+ * 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.
+ *
+ * @flow strict-local
+ * @format
+ * @oncall react_native
+ */
+
+import type { Experiments } from "../types/Experiments";
+
+/**
+ * Construct the URL to Chrome DevTools connected to a given debugger target.
+ */
+declare export default function getDevToolsFrontendUrl(
+  webSocketDebuggerUrl: string,
+  devServerUrl: string,
+  experiments: Experiments
+): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native/dev-middleware",
-  "version": "0.73.0",
+  "version": "0.73.2",
   "description": "Dev server middleware for React Native",
   "keywords": ["react-native", "tools"],
   "homepage": "https://github.com/facebook/react-native/tree/HEAD/packages/dev-middleware#readme",
@@ -14,9 +14,14 @@
   "exports": { ".": "./dist/index.js", "./package.json": "./package.json" },
   "files": ["dist"],
   "dependencies": {
+    "@isaacs/ttlcache": "^1.4.1",
+    "@react-native/debugger-frontend": "^0.73.1",
     "chrome-launcher": "^0.15.2",
+    "chromium-edge-launcher": "^1.0.0",
     "connect": "^3.6.5",
+    "debug": "^2.2.0",
     "node-fetch": "^2.2.0",
+    "serve-static": "^1.13.1",
     "temp-dir": "^2.0.0"
   },
   "engines": { "node": ">=18" }

package/dist/utils/getDevServerUrl.js

@@ -1,37 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true,
-});
-exports.default = getDevServerUrl;
-var _net = _interopRequireDefault(require("net"));
-var _tls = require("tls");
-function _interopRequireDefault(obj) {
-  return obj && obj.__esModule ? obj : { default: obj };
-}
-/**
- * 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
- */
-
-/**
- * Get the base URL to address the current development server.
- */
-function getDevServerUrl(req) {
-  const scheme =
-    req.socket instanceof _tls.TLSSocket && req.socket.encrypted === true
-      ? "https"
-      : "http";
-  const { localAddress, localPort } = req.socket;
-  const address =
-    localAddress && _net.default.isIPv6(localAddress)
-      ? `[${localAddress}]`
-      : localAddress;
-  return `${scheme}:${address}:${localPort}`;
-}

package/dist/utils/getDevServerUrl.js.flow

@@ -1,32 +0,0 @@
-/**
- * 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.
- *
- * @flow strict
- * @format
- * @oncall react_native
- */
-
-import type {IncomingMessage} from 'http';
-
-import net from 'net';
-import {TLSSocket} from 'tls';
-
-/**
- * Get the base URL to address the current development server.
- */
-export default function getDevServerUrl(req: IncomingMessage): string {
-  const scheme =
-    req.socket instanceof TLSSocket && req.socket.encrypted === true
-      ? 'https'
-      : 'http';
-  const {localAddress, localPort} = req.socket;
-  const address =
-    localAddress && net.isIPv6(localAddress)
-      ? `[${localAddress}]`
-      : localAddress;
-
-  return `${scheme}:${address}:${localPort}`;
-}

package/dist/utils/launchChromeDevTools.js

@@ -1,44 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true,
-});
-exports.default = launchChromeDevTools;
-var _launchDebuggerAppWindow = _interopRequireDefault(
-  require("./launchDebuggerAppWindow")
-);
-function _interopRequireDefault(obj) {
-  return obj && obj.__esModule ? obj : { default: obj };
-}
-/**
- * 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
- */
-
-/**
- * The Chrome DevTools frontend revision to use. This should be set to the
- * latest version known to be compatible with Hermes.
- *
- * Revision should be the full identifier from:
- * https://chromium.googlesource.com/chromium/src.git
- */
-const DEVTOOLS_FRONTEND_REV = "d9568d04d7dd79269c5a655d7ada69650c5a8336"; // Chrome 100.0.4896.75
-
-/**
- * Attempt to launch Chrome DevTools on the host machine for a given CDP target.
- */
-async function launchChromeDevTools(webSocketDebuggerUrl) {
-  const ws = webSocketDebuggerUrl.replace(/^ws:\/\//, "");
-  return (0, _launchDebuggerAppWindow.default)(
-    `${`https://chrome-devtools-frontend.appspot.com/serve_rev/@${DEVTOOLS_FRONTEND_REV}/devtools_app.html`}?panel=console&ws=${encodeURIComponent(
-      ws
-    )}`,
-    "open-debugger"
-  );
-}

package/dist/utils/launchChromeDevTools.js.flow

@@ -1,38 +0,0 @@
-/**
- * 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.
- *
- * @flow strict
- * @format
- * @oncall react_native
- */
-
-import type {LaunchedChrome} from 'chrome-launcher';
-
-import launchDebuggerAppWindow from './launchDebuggerAppWindow';
-
-/**
- * The Chrome DevTools frontend revision to use. This should be set to the
- * latest version known to be compatible with Hermes.
- *
- * Revision should be the full identifier from:
- * https://chromium.googlesource.com/chromium/src.git
- */
-const DEVTOOLS_FRONTEND_REV = 'd9568d04d7dd79269c5a655d7ada69650c5a8336'; // Chrome 100.0.4896.75
-
-/**
- * Attempt to launch Chrome DevTools on the host machine for a given CDP target.
- */
-export default async function launchChromeDevTools(
-  webSocketDebuggerUrl: string,
-): Promise<LaunchedChrome> {
-  const urlBase = `https://chrome-devtools-frontend.appspot.com/serve_rev/@${DEVTOOLS_FRONTEND_REV}/devtools_app.html`;
-  const ws = webSocketDebuggerUrl.replace(/^ws:\/\//, '');
-
-  return launchDebuggerAppWindow(
-    `${urlBase}?panel=console&ws=${encodeURIComponent(ws)}`,
-    'open-debugger',
-  );
-}

package/dist/utils/launchDebuggerAppWindow.js

@@ -1,58 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true,
-});
-exports.default = launchDebuggerAppWindow;
-var _fs = require("fs");
-var _path = _interopRequireDefault(require("path"));
-var _tempDir = _interopRequireDefault(require("temp-dir"));
-function _interopRequireDefault(obj) {
-  return obj && obj.__esModule ? obj : { default: obj };
-}
-/**
- * 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
- */
-
-const ChromeLauncher = require("chrome-launcher");
-
-/**
- * Attempt to open a debugger frontend URL as a Google Chrome app window.
- */
-async function launchDebuggerAppWindow(
-  url,
-  /**
-   * Used to construct the temp browser dir to preserve settings such as window
-   * position.
-   */
-  intent
-) {
-  const userDataDir = await createTempDir(`react-native-${intent}-${"chrome"}`);
-  try {
-    return ChromeLauncher.launch({
-      chromeFlags: [
-        `--app=${url}`,
-        `--user-data-dir=${userDataDir}`,
-        "--window-size=1200,600",
-      ],
-    });
-  } catch (e) {
-    throw new Error(
-      "Unable to find a browser on the host to open the debugger. Supported browsers: Google Chrome"
-    );
-  }
-}
-async function createTempDir(dirName) {
-  const tempDir = _path.default.join(_tempDir.default, dirName);
-  await _fs.promises.mkdir(tempDir, {
-    recursive: true,
-  });
-  return tempDir;
-}

package/dist/utils/launchDebuggerAppWindow.js.flow

@@ -1,56 +0,0 @@
-/**
- * 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.
- *
- * @flow strict
- * @format
- * @oncall react_native
- */
-
-import type {LaunchedChrome} from 'chrome-launcher';
-import {promises as fs} from 'fs';
-import path from 'path';
-import osTempDir from 'temp-dir';
-
-const ChromeLauncher = require('chrome-launcher');
-
-/**
- * Attempt to open a debugger frontend URL as a Google Chrome app window.
- */
-export default async function launchDebuggerAppWindow(
-  url: string,
-  /**
-   * Used to construct the temp browser dir to preserve settings such as window
-   * position.
-   */
-  intent: 'open-debugger',
-): Promise<LaunchedChrome> {
-  const browserType = 'chrome';
-  const userDataDir = await createTempDir(
-    `react-native-${intent}-${browserType}`,
-  );
-
-  try {
-    return ChromeLauncher.launch({
-      chromeFlags: [
-        `--app=${url}`,
-        `--user-data-dir=${userDataDir}`,
-        '--window-size=1200,600',
-      ],
-    });
-  } catch (e) {
-    throw new Error(
-      'Unable to find a browser on the host to open the debugger. Supported browsers: Google Chrome',
-    );
-  }
-}
-
-async function createTempDir(dirName: string): Promise<string> {
-  const tempDir = path.join(osTempDir, dirName);
-
-  await fs.mkdir(tempDir, {recursive: true});
-
-  return tempDir;
-}