npm - @shopify/cli-hydrogen - Versions diffs - 6.0.2 → 7.0.0 - Mend

@shopify/cli-hydrogen 6.0.2 → 7.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (108) hide show

package/dist/commands/hydrogen/build.js +40 -78
package/dist/commands/hydrogen/codegen.js +8 -3
package/dist/commands/hydrogen/deploy.js +173 -37
package/dist/commands/hydrogen/deploy.test.js +192 -20
package/dist/commands/hydrogen/dev.js +56 -31
package/dist/commands/hydrogen/init.js +1 -1
package/dist/commands/hydrogen/init.test.js +155 -53
package/dist/commands/hydrogen/link.js +5 -21
package/dist/commands/hydrogen/link.test.js +10 -10
package/dist/commands/hydrogen/preview.js +22 -11
package/dist/commands/hydrogen/setup.js +0 -4
package/dist/commands/hydrogen/setup.test.js +0 -1
package/dist/commands/hydrogen/shortcut.js +1 -0
package/dist/commands/hydrogen/upgrade.js +720 -0
package/dist/commands/hydrogen/upgrade.test.js +786 -0
package/dist/generator-templates/starter/.graphqlrc.yml +12 -1
package/dist/generator-templates/starter/CHANGELOG.md +126 -0
package/dist/generator-templates/starter/README.md +23 -0
package/dist/generator-templates/starter/app/components/Cart.tsx +1 -1
package/dist/generator-templates/starter/app/components/Footer.tsx +3 -1
package/dist/generator-templates/starter/app/components/Header.tsx +5 -1
package/dist/generator-templates/starter/app/components/Layout.tsx +14 -11
package/dist/generator-templates/starter/app/components/Search.tsx +1 -1
package/dist/generator-templates/starter/app/graphql/customer-account/CustomerAddressMutations.ts +61 -0
package/dist/generator-templates/starter/app/graphql/customer-account/CustomerDetailsQuery.ts +39 -0
package/dist/generator-templates/starter/app/graphql/customer-account/CustomerOrderQuery.ts +87 -0
package/dist/generator-templates/starter/app/graphql/customer-account/CustomerOrdersQuery.ts +58 -0
package/dist/generator-templates/starter/app/graphql/customer-account/CustomerUpdateMutation.ts +24 -0
package/dist/generator-templates/starter/app/lib/fragments.ts +102 -0
package/dist/generator-templates/starter/app/lib/session.ts +67 -0
package/dist/generator-templates/starter/app/root.tsx +11 -45
package/dist/generator-templates/starter/app/routes/[robots.txt].tsx +0 -27
package/dist/generator-templates/starter/app/routes/account.$.tsx +8 -4
package/dist/generator-templates/starter/app/routes/account._index.tsx +5 -0
package/dist/generator-templates/starter/app/routes/account.addresses.tsx +215 -206
package/dist/generator-templates/starter/app/routes/account.orders.$id.tsx +56 -163
package/dist/generator-templates/starter/app/routes/account.orders._index.tsx +32 -109
package/dist/generator-templates/starter/app/routes/account.profile.tsx +40 -180
package/dist/generator-templates/starter/app/routes/account.tsx +20 -135
package/dist/generator-templates/starter/app/routes/account_.authorize.tsx +5 -0
package/dist/generator-templates/starter/app/routes/account_.login.tsx +3 -140
package/dist/generator-templates/starter/app/routes/account_.logout.tsx +5 -24
package/dist/generator-templates/starter/app/routes/cart.tsx +7 -5
package/dist/generator-templates/starter/app/routes/collections.$handle.tsx +1 -1
package/dist/generator-templates/starter/app/routes/products.$handle.tsx +2 -2
package/dist/generator-templates/starter/app/routes/search.tsx +1 -1
package/dist/generator-templates/starter/customer-accountapi.generated.d.ts +506 -0
package/dist/generator-templates/starter/package.json +11 -10
package/dist/generator-templates/starter/remix.config.js +4 -0
package/dist/generator-templates/starter/remix.env.d.ts +6 -11
package/dist/generator-templates/starter/server.ts +24 -167
package/dist/generator-templates/starter/storefrontapi.generated.d.ts +104 -881
package/dist/hooks/init.js +4 -4
package/dist/lib/auth.js +5 -10
package/dist/lib/build.js +6 -1
package/dist/lib/bundle/analyzer.js +36 -26
package/dist/lib/check-lockfile.js +1 -0
package/dist/lib/codegen.js +59 -18
package/dist/lib/defer.js +12 -0
package/dist/lib/file.js +52 -3
package/dist/lib/flags.js +27 -9
package/dist/lib/get-oxygen-deployment-data.test.js +4 -2
package/dist/lib/graphql/admin/client.test.js +2 -2
package/dist/lib/graphql/admin/get-oxygen-data.js +1 -0
package/dist/lib/log.js +32 -14
package/dist/lib/mini-oxygen/assets.js +118 -0
package/dist/lib/mini-oxygen/common.js +2 -1
package/dist/lib/mini-oxygen/index.js +7 -5
package/dist/lib/mini-oxygen/mini-oxygen.test.js +214 -0
package/dist/lib/mini-oxygen/node.js +19 -5
package/dist/lib/mini-oxygen/workerd-inspector-logs.js +227 -0
package/dist/lib/mini-oxygen/workerd-inspector-proxy.js +200 -0
package/dist/lib/mini-oxygen/workerd-inspector.js +62 -235
package/dist/lib/mini-oxygen/workerd.js +74 -50
package/dist/lib/missing-routes.js +6 -3
package/dist/lib/onboarding/common.js +40 -9
package/dist/lib/onboarding/local.js +19 -11
package/dist/lib/onboarding/remote.js +48 -28
package/dist/lib/render-errors.js +2 -0
package/dist/lib/request-events.js +65 -31
package/dist/lib/setups/css/assets.js +1 -46
package/dist/lib/setups/css/css-modules.js +3 -2
package/dist/lib/setups/css/postcss.js +4 -2
package/dist/lib/setups/css/tailwind.js +4 -2
package/dist/lib/setups/css/vanilla-extract.js +3 -2
package/dist/lib/setups/i18n/replacers.test.js +56 -38
package/dist/lib/shell.js +1 -1
package/dist/lib/template-diff.js +89 -0
package/dist/lib/template-downloader.js +3 -2
package/dist/lib/transpile/project.js +1 -1
package/dist/virtual-routes/assets/debug-network.css +592 -0
package/dist/virtual-routes/assets/favicon-dark.svg +20 -0
package/dist/virtual-routes/components/FlameChartWrapper.jsx +8 -10
package/dist/virtual-routes/components/IconClose.jsx +38 -0
package/dist/virtual-routes/components/IconDiscard.jsx +44 -0
package/dist/virtual-routes/components/RequestDetails.jsx +179 -0
package/dist/virtual-routes/components/RequestTable.jsx +92 -0
package/dist/virtual-routes/components/RequestWaterfall.jsx +151 -0
package/dist/virtual-routes/lib/useDebugNetworkServer.jsx +176 -0
package/dist/virtual-routes/routes/subrequest-profiler.jsx +243 -0
package/oclif.manifest.json +134 -59
package/package.json +18 -26
package/dist/generator-templates/starter/app/routes/account_.activate.$id.$activationToken.tsx +0 -161
package/dist/generator-templates/starter/app/routes/account_.recover.tsx +0 -129
package/dist/generator-templates/starter/app/routes/account_.register.tsx +0 -207
package/dist/generator-templates/starter/app/routes/account_.reset.$id.$resetToken.tsx +0 -136
package/dist/virtual-routes/routes/debug-network.jsx +0 -289
/package/dist/generator-templates/starter/app/{utils.ts → lib/variants.ts} +0 -0

package/dist/lib/mini-oxygen/assets.js ADDED Viewed

@@ -0,0 +1,118 @@
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import { createServer } from 'node:http';
+import { lookupMimeType } from '@shopify/cli-kit/node/mimes';
+const html = String.raw;
+const artificialAssetPrefix = "mini-oxygen/00000/11111/22222/33333";
+function buildAssetsUrl(assetsPort) {
+  return `http://localhost:${assetsPort}/${artificialAssetPrefix}/`;
+}
+function createAssetsServer(buildPathClient) {
+  return createServer(async (req, res) => {
+    res.setHeader("Access-Control-Allow-Origin", "*");
+    res.setHeader("X-Content-Type-Options", "nosniff");
+    const pathname = req.url?.split("?")[0] || "";
+    const isValidAssetPath = pathname.startsWith(`/${artificialAssetPrefix}/`) && !pathname.includes("..");
+    const relativeAssetPath = isValidAssetPath ? pathname.replace(`/${artificialAssetPrefix}`, "") : pathname;
+    if (isValidAssetPath) {
+      const filePath = path.join(buildPathClient, relativeAssetPath);
+      const file = await fs.open(filePath).catch(() => {
+      });
+      const stat = await file?.stat().catch(() => {
+      });
+      if (file && stat?.isFile()) {
+        res.setHeader("Content-Length", stat.size);
+        res.setHeader(
+          "Content-Type",
+          lookupMimeType(filePath) || "application/octet-stream"
+        );
+        return file.createReadStream().pipe(res);
+      }
+    }
+    res.setHeader("Content-Type", "text/html; charset=utf-8");
+    res.writeHead(404);
+    res.end(
+      html`<html>
+        <head>
+          <title>404: Page not found</title>
+        </head>
+        <body
+          style="display: flex; flex-direction: column; align-items: center; padding-top: 20px; font-family: Arial"
+        >
+          <h2>404 NOT FOUND</h2>
+          <p>
+            ${isValidAssetPath ? "This file was not found in the build output directory:" : "The following URL pathname is not valid:"}
+          </p>
+          <pre>${relativeAssetPath}</pre>
+        </body>
+      </html>`
+    );
+  });
+}
+const STATIC_ASSET_EXTENSIONS = Object.freeze([
+  "7Z",
+  "CSV",
+  "GIF",
+  "MIDI",
+  "PNG",
+  "TIF",
+  "ZIP",
+  "AVI",
+  "DOC",
+  "GZ",
+  "MKV",
+  "PPT",
+  "TIFF",
+  "ZST",
+  "AVIF",
+  "DOCX",
+  "ICO",
+  "MP3",
+  "PPTX",
+  "TTF",
+  "APK",
+  "DMG",
+  "ISO",
+  "MP4",
+  "PS",
+  "WEBM",
+  "BIN",
+  "EJS",
+  "JAR",
+  "OGG",
+  "RAR",
+  "WEBP",
+  "BMP",
+  "EOT",
+  "JPG",
+  "OTF",
+  "SVG",
+  "WOFF",
+  "BZ2",
+  "EPS",
+  "JPEG",
+  "PDF",
+  "SVGZ",
+  "WOFF2",
+  "CLASS",
+  "EXE",
+  "JS",
+  "PICT",
+  "SWF",
+  "XLS",
+  "CSS",
+  "FLAC",
+  "MID",
+  "PLS",
+  "TAR",
+  "XLSX",
+  "TXT",
+  "XML",
+  "MAP",
+  "HTML",
+  "GLB",
+  "JSON"
+]);
+export { STATIC_ASSET_EXTENSIONS, buildAssetsUrl, createAssetsServer };

package/dist/lib/mini-oxygen/common.js CHANGED Viewed

@@ -2,6 +2,7 @@ import { outputToken, outputInfo, outputContent } from '@shopify/cli-kit/node/ou
 import colors from '@shopify/cli-kit/node/colors';
 import { DEV_ROUTES } from '../request-events.js';
+const DEFAULT_INSPECTOR_PORT = 9229;
 function logRequestLine(request, {
   responseStatus = 200,
   durationMs = 0
@@ -55,4 +56,4 @@ const OXYGEN_HEADERS_MAP = {
   }
 };
-export { OXYGEN_HEADERS_MAP, logRequestLine };
+export { DEFAULT_INSPECTOR_PORT, OXYGEN_HEADERS_MAP, logRequestLine };

package/dist/lib/mini-oxygen/index.js CHANGED Viewed

@@ -1,12 +1,14 @@
-async function startMiniOxygen(options, useWorkerd = false) {
-  if (useWorkerd) {
-    const { startWorkerdServer } = await import('./workerd.js');
-    return startWorkerdServer(options);
-  } else {
+export { DEFAULT_INSPECTOR_PORT } from './common.js';
+export { buildAssetsUrl } from './assets.js';
+async function startMiniOxygen(options, useNodeRuntime = false) {
+  if (useNodeRuntime) {
     process.env.MINIFLARE_SUBREQUEST_LIMIT = 100;
     const { startNodeServer } = await import('./node.js');
     return startNodeServer(options);
   }
+  const { startWorkerdServer } = await import('./workerd.js');
+  return startWorkerdServer(options);
 }
 export { startMiniOxygen };

package/dist/lib/mini-oxygen/mini-oxygen.test.js ADDED Viewed

@@ -0,0 +1,214 @@
+import { describe, it, expect, vi } from 'vitest';
+import { transformWithEsbuild } from 'vite';
+import { startMiniOxygen, buildAssetsUrl } from './index.js';
+import { joinPath } from '@shopify/cli-kit/node/path';
+import { inTemporaryDirectory, removeFile, touchFile, writeFile } from '@shopify/cli-kit/node/fs';
+import getPort from 'get-port';
+describe("MiniOxygen Worker Runtime", () => {
+  it("receives HTML from test worker", async () => {
+    await withFixtures(
+      async ({ writeHandler }) => {
+        await writeHandler(() => {
+          return new Response("<html><body>Hello, world</body></html>", {
+            headers: { "content-type": "text/html" }
+          });
+        });
+      },
+      async ({ fetch: fetch2 }) => {
+        const response = await fetch2("/");
+        expect(response.headers.get("content-type")).toEqual("text/html");
+        await expect(response.text()).resolves.toEqual(
+          "<html><body>Hello, world</body></html>"
+        );
+      }
+    );
+  });
+  it("reloads script", async () => {
+    await withFixtures(
+      async ({ writeHandler }) => {
+        await writeHandler((req, env) => new Response("foo"));
+      },
+      async ({ fetch: fetch2, writeHandler, miniOxygen }) => {
+        let response = await fetch2("/");
+        await expect(response.text()).resolves.toEqual("foo");
+        await writeHandler((req, env) => new Response("bar"));
+        await miniOxygen.reload();
+        response = await fetch2("/");
+        await expect(response.text()).resolves.toEqual("bar");
+      }
+    );
+  });
+  it("reloads environment variables", async () => {
+    await withFixtures(
+      async ({ writeHandler }) => {
+        await writeHandler((req, env) => new Response(env.TEST));
+        return { env: { TEST: "foo" } };
+      },
+      async ({ fetch: fetch2, miniOxygen }) => {
+        let response = await fetch2("/");
+        await expect(response.text()).resolves.toEqual("foo");
+        await miniOxygen.reload({ env: { TEST: "bar" } });
+        response = await fetch2("/");
+        await expect(response.text()).resolves.toEqual("bar");
+      }
+    );
+  });
+  it("serves a static asset via proxy", async () => {
+    await withFixtures(
+      async ({ writeHandler, writeAsset }) => {
+        await writeAsset(
+          "star.svg",
+          '<svg><polygon points="100,10 40,198 190,78 10,78 160,198" style="fill:gold;"/></svg>'
+        );
+        await writeHandler(() => new Response("ok"));
+      },
+      async ({ fetch: fetch2, fetchAsset }) => {
+        const asset = await (await fetchAsset("/star.svg")).text();
+        expect(asset).toEqual(
+          '<svg><polygon points="100,10 40,198 190,78 10,78 160,198" style="fill:gold;"/></svg>'
+        );
+        const response = await fetch2("/star.svg");
+        const result = await response.text();
+        expect(response.headers.get("content-type")).toEqual("image/svg+xml");
+        expect(result).toEqual(asset);
+      }
+    );
+  });
+  it("adds Oxygen request headers", async () => {
+    await withFixtures(
+      async ({ writeHandler }) => {
+        await writeHandler(
+          (req) => new Response(
+            JSON.stringify(Object.fromEntries(req.headers.entries())),
+            { headers: { "content-type": "application/json" } }
+          )
+        );
+      },
+      async ({ fetch: fetch2 }) => {
+        const response = await fetch2("/");
+        await expect(response.json()).resolves.toMatchObject({
+          "request-id": expect.stringMatching(/^[a-z0-9-]{36}$/),
+          "oxygen-buyer-ip": "127.0.0.1"
+        });
+      }
+    );
+  });
+  it("applies sourcemaps to error stack traces", async () => {
+    await withFixtures(
+      async ({ writeHandler }) => {
+        await writeHandler(
+          () => {
+            function doStuff() {
+              throw new Error("test");
+            }
+            try {
+              doStuff();
+            } catch (error) {
+              console.error(error);
+              throw error;
+            }
+            return new Response("ok");
+          },
+          { sourcemap: true }
+        );
+      },
+      async ({ fetch: fetch2, miniOxygen, miniOxygenOptions }) => {
+        const spy = vi.spyOn(console, "error").mockImplementation((error) => {
+        });
+        const response = await fetch2("/");
+        expect(response.status).toEqual(500);
+        await expect(response.text()).resolves.toEqual("Error: test");
+        await vi.waitFor(
+          () => expect(spy.mock.calls.length).toBeGreaterThan(1)
+          // At least 2 calls
+        );
+        expect(spy, "Logged with sourcemaps").toHaveBeenCalledWith(
+          expect.objectContaining({
+            stack: expect.stringMatching(
+              // Shows `doStuff` and the offending line by mapping
+              // the minified code with sourcemaps:
+              /Error: test\nthrow new Error\("test"\);\n.*at doStuff \(/s
+            )
+          })
+        );
+        expect(spy).toHaveBeenCalledWith(new Error("test"));
+        spy.mockClear();
+        await removeFile(miniOxygenOptions.buildPathWorkerFile + ".map");
+        await miniOxygen.reload();
+        await fetch2("/");
+        await vi.waitFor(
+          () => expect(spy.mock.calls.length).toBeGreaterThan(1)
+          // At least 2 calls
+        );
+        expect(spy, "Logged without sourcemaps").toHaveBeenCalledWith(
+          expect.objectContaining({
+            stack: expect.stringMatching(
+              // Doesn't show `doStuff` because it's minified
+              /Error: test\n\s+at \w .*at Object\.fetch/s
+            )
+          })
+        );
+        expect(spy).toHaveBeenCalledWith(new Error("test"));
+        spy.mockRestore();
+      }
+    );
+  });
+});
+function withFixtures(setup, runTest) {
+  return inTemporaryDirectory(async (tmpDir) => {
+    const relativeDistClient = joinPath("dist", "client");
+    const relativeDistWorker = joinPath("dist", "worker");
+    const relativeWorkerEntry = joinPath(relativeDistWorker, "index.js");
+    const writeFixture = async (filename, content) => {
+      const filepath = joinPath(tmpDir, filename);
+      await touchFile(filepath);
+      await writeFile(filepath, content);
+    };
+    const writeAsset = (filepath, content) => writeFixture(joinPath(relativeDistClient, filepath), content);
+    const writeHandler = async (handler, { sourcemap = false } = {}) => {
+      let code = `export default { fetch: ${handler.toString()} }`;
+      if (sourcemap) {
+        const result = await transformWithEsbuild(code, relativeWorkerEntry, {
+          minify: true,
+          sourcemap: true
+        });
+        code = result.code;
+        await writeFixture(
+          relativeWorkerEntry + ".map",
+          JSON.stringify(result.map)
+        );
+      }
+      await writeFixture(relativeWorkerEntry, code);
+    };
+    const optionsFromSetup = await setup({
+      writeFixture,
+      writeAsset,
+      writeHandler
+    });
+    const miniOxygenOptions = {
+      root: tmpDir,
+      port: await getPort(),
+      buildPathWorkerFile: joinPath(tmpDir, relativeWorkerEntry),
+      buildPathClient: joinPath(tmpDir, relativeDistClient),
+      inspectorPort: 9229,
+      assetsPort: 1347,
+      env: {},
+      ...optionsFromSetup
+    };
+    const miniOxygen = await startMiniOxygen(miniOxygenOptions);
+    try {
+      await runTest({
+        writeFixture,
+        writeHandler,
+        writeAsset,
+        miniOxygen,
+        miniOxygenOptions,
+        fetch: (pathname) => fetch(miniOxygen.listeningAt + pathname),
+        fetchAsset: (pathname) => fetch(buildAssetsUrl(miniOxygenOptions.assetsPort) + pathname)
+      });
+    } finally {
+      await miniOxygen.close();
+    }
+  });
+}

package/dist/lib/mini-oxygen/node.js CHANGED Viewed

@@ -2,23 +2,27 @@ import { randomUUID } from 'node:crypto';
 import { AsyncLocalStorage } from 'node:async_hooks';
 import { readFile } from '@shopify/cli-kit/node/fs';
 import { renderSuccess } from '@shopify/cli-kit/node/ui';
-import { startServer, Request } from '@shopify/mini-oxygen';
+import { Response, startServer, Request } from '@shopify/mini-oxygen';
 import { DEFAULT_PORT } from '../flags.js';
 import { OXYGEN_HEADERS_MAP, logRequestLine } from './common.js';
-import { handleDebugNetworkRequest, H2O_BINDING_NAME, logRequestEvent } from '../request-events.js';
+import { setConstructors, createLogRequestEvent, handleDebugNetworkRequest, H2O_BINDING_NAME } from '../request-events.js';
 async function startNodeServer({
   port = DEFAULT_PORT,
   watch = false,
   buildPathWorkerFile,
   buildPathClient,
-  env
+  env,
+  debug = false,
+  inspectorPort
 }) {
   const oxygenHeaders = Object.fromEntries(
     Object.entries(OXYGEN_HEADERS_MAP).map(([key, value]) => {
       return [key, value.defaultValue];
     })
   );
+  setConstructors({ Response });
+  const logRequestEvent = createLogRequestEvent();
   const asyncLocalStorage = new AsyncLocalStorage();
   const serviceBindings = {
     [H2O_BINDING_NAME]: {
@@ -33,6 +37,9 @@ async function startNodeServer({
       )
     }
   };
+  if (debug) {
+    (await import('node:inspector')).open(inspectorPort);
+  }
   const miniOxygen = await startServer({
     script: await readFile(buildPathWorkerFile),
     workerFile: buildPathWorkerFile,
@@ -90,10 +97,17 @@ async function startNodeServer({
     showBanner(options) {
       console.log("");
       renderSuccess({
-        headline: `${options?.headlinePrefix ?? ""}MiniOxygen ${options?.mode ?? "development"} server running.`,
+        headline: `${options?.headlinePrefix ?? ""}MiniOxygen (Node Sandbox) ${options?.mode ?? "development"} server running.`,
         body: [
           `View ${options?.appName ?? "Hydrogen"} app: ${listeningAt}`,
-          ...options?.extraLines ?? []
+          ...options?.extraLines ?? [],
+          ...debug ? [
+            {
+              warn: `
+Debugger listening on ws://localhost:${inspectorPort}`
+            }
+          ] : []
         ]
       });
       console.log("");

package/dist/lib/mini-oxygen/workerd-inspector-logs.js ADDED Viewed

@@ -0,0 +1,227 @@
+import { parse } from 'stack-trace';
+function addInspectorConsoleLogger(inspector) {
+  inspector.ws.addEventListener("message", async (event) => {
+    if (typeof event.data !== "string") {
+      console.error("Unrecognised devtools event:", event);
+      return;
+    }
+    const evt = JSON.parse(event.data);
+    inspector.cleanupMessageQueue(evt);
+    if (evt.method === "Runtime.consoleAPICalled") {
+      await logConsoleMessage(evt.params, inspector);
+    } else if (evt.method === "Runtime.exceptionThrown") {
+      console.error(
+        await createErrorFromException(evt.params.exceptionDetails, inspector)
+      );
+    }
+  });
+}
+async function createErrorFromException(exceptionDetails, inspector) {
+  const errorProperties = {};
+  const sourceMapConsumer = await inspector.getSourceMapConsumer();
+  if (sourceMapConsumer !== void 0) {
+    const message = exceptionDetails.exception?.description?.split("\n")[0];
+    const stack = exceptionDetails.stackTrace?.callFrames;
+    const formatted = formatStructuredError(sourceMapConsumer, message, stack);
+    errorProperties.message = exceptionDetails.text;
+    errorProperties.stack = formatted;
+  } else {
+    errorProperties.message = exceptionDetails.text + " " + (exceptionDetails.exception?.description ?? "");
+  }
+  return inspector.reconstructError(
+    errorProperties,
+    exceptionDetails.exception
+  );
+}
+async function createErrorFromLog(ro, inspector) {
+  if (ro.subtype !== "error" || ro.preview?.subtype !== "error") {
+    throw new Error("Not an error object");
+  }
+  const errorProperties = {
+    message: ro.preview.description?.split("\n").filter((line) => !/^\s+at\s/.test(line)).join("\n") ?? ro.preview.properties.find(({ name }) => name === "message")?.value ?? "",
+    stack: ro.preview.description ?? ro.description ?? ro.preview.properties.find(({ name }) => name === "stack")?.value,
+    cause: ro.preview.properties.find(({ name }) => name === "cause")?.value
+  };
+  return inspector.reconstructError(errorProperties, ro);
+}
+const mapConsoleAPIMessageTypeToConsoleMethod = {
+  log: "log",
+  debug: "debug",
+  info: "info",
+  warning: "warn",
+  error: "error",
+  dir: "dir",
+  dirxml: "dirxml",
+  table: "table",
+  trace: "trace",
+  clear: "clear",
+  count: "count",
+  assert: "assert",
+  profile: "profile",
+  profileEnd: "profileEnd",
+  timeEnd: "timeEnd",
+  startGroup: "group",
+  startGroupCollapsed: "groupCollapsed",
+  endGroup: "groupEnd"
+};
+async function logConsoleMessage(evt, inspector) {
+  const args = [];
+  for (const ro of evt.args) {
+    switch (ro.type) {
+      case "string":
+      case "number":
+      case "boolean":
+      case "undefined":
+      case "symbol":
+      case "bigint":
+        args.push(ro.value);
+        break;
+      case "function":
+        args.push(`[Function: ${ro.description ?? "<no-description>"}]`);
+        break;
+      case "object":
+        if (!ro.preview) {
+          args.push(
+            ro.subtype === "null" ? "null" : ro.description ?? "<no-description>"
+          );
+        } else {
+          if (ro.preview.description)
+            args.push(ro.preview.description);
+          switch (ro.preview.subtype) {
+            case "array":
+              args.push(
+                "[ " + ro.preview.properties.map(({ value }) => {
+                  return value;
+                }).join(", ") + (ro.preview.overflow ? "..." : "") + " ]"
+              );
+              break;
+            case "weakmap":
+            case "map":
+              ro.preview.entries === void 0 ? args.push("{}") : args.push(
+                "{\n" + ro.preview.entries.map(({ key, value }) => {
+                  return `  ${key?.description ?? "<unknown>"} => ${value.description}`;
+                }).join(",\n") + (ro.preview.overflow ? "\n  ..." : "") + "\n}"
+              );
+              break;
+            case "weakset":
+            case "set":
+              ro.preview.entries === void 0 ? args.push("{}") : args.push(
+                "{ " + ro.preview.entries.map(({ value }) => {
+                  return `${value.description}`;
+                }).join(", ") + (ro.preview.overflow ? ", ..." : "") + " }"
+              );
+              break;
+            case "regexp":
+              break;
+            case "date":
+              break;
+            case "generator":
+              args.push(ro.preview?.properties[0]?.value || "");
+              break;
+            case "promise":
+              if (ro.preview?.properties[0]?.value === "pending") {
+                args.push(`{<${ro.preview.properties[0].value}>}`);
+              } else {
+                args.push(
+                  `{<${ro.preview?.properties[0]?.value}>: ${ro.preview?.properties[1]?.value}}`
+                );
+              }
+              break;
+            case "node":
+            case "iterator":
+            case "proxy":
+            case "typedarray":
+            case "arraybuffer":
+            case "dataview":
+            case "webassemblymemory":
+            case "wasmvalue":
+              break;
+            case "error":
+              const error = await createErrorFromLog(ro, inspector);
+              args.splice(-1, 1, error);
+              break;
+            default:
+              args.push(
+                "{\n" + ro.preview.properties.map(({ name, value }) => {
+                  return `  ${name}: ${value}`;
+                }).join(",\n") + (ro.preview.overflow ? "\n  ..." : "") + "\n}"
+              );
+          }
+        }
+        break;
+      default:
+        args.push(ro.description || ro.unserializableValue || "\u{1F98B}");
+        break;
+    }
+  }
+  const method = mapConsoleAPIMessageTypeToConsoleMethod[evt.type];
+  if (method in console) {
+    switch (method) {
+      case "dir":
+        console.dir(args);
+        break;
+      case "table":
+        console.table(args);
+        break;
+      default:
+        console[method].apply(console, args);
+        break;
+    }
+  } else {
+    console.warn(`Unsupported console method: ${method}`);
+    console.warn("console event:", evt);
+  }
+}
+function formatStructuredError(sourceMapConsumer, message, frames) {
+  const lines = [];
+  if (message !== void 0)
+    lines.push(message);
+  frames?.forEach(({ functionName, lineNumber, columnNumber }, i) => {
+    try {
+      if (typeof lineNumber === "number") {
+        const pos = sourceMapConsumer.originalPositionFor({
+          line: lineNumber + 1,
+          column: columnNumber
+        });
+        if (i === 0 && pos.source && pos.line !== null) {
+          const fileSource = sourceMapConsumer.sourceContentFor(pos.source);
+          const fileSourceLine = fileSource?.split("\n")[pos.line - 1] || "";
+          lines.push(fileSourceLine.trim());
+          if (pos.column) {
+            lines.push(
+              `${" ".repeat(pos.column - fileSourceLine.search(/\S/))}^`
+            );
+          }
+        }
+        if (pos && pos.line !== null && pos.column !== null) {
+          const convertedFnName = pos.name || functionName || "";
+          let convertedLocation = `${pos.source}:${pos.line}:${pos.column + 1}`;
+          if (convertedFnName === "") {
+            lines.push(`    at ${convertedLocation}`);
+          } else {
+            lines.push(`    at ${convertedFnName} (${convertedLocation})`);
+          }
+        }
+      }
+    } catch {
+    }
+  });
+  return lines.join("\n");
+}
+function formatStack(sourceMapConsumer, stack) {
+  const message = stack.split("\n")[0];
+  const callSites = parse({ stack });
+  const frames = callSites.map((site) => ({
+    functionName: site.getFunctionName() ?? "",
+    // `Protocol.Runtime.CallFrame`s line numbers are 0-indexed, hence `- 1`
+    lineNumber: (site.getLineNumber() ?? 1) - 1,
+    columnNumber: site.getColumnNumber() ?? 1,
+    // Unused by `formattedError`
+    scriptId: "",
+    url: ""
+  }));
+  return formatStructuredError(sourceMapConsumer, message, frames);
+}
+export { addInspectorConsoleLogger, createErrorFromException, createErrorFromLog, formatStack, formatStructuredError };