From 2083935ac4a0c9e86a8b4a5e94ae07c52bc87739 Mon Sep 17 00:00:00 2001
From: bcoll <bcoll@cloudflare.com>
Date: Fri, 18 Nov 2022 10:33:49 +0000
Subject: [PATCH] Add pretty-error page infrastructure

This adds Miniflare 2's pretty-error page powered by
[Youch](https://github.com/poppinss/youch) to Miniflare 3.

Unfortunately, due to a bug in `workerd`, errors thrown
asynchronously by native APIs don't have `stack`s. This means we
can't extract the `stack` trace from dispatching to the user worker
by `try`/`catch`.

As a stop-gap solution, if the `MF-Experimental-Error-Stack` header
exists and is truthy on the response from the user worker, the body
will be interpreted as a JSON-error of the form
`{ message?: string, name?: string, stack?: string }`. `stack` will
be source-mapped if possible.

Another issue is that `workerd` gives all service-worker scripts the
name "worker.js", so if multiple service-workers are defined, we
can't identify which one threw. In this case, we don't display
sources in the pretty-error page.

Hopefully, we can fix both of these issues in `workerd`. We should be
able to reuse most of this infrastructure with `try`/`catch`s too.
---
 package-lock.json                            | 139 +++++++-
 packages/tre/README.md                       |   5 +
 packages/tre/package.json                    |   2 +
 packages/tre/src/index.ts                    |  12 +-
 packages/tre/src/plugins/core/index.ts       |  60 +++-
 packages/tre/src/plugins/core/modules.ts     |  22 +-
 packages/tre/src/plugins/core/prettyerror.ts | 329 +++++++++++++++++++
 7 files changed, 547 insertions(+), 22 deletions(-)
 create mode 100644 packages/tre/src/plugins/core/prettyerror.ts

diff --git a/package-lock.json b/package-lock.json
index 947d9b3a2..1fbf25f99 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -860,6 +860,14 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/as-table": {
+      "version": "1.0.55",
+      "resolved": "https://registry.npmjs.org/as-table/-/as-table-1.0.55.tgz",
+      "integrity": "sha512-xvsWESUJn0JN421Xb9MQw6AsMHRCUknCe0Wjlxvjud80mU4E6hQf1A6NzQKcYNmYw62MfzEtXc+badstZP3JpQ==",
+      "dependencies": {
+        "printable-characters": "^1.0.42"
+      }
+    },
     "node_modules/ava": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ava/-/ava-5.0.1.tgz",
@@ -1499,6 +1507,14 @@
         "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
       }
     },
+    "node_modules/cookie": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.5.0.tgz",
+      "integrity": "sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/cross-spawn": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
@@ -1525,6 +1541,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/data-uri-to-buffer": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-2.0.2.tgz",
+      "integrity": "sha512-ND9qDTLc6diwj+Xe5cdAgVTbLVdXbtxTJRXRhli8Mowuaan+0EJOtdqJ0QCHNSSPyoXGx9HX2/VMnKeC34AChA=="
+    },
     "node_modules/date-time": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/date-time/-/date-time-3.1.0.tgz",
@@ -2557,6 +2578,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/get-source": {
+      "version": "2.0.12",
+      "resolved": "https://registry.npmjs.org/get-source/-/get-source-2.0.12.tgz",
+      "integrity": "sha512-X5+4+iD+HoSeEED+uwrQ07BOQr0kEDFMVqqpBuI+RaZBpBpHCuXxo70bjar6f0b0u/DQJsJ7ssurpP0V60Az+w==",
+      "dependencies": {
+        "data-uri-to-buffer": "^2.0.0",
+        "source-map": "^0.6.1"
+      }
+    },
     "node_modules/get-stream": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
@@ -3509,6 +3539,14 @@
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
       "dev": true
     },
+    "node_modules/mustache": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/mustache/-/mustache-4.2.0.tgz",
+      "integrity": "sha512-71ippSywq5Yb7/tVYyGbkBggbU8H3u5Rz56fH60jGFgr8uHwxs+aSKeqmluIVzM0m0kB7xQjKS6qPfd0b2ZoqQ==",
+      "bin": {
+        "mustache": "bin/mustache"
+      }
+    },
     "node_modules/napi-build-utils": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/napi-build-utils/-/napi-build-utils-1.0.2.tgz",
@@ -4219,6 +4257,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/printable-characters": {
+      "version": "1.0.42",
+      "resolved": "https://registry.npmjs.org/printable-characters/-/printable-characters-1.0.42.tgz",
+      "integrity": "sha512-dKp+C4iXWK4vVYZmYSd0KBH5F/h1HoZRsbJ82AVKRO3PEo8L4lBS/vLwhVtpwwuYcoIsVY+1JYKR268yn480uQ=="
+    },
     "node_modules/progress": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
@@ -4597,7 +4640,6 @@
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
       "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4629,6 +4671,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/stacktracey": {
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/stacktracey/-/stacktracey-2.1.8.tgz",
+      "integrity": "sha512-Kpij9riA+UNg7TnphqjH7/CzctQ/owJGNbFkfEeve4Z4uxT5+JapVLFXcsurIfN34gnTWZNJ/f7NMG0E8JDzTw==",
+      "dependencies": {
+        "as-table": "^1.0.36",
+        "get-source": "^2.0.12"
+      }
+    },
     "node_modules/stoppable": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/stoppable/-/stoppable-1.1.0.tgz",
@@ -5329,6 +5380,16 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/youch": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/youch/-/youch-3.2.2.tgz",
+      "integrity": "sha512-+xhTK8sY9qV3nLbWVaOUFZPdlQ3wrMKiu3dKqKkAkLaYzzkYmpWY+v+eQIAfbPu7TZhS1G5FhEV++sl8fhuT4w==",
+      "dependencies": {
+        "cookie": "^0.5.0",
+        "mustache": "^4.2.0",
+        "stacktracey": "^2.1.8"
+      }
+    },
     "node_modules/z-schema": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-5.0.2.tgz",
@@ -5785,10 +5846,12 @@
         "glob-to-regexp": "^0.4.1",
         "http-cache-semantics": "^4.1.0",
         "kleur": "^4.1.5",
+        "source-map": "^0.7.4",
         "stoppable": "^1.1.0",
         "undici": "^5.12.0",
         "workerd": "^1.20221111.5",
         "ws": "^8.11.0",
+        "youch": "^3.2.2",
         "zod": "^3.18.0"
       },
       "devDependencies": {
@@ -5815,6 +5878,14 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "packages/tre/node_modules/source-map": {
+      "version": "0.7.4",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz",
+      "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "packages/watcher": {
       "name": "@miniflare/watcher",
       "version": "3.0.0-next.6",
@@ -6030,10 +6101,12 @@
         "glob-to-regexp": "^0.4.1",
         "http-cache-semantics": "^4.1.0",
         "kleur": "^4.1.5",
+        "source-map": "^0.7.4",
         "stoppable": "^1.1.0",
         "undici": "^5.12.0",
         "workerd": "^1.20221111.5",
         "ws": "^8.11.0",
+        "youch": "^3.2.2",
         "zod": "^3.18.0"
       },
       "dependencies": {
@@ -6041,6 +6114,11 @@
           "version": "5.1.1",
           "resolved": "https://registry.npmjs.org/get-port/-/get-port-5.1.1.tgz",
           "integrity": "sha512-g/Q1aTSDOxFpchXC4i8ZWvxA1lnPqx/JHqcpIw0/LX9T8x/GBbi6YnlN5nhaKIFkT8oFsscUKgDJYxfwfS6QsQ=="
+        },
+        "source-map": {
+          "version": "0.7.4",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz",
+          "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA=="
         }
       }
     },
@@ -6479,6 +6557,14 @@
       "integrity": "sha512-tLkvA81vQG/XqE2mjDkGQHoOINtMHtysSnemrmoGe6PydDPMRbVugqyk4A6V/WDWEfm3l+0d8anA9r8cv/5Jaw==",
       "dev": true
     },
+    "as-table": {
+      "version": "1.0.55",
+      "resolved": "https://registry.npmjs.org/as-table/-/as-table-1.0.55.tgz",
+      "integrity": "sha512-xvsWESUJn0JN421Xb9MQw6AsMHRCUknCe0Wjlxvjud80mU4E6hQf1A6NzQKcYNmYw62MfzEtXc+badstZP3JpQ==",
+      "requires": {
+        "printable-characters": "^1.0.42"
+      }
+    },
     "ava": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ava/-/ava-5.0.1.tgz",
@@ -6964,6 +7050,11 @@
       "integrity": "sha512-rcQ1bsQO9799wq24uE5AM2tAILy4gXGIK/njFWcVQkGNZ96edlpY+A7bjwvzjYvLDyzmG1MmMLZhpcsb+klNMQ==",
       "dev": true
     },
+    "cookie": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.5.0.tgz",
+      "integrity": "sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw=="
+    },
     "cross-spawn": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
@@ -6984,6 +7075,11 @@
         "array-find-index": "^1.0.1"
       }
     },
+    "data-uri-to-buffer": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-2.0.2.tgz",
+      "integrity": "sha512-ND9qDTLc6diwj+Xe5cdAgVTbLVdXbtxTJRXRhli8Mowuaan+0EJOtdqJ0QCHNSSPyoXGx9HX2/VMnKeC34AChA=="
+    },
     "date-time": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/date-time/-/date-time-3.1.0.tgz",
@@ -7763,6 +7859,15 @@
         "has-symbols": "^1.0.1"
       }
     },
+    "get-source": {
+      "version": "2.0.12",
+      "resolved": "https://registry.npmjs.org/get-source/-/get-source-2.0.12.tgz",
+      "integrity": "sha512-X5+4+iD+HoSeEED+uwrQ07BOQr0kEDFMVqqpBuI+RaZBpBpHCuXxo70bjar6f0b0u/DQJsJ7ssurpP0V60Az+w==",
+      "requires": {
+        "data-uri-to-buffer": "^2.0.0",
+        "source-map": "^0.6.1"
+      }
+    },
     "get-stream": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
@@ -8418,6 +8523,11 @@
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
       "dev": true
     },
+    "mustache": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/mustache/-/mustache-4.2.0.tgz",
+      "integrity": "sha512-71ippSywq5Yb7/tVYyGbkBggbU8H3u5Rz56fH60jGFgr8uHwxs+aSKeqmluIVzM0m0kB7xQjKS6qPfd0b2ZoqQ=="
+    },
     "napi-build-utils": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/napi-build-utils/-/napi-build-utils-1.0.2.tgz",
@@ -8915,6 +9025,11 @@
         "parse-ms": "^3.0.0"
       }
     },
+    "printable-characters": {
+      "version": "1.0.42",
+      "resolved": "https://registry.npmjs.org/printable-characters/-/printable-characters-1.0.42.tgz",
+      "integrity": "sha512-dKp+C4iXWK4vVYZmYSd0KBH5F/h1HoZRsbJ82AVKRO3PEo8L4lBS/vLwhVtpwwuYcoIsVY+1JYKR268yn480uQ=="
+    },
     "progress": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
@@ -9143,8 +9258,7 @@
     "source-map": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "dev": true
+      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
     },
     "sprintf-js": {
       "version": "1.0.3",
@@ -9169,6 +9283,15 @@
         }
       }
     },
+    "stacktracey": {
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/stacktracey/-/stacktracey-2.1.8.tgz",
+      "integrity": "sha512-Kpij9riA+UNg7TnphqjH7/CzctQ/owJGNbFkfEeve4Z4uxT5+JapVLFXcsurIfN34gnTWZNJ/f7NMG0E8JDzTw==",
+      "requires": {
+        "as-table": "^1.0.36",
+        "get-source": "^2.0.12"
+      }
+    },
     "stoppable": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/stoppable/-/stoppable-1.1.0.tgz",
@@ -9677,6 +9800,16 @@
       "integrity": "sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==",
       "dev": true
     },
+    "youch": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/youch/-/youch-3.2.2.tgz",
+      "integrity": "sha512-+xhTK8sY9qV3nLbWVaOUFZPdlQ3wrMKiu3dKqKkAkLaYzzkYmpWY+v+eQIAfbPu7TZhS1G5FhEV++sl8fhuT4w==",
+      "requires": {
+        "cookie": "^0.5.0",
+        "mustache": "^4.2.0",
+        "stacktracey": "^2.1.8"
+      }
+    },
     "z-schema": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-5.0.2.tgz",
diff --git a/packages/tre/README.md b/packages/tre/README.md
index 1f987e12d..7e5c99297 100644
--- a/packages/tre/README.md
+++ b/packages/tre/README.md
@@ -223,6 +223,11 @@ parameter in module format Workers.
     must also be defined. Note the first module must be the entrypoint and have
     type `"ESModule"`.
 
+- `modulesRoot?: string`
+
+  If `modules` is set to an array, modules' "name"s will be their `path`s
+  relative to this value. This ensures file paths in stack traces are correct.
+
 <!-- prettier-ignore-start -->
 <!-- (for disabling `;` insertion in `js` code block) -->
 
diff --git a/packages/tre/package.json b/packages/tre/package.json
index 3e9e5d95c..475429988 100644
--- a/packages/tre/package.json
+++ b/packages/tre/package.json
@@ -35,10 +35,12 @@
     "glob-to-regexp": "^0.4.1",
     "http-cache-semantics": "^4.1.0",
     "kleur": "^4.1.5",
+    "source-map": "^0.7.4",
     "stoppable": "^1.1.0",
     "undici": "^5.12.0",
     "workerd": "^1.20221111.5",
     "ws": "^8.11.0",
+    "youch": "^3.2.2",
     "zod": "^3.18.0"
   },
   "devDependencies": {
diff --git a/packages/tre/src/index.ts b/packages/tre/src/index.ts
index 8d39e14d3..f2165956b 100644
--- a/packages/tre/src/index.ts
+++ b/packages/tre/src/index.ts
@@ -27,7 +27,12 @@ import {
   maybeGetSitesManifestModule,
   normaliseDurableObject,
 } from "./plugins";
-import { HEADER_CUSTOM_SERVICE, getUserServiceName } from "./plugins/core";
+import {
+  HEADER_CUSTOM_SERVICE,
+  SourceOptions,
+  getUserServiceName,
+  handlePrettyErrorRequest,
+} from "./plugins/core";
 import {
   Config,
   Runtime,
@@ -345,6 +350,11 @@ export class Miniflare {
         request,
         customService
       );
+    } else if (url.pathname === "/core/error") {
+      const workerSrcOpts = this.#workerOpts.map<SourceOptions>(
+        ({ core }) => core
+      );
+      response = await handlePrettyErrorRequest(workerSrcOpts, request);
     } else {
       // TODO: check for proxying/outbound fetch header first (with plans for fetch mocking)
       response = await this.#handleLoopbackPlugins(request, url);
diff --git a/packages/tre/src/plugins/core/index.ts b/packages/tre/src/plugins/core/index.ts
index ff28ca1f2..08081635c 100644
--- a/packages/tre/src/plugins/core/index.ts
+++ b/packages/tre/src/plugins/core/index.ts
@@ -21,9 +21,10 @@ import {
   ModuleDefinitionSchema,
   ModuleLocator,
   ModuleRuleSchema,
-  STRING_SCRIPT_PATH,
+  buildStringScriptPath,
   convertModuleDefinition,
 } from "./modules";
+import { HEADER_ERROR_STACK } from "./prettyerror";
 import { ServiceDesignatorSchema } from "./services";
 
 const encoder = new TextEncoder();
@@ -42,6 +43,7 @@ export const CoreOptionsSchema = z.object({
       z.array(ModuleDefinitionSchema),
     ])
     .optional(),
+  modulesRoot: z.string().optional(),
   modulesRules: z.array(ModuleRuleSchema).optional(),
 
   compatibilityDate: z.string().optional(),
@@ -122,7 +124,6 @@ const LIVE_RELOAD_SCRIPT_TEMPLATE = (
 })();
 </script>`;
 
-// TODO: is there a way of capturing the full stack trace somehow?
 // Using `>=` for version check to handle multiple `setOptions` calls before
 // reload complete.
 export const SCRIPT_ENTRY = `async function handleEvent(event) {
@@ -141,12 +142,32 @@ export const SCRIPT_ENTRY = `async function handleEvent(event) {
     return new Response("No entrypoint worker found", { status: 404 });
   }
   try {
-    const response = await ${BINDING_SERVICE_USER}.fetch(request);
+    let response = await ${BINDING_SERVICE_USER}.fetch(request);
+    
+    if (
+      response.status === 500 &&
+      response.headers.get("${HEADER_ERROR_STACK}") !== null
+    ) {
+      const accept = request.headers.get("Accept")?.toLowerCase() ?? "";
+      const userAgent = request.headers.get("User-Agent")?.toLowerCase() ?? "";
+      const acceptsPrettyError =
+        !userAgent.includes("curl/") &&
+        (accept.includes("text/html") ||
+          accept.includes("*/*") ||
+          accept.includes("text/*"));
+      if (acceptsPrettyError) {
+        response = await ${BINDING_SERVICE_LOOPBACK}.fetch("http://localhost/core/error", {
+          method: "POST",
+          headers: request.headers,
+          body: response.body,
+        });
+      }
+    }
 
     const liveReloadScript = globalThis.${BINDING_DATA_LIVE_RELOAD_SCRIPT};
     if (
       liveReloadScript !== undefined &&
-      response.headers.get("content-type")?.toLowerCase().includes("text/html")
+      response.headers.get("Content-Type")?.toLowerCase().includes("text/html")
     ) {
       const headers = new Headers(response.headers);
       const contentLength = parseInt(headers.get("content-length"));
@@ -286,6 +307,7 @@ export const CORE_PLUGIN: Plugin<
     return Promise.all(bindings);
   },
   async getServices({
+    log,
     options,
     optionsVersion,
     workerBindings,
@@ -294,12 +316,17 @@ export const CORE_PLUGIN: Plugin<
     durableObjectClassNames,
     additionalModules,
     loopbackPort,
-    log,
   }) {
     // Define core/shared services.
+    const loopbackBinding: Worker_Binding = {
+      name: BINDING_SERVICE_LOOPBACK,
+      service: { name: SERVICE_LOOPBACK },
+    };
+
     // Services get de-duped by name, so only the first worker's
     // SERVICE_LOOPBACK and SERVICE_ENTRY will be used
     const serviceEntryBindings: Worker_Binding[] = [
+      loopbackBinding, // For converting stack-traces to pretty-error pages
       { name: BINDING_JSON_VERSION, json: optionsVersion.toString() },
       { name: BINDING_JSON_CF_BLOB, json: JSON.stringify(sharedOptions.cf) },
     ];
@@ -335,7 +362,7 @@ export const CORE_PLUGIN: Plugin<
     ];
 
     // Define regular user worker if script is set
-    const workerScript = getWorkerScript(options);
+    const workerScript = getWorkerScript(options, workerIndex);
     if (workerScript !== undefined) {
       // Add additional modules (e.g. "__STATIC_CONTENT_MANIFEST") if any
       if ("modules" in workerScript) {
@@ -385,10 +412,7 @@ export const CORE_PLUGIN: Plugin<
                   name: BINDING_TEXT_CUSTOM_SERVICE,
                   text: `${workerIndex}/${name}`,
                 },
-                {
-                  name: BINDING_SERVICE_LOOPBACK,
-                  service: { name: SERVICE_LOOPBACK },
-                },
+                loopbackBinding,
               ],
             },
           });
@@ -407,11 +431,17 @@ export const CORE_PLUGIN: Plugin<
 };
 
 function getWorkerScript(
-  options: z.infer<typeof CoreOptionsSchema>
+  options: z.infer<typeof CoreOptionsSchema>,
+  workerIndex: number
 ): { serviceWorkerScript: string } | { modules: Worker_Module[] } | undefined {
   if (Array.isArray(options.modules)) {
     // If `modules` is a manually defined modules array, use that
-    return { modules: options.modules.map(convertModuleDefinition) };
+    const modulesRoot = options.modulesRoot ?? "";
+    return {
+      modules: options.modules.map((module) =>
+        convertModuleDefinition(modulesRoot, module)
+      ),
+    };
   }
 
   // Otherwise get code, preferring string `script` over `scriptPath`
@@ -431,7 +461,10 @@ function getWorkerScript(
     const locator = new ModuleLocator(options.modulesRules);
     // If `script` and `scriptPath` are set, resolve modules in `script`
     // against `scriptPath`.
-    locator.visitEntrypoint(code, options.scriptPath ?? STRING_SCRIPT_PATH);
+    locator.visitEntrypoint(
+      code,
+      options.scriptPath ?? buildStringScriptPath(workerIndex)
+    );
     return { modules: locator.modules };
   } else {
     // ...otherwise, `modules` will either be `false` or `undefined`, so treat
@@ -440,4 +473,5 @@ function getWorkerScript(
   }
 }
 
+export * from "./prettyerror";
 export * from "./services";
diff --git a/packages/tre/src/plugins/core/modules.ts b/packages/tre/src/plugins/core/modules.ts
index 003d0f923..629f75958 100644
--- a/packages/tre/src/plugins/core/modules.ts
+++ b/packages/tre/src/plugins/core/modules.ts
@@ -26,7 +26,16 @@ const SUGGEST_NODE =
   "\n- Find an alternative package that doesn't require Node.js built-ins";
 
 // Module identifier used if script came from `script` option
-export const STRING_SCRIPT_PATH = "<script>";
+export function buildStringScriptPath(workerIndex: number) {
+  return `<script:${workerIndex}>`;
+}
+const stringScriptRegexp = /^<script:(\d+)>$/;
+export function maybeGetStringScriptPathIndex(
+  scriptPath: string
+): number | undefined {
+  const match = stringScriptRegexp.exec(scriptPath);
+  return match === null ? undefined : parseInt(match[1]);
+}
 
 export const ModuleRuleTypeSchema = z.union([
   z.literal("ESModule"),
@@ -167,7 +176,7 @@ export class ModuleLocator {
     referencingPath: string,
     specExpression: estree.Expression | estree.SpreadElement
   ) {
-    if (referencingPath === STRING_SCRIPT_PATH) {
+    if (maybeGetStringScriptPathIndex(referencingPath) !== undefined) {
       const prefix = getResolveErrorPrefix(referencingPath);
       throw new MiniflareCoreError(
         "ERR_MODULE_STRING_SCRIPT",
@@ -253,15 +262,18 @@ ${dim(modulesConfig)}`;
 
 const encoder = new TextEncoder();
 const decoder = new TextDecoder();
-function contentsToString(contents: string | Uint8Array): string {
+export function contentsToString(contents: string | Uint8Array): string {
   return typeof contents === "string" ? contents : decoder.decode(contents);
 }
 function contentsToArray(contents: string | Uint8Array): Uint8Array {
   return typeof contents === "string" ? encoder.encode(contents) : contents;
 }
-export function convertModuleDefinition(def: ModuleDefinition): Worker_Module {
+export function convertModuleDefinition(
+  modulesRoot: string,
+  def: ModuleDefinition
+): Worker_Module {
   // The runtime requires module identifiers to be relative paths
-  const name = path.relative("", def.path);
+  const name = path.relative(modulesRoot, def.path);
   const contents = def.contents ?? readFileSync(def.path);
   switch (def.type) {
     case "ESModule":
diff --git a/packages/tre/src/plugins/core/prettyerror.ts b/packages/tre/src/plugins/core/prettyerror.ts
new file mode 100644
index 000000000..165c31051
--- /dev/null
+++ b/packages/tre/src/plugins/core/prettyerror.ts
@@ -0,0 +1,329 @@
+import fs from "fs";
+import path from "path";
+import { fileURLToPath } from "url";
+import { SourceMapConsumer } from "source-map";
+import type { Entry } from "stacktracey";
+import { Request, Response } from "undici";
+import { z } from "zod";
+import {
+  ModuleDefinition,
+  contentsToString,
+  maybeGetStringScriptPathIndex,
+} from "./modules";
+
+// Subset of core worker options that define Worker source code.
+// These are the possible cases, and corresponding reported source files in
+// workerd stack traces. Note that all service-worker scripts will be called
+// "worker.js" in `workerd`, so we can't differentiate between multiple workers.
+// TODO: see if we can add a service-worker script path config option to handle
+//  case (i)[i]
+//
+// Single Worker:
+// (a) { script: "<contents>" }                                       -> "worker.js"
+// (b) { script: "<contents>", modules: true }                        -> "<script:0>"
+// (c) { script: "<contents>", scriptPath: "<path>" }                 -> "worker.js"
+// (d) { script: "<contents>", scriptPath: "<path>", modules: true }  -> "<path>"
+// (e) { scriptPath: "<path>" }                                       -> "worker.js"
+// (f) { scriptPath: "<path>", modules: true }                        -> "<path>"
+// (g) { modules: [
+//   [i]  { ..., path: "<path:0>", contents: "<contents:0>" },        -> "<path:0>" relative to cwd
+//  [ii]  { ..., path: "<path:1>" },                                  -> "<path:1>" relative to cwd
+//     ] }
+// (h) { modulesRoot: "<root>", modules: [
+//   [i]  { ..., path: "<path:0>", contents: "<contents:0>" },        -> "<path:0>" relative to "<root>"
+//  [ii]  { ..., path: "<path:1>" },                                  -> "<path:1>" relative to "<root>"
+//     ] }
+//
+// Multiple Workers (array of `SourceOptions`):
+// (i) [                                                                 (note cannot differentiate "worker.js"s)
+//   [i]  { script: "<contents:0>" },                                 -> "worker.js"
+//        { script: "<contents:1>" },                                 -> "worker.js"
+//        { script: "<contents:2>", scriptPath: "<path:2>" },         -> "worker.js"
+//  [ii]  { script: "<contents:3>", modules: true },                  -> "<script:3>"
+//     ]
+//
+export interface SourceOptions {
+  script?: string;
+  scriptPath?: string;
+  modules?: boolean | ModuleDefinition[];
+  modulesRoot?: string;
+}
+
+interface SourceFile {
+  path?: string; // Path may be undefined if file is in-memory
+  contents: string;
+}
+
+// Try to read a file from the file-system, returning undefined if not found
+function maybeGetDiskFile(filePath: string): SourceFile | undefined {
+  try {
+    const contents = fs.readFileSync(filePath, "utf8");
+    return { path: filePath, contents };
+  } catch (e: any) {
+    // Ignore not-found errors, but throw everything else
+    if (e.code !== "ENOENT") throw e;
+  }
+}
+
+// Try to extract the path and contents of a `file` reported in a JavaScript
+// stack-trace. See the `SourceOptions` comment for examples of what these look
+// like.
+function maybeGetFile(
+  workerSrcOpts: SourceOptions[],
+  file: string
+): SourceFile | undefined {
+  // Resolve file relative to current working directory
+  const filePath = path.resolve(file);
+
+  // Cases: (g), (h)
+  // 1. If path matches any `modules` with ((g)[i], (h)[i]) or without
+  //    ((g)[ii], (h)[ii]) custom `contents`, use those.
+  for (const srcOpts of workerSrcOpts) {
+    if (Array.isArray(srcOpts.modules)) {
+      const modulesRoot = srcOpts.modulesRoot;
+      // Handle cases (h)[i] and (h)[ii], by re-resolving file relative to
+      // module root if any
+      const modulesRootedFilePath =
+        modulesRoot === undefined ? filePath : path.resolve(modulesRoot, file);
+      for (const module of srcOpts.modules) {
+        if (path.resolve(module.path) === modulesRootedFilePath) {
+          if (module.contents === undefined) {
+            // Cases: (g)[ii], (h)[ii]
+            return maybeGetDiskFile(modulesRootedFilePath);
+          } else {
+            // Cases: (g)[i], (h)[i]
+            return {
+              path: modulesRootedFilePath,
+              contents: contentsToString(module.contents),
+            };
+          }
+        }
+      }
+    }
+  }
+
+  // Case: (d)
+  // 2. If path matches any `scriptPath`s with custom `script`s, use those
+  for (const srcOpts of workerSrcOpts) {
+    if (
+      srcOpts.scriptPath !== undefined &&
+      srcOpts.script !== undefined &&
+      path.resolve(srcOpts.scriptPath) === filePath
+    ) {
+      return { path: filePath, contents: srcOpts.script };
+    }
+  }
+
+  // Cases: (b), (i)[ii]
+  // 3. If file looks like "<script:n>", and the `n`th worker has a custom
+  //    `script`, use that.
+  const workerIndex = maybeGetStringScriptPathIndex(file);
+  if (workerIndex !== undefined) {
+    const srcOpts = workerSrcOpts[workerIndex];
+    if (srcOpts.script !== undefined) {
+      return { contents: srcOpts.script };
+    }
+  }
+
+  // Cases: (a), (c), (e)
+  // 4. If there is a single worker defined with `modules` disabled, the
+  //    file is "worker.js", then...
+  //
+  //    Note: can't handle case (i)[i], as cannot distinguish between multiple
+  //    "worker.js"s, hence the check for a single worker. We'd rather be
+  //    conservative and return no contents (and therefore no source code in the
+  //    error page) over incorrect ones.
+  if (workerSrcOpts.length === 1) {
+    const srcOpts = workerSrcOpts[0];
+    if (
+      file === "worker.js" &&
+      (srcOpts.modules === undefined || srcOpts.modules === false)
+    ) {
+      if (srcOpts.script !== undefined) {
+        // Cases: (a), (c)
+        // ...if a custom `script` is defined, use that, with the defined
+        // `scriptPath` if any (Case (c))
+        return {
+          path:
+            srcOpts.scriptPath === undefined
+              ? undefined
+              : path.resolve(srcOpts.scriptPath),
+          contents: srcOpts.script,
+        };
+      } else if (srcOpts.scriptPath !== undefined) {
+        // Case: (e)
+        // ...otherwise, if a `scriptPath` is defined, use that
+        return maybeGetDiskFile(path.resolve(srcOpts.scriptPath));
+      }
+    }
+  }
+
+  // Cases: (f)
+  // 5. Finally, fallback to file-system lookup
+  return maybeGetDiskFile(filePath);
+}
+
+// Try to find a source map for `sourceFile`, and update `sourceFile` and
+// `frame` with source mapped locations
+type SourceMapCache = Map<string, Promise<SourceMapConsumer>>;
+async function applySourceMaps(
+  /* mut */ sourceMapCache: SourceMapCache,
+  /* mut */ sourceFile: SourceFile,
+  /* mut */ frame: Entry
+) {
+  // If we don't have a file path, or full location, we can't do any source
+  // mapping, so return straight away.
+  // TODO: support data URIs for maps, in `sourceFile`s without path
+  if (
+    sourceFile.path === undefined ||
+    frame.line === undefined ||
+    frame.column === undefined
+  ) {
+    return;
+  }
+
+  // Find the last source mapping URL if any
+  const sourceMapRegexp = /# sourceMappingURL=(.+)/g;
+  let sourceMapMatch: RegExpMatchArray | null = null;
+  while (true) {
+    const match = sourceMapRegexp.exec(sourceFile.contents);
+    if (match !== null) sourceMapMatch = match;
+    else break;
+  }
+  // If we couldn't find a source mapping URL, there's nothing we can do
+  if (sourceMapMatch === null) return;
+
+  // Get the source map
+  const root = path.dirname(sourceFile.path);
+  const sourceMapPath = path.resolve(root, sourceMapMatch[1]);
+  let consumerPromise = sourceMapCache.get(sourceMapPath);
+  if (consumerPromise === undefined) {
+    // If we couldn't find the source map in cache, load it
+    const sourceMapFile = maybeGetDiskFile(sourceMapPath);
+    if (sourceMapFile === undefined) return;
+    const rawSourceMap = JSON.parse(sourceMapFile.contents);
+    consumerPromise = new SourceMapConsumer(rawSourceMap);
+    sourceMapCache.set(sourceMapPath, consumerPromise);
+  }
+  const consumer = await consumerPromise;
+
+  // Get original position from source map
+  const original = consumer.originalPositionFor({
+    line: frame.line,
+    column: frame.column,
+  });
+  // If source mapping failed, don't make changes
+  if (
+    original.source === null ||
+    original.line === null ||
+    original.column === null
+  ) {
+    return;
+  }
+
+  // Update source file and frame with source mapped locations
+  const newSourceFile = maybeGetDiskFile(original.source);
+  if (newSourceFile === undefined) return;
+  sourceFile.path = original.source;
+  sourceFile.contents = newSourceFile.contents;
+  frame.file = original.source;
+  frame.fileRelative = path.relative("", sourceFile.path);
+  frame.fileShort = frame.fileRelative;
+  frame.fileName = path.basename(sourceFile.path);
+  frame.line = original.line;
+  frame.column = original.column;
+}
+
+interface YouchInternalFrameSource {
+  pre: string[];
+  line: string;
+  post: string[];
+}
+interface YouchInternals {
+  options: { preLines: number; postLines: number };
+  _getFrameSource(frame: Entry): Promise<YouchInternalFrameSource | null>;
+}
+
+// Due to a bug in `workerd`, if `Promise`s returned from native C++ APIs are
+// rejected, their errors will not have `stack`s. This means we can't recover
+// the `stack` from dispatching to the user worker binding in our entry worker.
+// As a stop-gap solution, user workers should send an HTTP 500 JSON response
+// matching the schema below with the `MF-Experimental-Error-Stack` header set
+// to a truthy value, in order to display the pretty-error page.
+export const HEADER_ERROR_STACK = "MF-Experimental-Error-Stack";
+const ErrorSchema = z.object({
+  message: z.ostring(),
+  name: z.ostring(),
+  stack: z.ostring(),
+});
+export async function handlePrettyErrorRequest(
+  workerSrcOpts: SourceOptions[],
+  request: Request
+): Promise<Response> {
+  // Parse and validate the error we've been given from user code
+  const caught = ErrorSchema.parse(await request.json());
+
+  // We need to give `name`, `message` and `stack` to Youch, but StackTracy,
+  // Youch's dependency for parsing `stack`s, will only extract `stack` from
+  // an object if it's an `instanceof Error`.
+  const error = new Error();
+  error.name = caught.name as string;
+  error.message = caught.message as string;
+  error.stack = caught.stack;
+
+  // Create a source-map cache for this pretty-error request. We only cache per
+  // request, as it's likely the user will update their code and restart/call
+  // `setOptions` again on seeing this page. This would invalidate existing
+  // source maps. Keeping the cache per request simplifies things too.
+  const sourceMapCache: SourceMapCache = new Map();
+
+  // Lazily import `youch` when required
+  const Youch: typeof import("youch").default = require("youch");
+  const youch = new Youch(error, {
+    url: request.url,
+    method: request.method,
+    headers: Object.fromEntries(request.headers),
+  });
+  youch.addLink(() => {
+    return [
+      '<a href="https://developers.cloudflare.com/workers/" target="_blank" style="text-decoration:none">📚 Workers Docs</a>',
+      '<a href="https://discord.gg/cloudflaredev" target="_blank" style="text-decoration:none">💬 Workers Discord</a>',
+    ].join("");
+  });
+  const youchInternals = youch as unknown as YouchInternals;
+  youchInternals._getFrameSource = async (frame) => {
+    // Adapted from Youch's own implementation
+    let file = frame.file
+      .replace(/dist\/webpack:\//g, "") // Unix
+      .replace(/dist\\webpack:\\/g, ""); // Windows
+    // Ignore error as frame source is optional anyway
+    try {
+      file = file.startsWith("file:") ? fileURLToPath(file) : file;
+    } catch {}
+
+    // Try get source-mapped file contents
+    const sourceFile = await maybeGetFile(workerSrcOpts, file);
+    if (sourceFile === undefined || frame.line === undefined) return null;
+    // If source-mapping fails, this function won't do anything
+    await applySourceMaps(sourceMapCache, sourceFile, frame);
+
+    // Return lines around frame as required by Youch
+    const lines = sourceFile.contents.split(/\r?\n/);
+    const line = frame.line;
+    const pre = lines.slice(
+      Math.max(0, line - (youchInternals.options.preLines + 1)),
+      line - 1
+    );
+    const post = lines.slice(line, line + youchInternals.options.postLines);
+    return { pre, line: lines[line - 1], post };
+  };
+
+  try {
+    return new Response(await youch.toHTML(), {
+      headers: { "Content-Type": "text/html;charset=utf-8" },
+    });
+  } finally {
+    // Clean-up source-map cache
+    for (const consumer of sourceMapCache.values()) (await consumer).destroy();
+  }
+}