@uniflowed/router 0.0.0-alpha.34 → 0.0.0-alpha.37

package/internal/server-route.js

@@ -0,0 +1,58 @@
+// @flow
+//
+// Internal to `@uniflowed/router`: the route a server component is rendering in.
+//
+// `useRoute()` in the browser reads the router's context, and a server
+// component has no context to read. The graph it renders in resolves `react`
+// under the `react-server` condition, which is the build with no `useContext`
+// in it (ubugeeei-prod/uf#519), and a layout that highlights the section it is
+// in — this repository's own documentation site has two — would otherwise have
+// to become a client component to find out where it is.
+//
+// So the Flight renderer runs each render inside a store holding the route it
+// resolved, and the server half of the hooks reads it back. `AsyncLocalStorage`
+// and not React's `cache`: `cache` finds its render through React's own request
+// storage, which the build React ships for Deno does not have, so after the
+// first `await` in an async server component it would stop finding the render
+// at all. A store of this module's own follows every continuation of the
+// render on every host `@uniflowed/server` already runs on, and it is one value
+// per render, so two requests in flight cannot read each other's route.
+//
+// Server-only by construction: nothing in the browser's graph imports this.
+
+import { AsyncLocalStorage } from "node:async_hooks";
+
+import type { RouteState } from "./flight.js";
+import { requireServerComponentsReact } from "./react-version.js";
+
+const storage: AsyncLocalStorage<RouteState> = new AsyncLocalStorage();
+
+/** Run `body` as a render of `route`. Everything it starts sees the route. */
+export function withServerRoute<T>(route: RouteState, body: () => T): T {
+  return storage.run(route, body);
+}
+
+/**
+ * The route being rendered, or a refusal naming the caller.
+ *
+ * A refusal rather than `null`, because the only way to arrive here without a
+ * route is to call a router hook from a server module that is not being
+ * rendered by the router — a script, a route handler, a module evaluated at
+ * import time — and each of those is a mistake worth a sentence.
+ *
+ * The React version is checked first. On a React older than 19.3 the Flight
+ * renderer that would have put the hook inside a route refuses to start, so the
+ * sentence worth reading is that one, not "outside a route".
+ */
+export function serverRoute(caller: string): RouteState {
+  requireServerComponentsReact(`${caller}()`);
+  const route = storage.getStore();
+  if (route == null) {
+    throw new Error(
+      `@uniflowed/router: ${caller}() was called in a server module outside a route the router ` +
+        "is rendering. Server Components read the route they render in; a route handler reads " +
+        "the request it was given, and a module evaluated at import time has no route at all.",
+    );
+  }
+  return route;
+}

package/internal/shell.js

@@ -0,0 +1,107 @@
+// @flow
+//
+// Internal to `@uniflowed/router`: the documents an HTML renderer answers with
+// that are not a route's own markup — uf's shell around that markup, and a
+// redirect.
+//
+// `../server.js` renders a route from its modules, and `../rsc-ssr.js` renders
+// one from the payload React Server Components wrote. They are two entries so
+// that the second, which loads React's Flight client, stays out of every bundle
+// that renders no Server Component (ubugeeei-prod/uf#992). Both write the same
+// documents around what they render, which is why those documents live here and
+// not in either entry.
+
+import type { PrerenderResult, RenderAssets, RenderResult } from "../server.js";
+import { addressOf } from "./base-path.js";
+import { ROOT_ID } from "./document.js";
+import type { RedirectError } from "./routing.js";
+import { type DocumentShell, bodyOfText } from "./stream.js";
+
+/** A redirect, as the finished document `prerender` answers with. */
+export async function redirectResult(document: RenderResult): Promise<PrerenderResult> {
+  return {
+    status: document.status,
+    headers: document.headers,
+    html: await document.text(),
+  };
+}
+
+export function redirectDocument(error: RedirectError): RenderResult {
+  // Under `app.router.basePath`, and in the trailing-slash policy's spelling:
+  // `redirect("/sign-in")` names an application path, and a browser follows
+  // an address.
+  const address = addressOf(error.to);
+  const target = escapeAttribute(address);
+  // A document rather than an empty body, because a redirect is still an answer
+  // a browser may be shown; it goes through the same three methods as a
+  // rendered one so that a host has one shape to write, not two.
+  const body = bodyOfText(
+    `<!doctype html><html><head><meta charset="utf-8"><meta http-equiv="refresh" content="0; url=${target}"><title>Redirecting</title></head><body><a href="${target}">Redirecting…</a></body></html>\n`,
+  );
+  return {
+    status: error.permanent ? 308 : 307,
+    headers: { Location: address },
+    pipe: body.pipe,
+    stream: body.stream,
+    text: body.text,
+  };
+}
+
+/**
+ * The document uf writes around the app's markup.
+ *
+ * The same two shapes `assemble` chose between, decided from the same evidence
+ * — whether the markup opens with `<html>` — but stated up front instead of
+ * afterwards, because a stream has no "afterwards" in which to splice a head.
+ * An app whose root layout renders `<html>` owns the whole document and the
+ * client hydrates `document`, so uf contributes only the tags that go before
+ * `</head>`. An app that renders only content is wrapped in a minimal shell
+ * around `<div id="uf-root">`, which is what the client hydrates instead.
+ *
+ * `internal/stream.js` picks between them on the opening bytes React writes;
+ * everything either shape is made of is here, so what a uf document contains is
+ * still readable in one place.
+ *
+ * # Why the shell is three strings and not one
+ *
+ * Because uf's own `<head>` has to still be open when React's head tags arrive.
+ * React hoists a `<title>`, a `<meta>` and a `<link>` into the head it wrote
+ * itself, and here it wrote none — so with one string this shell closed its
+ * head before the app had rendered a byte, and every `og:` tag and the
+ * `<link rel="canonical">` landed in the body, where a crawler ignores them.
+ * `open` is uf's head up to that point, `body` is the rest of it and the
+ * wrapper, and what goes between them is whatever `assembled` lifts out of the
+ * app's own markup. See ubugeeei-prod/uf#547.
+ *
+ * That is also why no `<title>` is written here any more. It was, from
+ * `resolved.metadata.title` — the same string `Head` renders — so a document
+ * carried two of them, one in each place, and only one was where a browser
+ * looks. Hoisting the rendered one leaves the metadata with a single source.
+ */
+export function shellFor(assets: RenderAssets): DocumentShell {
+  const head = headTags(assets);
+  return {
+    head,
+    open: `<!doctype html>\n<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">`,
+    body: `${head}</head><body><div id="${ROOT_ID}">`,
+    close: `</div></body></html>\n`,
+  };
+}
+
+function headTags(assets: RenderAssets): string {
+  let tags = "";
+  for (const href of assets.styles) {
+    tags += `<link rel="stylesheet" href="${escapeAttribute(href)}">`;
+  }
+  for (const href of assets.preloads) {
+    tags += `<link rel="modulepreload" href="${escapeAttribute(href)}">`;
+  }
+  for (const src of assets.scripts) {
+    tags += `<script type="module" src="${escapeAttribute(src)}"></script>`;
+  }
+  return tags;
+}
+
+function escapeAttribute(value: string): string {
+  return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;");
+}

package/internal/stream.js

@@ -43,6 +43,7 @@ import * as React from "react";
 import * as ReactDOMServer from "react-dom/server";
 import * as ReactDOMStatic from "react-dom/static";
 
+import { createChunkEncoder } from "./flight-chunks.js";
 import { type StreamRecord, inspected } from "./inspector.js";
 
 /**
@@ -656,6 +657,16 @@ export type RenderOptions = {|
    * everything before it writes a byte, so there is no order to report.
    */
   readonly onStream?: (record: StreamRecord) => void,
+  /**
+   * The Flight payload this document's tree was read from, to write into the
+   * document for the browser to hydrate from.
+   *
+   * Absent for a document rendered from the route's modules, which is what
+   * every document was before ubugeeei-prod/uf#519 and what `app.rsc: false`
+   * still asks for. Present, it is copied into the document as it arrives, by
+   * [`interleaved`], which says where it may and may not go.
+   */
+  readonly payload?: ReadableStream<Uint8Array>,
 |};
 
 /**
@@ -692,7 +703,10 @@ export function renderDocument(node: React.Node, options: RenderOptions): Promis
           resolve(
             bodyOf(
               outgoing(
-                assembled(queue.chunks(), options.shell, options.transformHead),
+                withPayload(
+                  assembled(queue.chunks(), options.shell, options.transformHead),
+                  options.payload,
+                ),
                 options.onStream,
               ),
               () => abort(),
@@ -759,7 +773,10 @@ export function renderWithReadableStream(
     (stream: ByteSource) =>
       bodyOf(
         outgoing(
-          assembled(decoded(stream), options.shell, options.transformHead),
+          withPayload(
+            assembled(decoded(stream), options.shell, options.transformHead),
+            options.payload,
+          ),
           options.onStream,
         ),
         () => {
@@ -815,10 +832,206 @@ export async function prerenderDocument(node: React.Node, options: RenderOptions
       ? await ReactDOMStatic.prerenderToNodeStream(node, settings)
       : await ReactDOMStatic.prerender(node, settings);
   return bodyOf(
-    assembled(preludeChunks(result.prelude), options.shell, options.transformHead),
+    withPayload(
+      assembled(preludeChunks(result.prelude), options.shell, options.transformHead),
+      options.payload,
+    ),
   ).text();
 }
 
+/** `chunks` unchanged when there is no payload, and [`interleaved`] with one. */
+function withPayload(
+  chunks: AsyncGenerator<string, void, void>,
+  payload: ?ReadableStream<Uint8Array>,
+): AsyncGenerator<string, void, void> {
+  return payload == null ? chunks : interleaved(chunks, payload);
+}
+
+/**
+ * A document's chunks, with the Flight payload it was rendered from written
+ * into it as it arrives.
+ *
+ * Four rules, and each is the answer to a way the obvious version is wrong.
+ *
+ * **Nothing before the head.** The first chunk this is handed is the whole
+ * opening of the document — `assembled` does not let one go until the head is
+ * complete — and a payload element written in front of it would sit before
+ * `<head>`, where the parser would open a body for it and every tag after it
+ * would land in the wrong element.
+ *
+ * **Written as soon as it exists.** A payload row usually exists before the
+ * HTML rendered from it — React's client reads the row, then the boundary
+ * renders — so waiting for the next HTML chunk would put the browser's copy
+ * behind the markup it hydrates. Each HTML chunk that ends between elements is
+ * followed by whatever payload is waiting, and a payload that arrives while the
+ * HTML is idle there is written then, without a chunk of HTML to follow.
+ *
+ * **Only between elements.** React hands its HTML on through a fixed-size
+ * buffer, so a chunk can end anywhere: inside a tag, an attribute's value, a
+ * comment, a character reference or an inline `<script>`. A payload element
+ * written after such a chunk is not an element. It is part of the attribute,
+ * the comment or the text it landed in, the browser never reads it, and React's
+ * client closes the payload with rows missing, which is the "Connection closed"
+ * a page reports instead of hydrating. So a waiting payload goes out only where
+ * the HTML written so far ends between elements, which [`advanced`] follows
+ * from chunk to chunk, and otherwise waits for the HTML that finishes what is
+ * open.
+ *
+ * **`</body></html>` waits for the end of the payload.** The HTML can finish
+ * first — the last boundary's markup is rendered from rows that are already
+ * written — and a payload element after `</html>` is one the parser moves
+ * rather than one React expects. So the closing tags are held back, the rest of
+ * the payload and its end marker are written, and the tags go last. For a
+ * document uf wraps, the closing run is `</div></body></html>`, and only the
+ * part from `</body>` is held: the root element React hydrates must hold
+ * nothing React did not render.
+ *
+ * A consumer that stops early stops the payload too: the reader is cancelled
+ * in the `finally`, which is where `return()` on this generator lands.
+ */
+async function* interleaved(
+  chunks: AsyncGenerator<string, void, void>,
+  payload: ReadableStream<Uint8Array>,
+): AsyncGenerator<string, void, void> {
+  const encoder = createChunkEncoder();
+  const reader = payload.getReader();
+  let written = "";
+  let ended = false;
+  let wake: ?() => void = null;
+  const ring = () => {
+    const resume = wake;
+    wake = null;
+    if (resume != null) {
+      resume();
+    }
+  };
+  const pumping = (async () => {
+    try {
+      while (true) {
+        const step = await reader.read();
+        if (step.done === true) {
+          break;
+        }
+        if (step.value != null) {
+          written += encoder.encode(step.value);
+          ring();
+        }
+      }
+    } catch {
+      // A payload that failed partway is still ended, with the end marker, so
+      // the browser's reader closes and React reports the rows it never got
+      // rather than waiting for them for as long as the page is open.
+    } finally {
+      written += encoder.end();
+      ended = true;
+      ring();
+    }
+  })();
+
+  // Nothing written yet, and nothing may go before the head.
+  let boundary: Boundary = NOTHING_WRITTEN;
+  let closing = "";
+  try {
+    let next = chunks.next();
+    while (true) {
+      if (boundary.safe && written !== "") {
+        const out = written;
+        written = "";
+        yield out;
+      }
+      const idle = new Promise<null>((resolve) => {
+        wake = () => resolve(null);
+      });
+      const outcome = await Promise.race([next, idle]);
+      if (outcome == null) {
+        continue;
+      }
+      if (outcome.done === true) {
+        break;
+      }
+      let text = outcome.value;
+      const close = text.search(/<\/body>\s*<\/html>\s*$/i);
+      if (close !== -1) {
+        closing = text.slice(close);
+        text = text.slice(0, close);
+      }
+      if (text !== "") {
+        yield text;
+        boundary = advanced(boundary, text);
+      }
+      next = chunks.next();
+    }
+    while (!ended || written !== "") {
+      if (written !== "") {
+        const out = written;
+        written = "";
+        yield out;
+        continue;
+      }
+      await new Promise<void>((resolve) => {
+        wake = resolve;
+        if (ended || written !== "") {
+          ring();
+        }
+      });
+    }
+    await pumping;
+    yield closing;
+  } finally {
+    if (!ended) {
+      void reader.cancel();
+    }
+  }
+}
+
+/** Where the HTML written so far leaves the next payload element. */
+type Boundary = {|
+  /** Whether a payload element may be written now. */
+  readonly safe: boolean,
+  /** The `script` or `style` element the HTML is inside, if it is inside one. */
+  readonly rawText: string | null,
+  /** A tag, or a comment, the HTML has started and not yet finished. */
+  readonly open: string,
+|};
+
+const NOTHING_WRITTEN: Boundary = { safe: false, rawText: null, open: "" };
+
+/**
+ * `boundary`, once `html` has been written after it.
+ *
+ * A payload element may follow HTML that ends with a `>` outside a `<script>`
+ * and a `<style>`. The test can be that short because React wrote the HTML: it
+ * escapes `<` and `>` in text and in attribute values, so a `>` it wrote closes
+ * a tag or a comment, and HTML that ends any other way ends inside one, or
+ * inside a character reference or a run of text. What React does not escape is
+ * the content of an inline script or stylesheet, where a `>` is code, so an
+ * opening `<script>` or `<style>` is followed to its closing tag. A tag split
+ * across two chunks is carried in `open` and read whole with the next one.
+ */
+function advanced(boundary: Boundary, html: string): Boundary {
+  const text = boundary.open + html;
+  let rawText = boundary.rawText;
+  const tags = /<(\/?)(script|style)(?=[\s/>])[^>]*>/gi;
+  let tag = tags.exec(text);
+  while (tag != null) {
+    const name = tag[2].toLowerCase();
+    if (tag[1] === "/") {
+      if (rawText === name) {
+        rawText = null;
+      }
+    } else if (rawText == null) {
+      rawText = name;
+    }
+    tag = tags.exec(text);
+  }
+  const start = text.lastIndexOf("<");
+  return {
+    safe: rawText == null && text.endsWith(">"),
+    rawText,
+    open: start > text.lastIndexOf(">") ? text.slice(start) : "",
+  };
+}
+
 /**
  * The prelude of a static prerender, whichever stream this build produced.
  *

package/middleware.js

@@ -27,10 +27,38 @@
 // that could only observe would not be able to reject, and one that had to
 // answer could not be a logger.
 //
-// There is no `next()` and no way to rewrite the request. Rewriting needs a
-// spelling — a returned `Request`, or a `next(request)` argument — and picking
-// one badly is harder to undo than not having it, so it is not spelled here
-// yet. What exists answers or continues, and says so.
+// There is no `next()`. A third answer is `rewrite(destination)`: serve another
+// route of this application at the address the visitor asked for.
+//
+//   // app/$middleware.js
+//   import { rewrite } from "@uniflowed/router/middleware";
+//
+//   export default function middleware(request: Request) {
+//     if (cookies().get("beta") != null) return rewrite("/beta" + new URL(request.url).pathname);
+//   }
+//
+// A returned value rather than a returned `Request`, which was the other
+// spelling on the table. A `Request` could change the method and the headers
+// too, and `headers()` reads the request the host began — so a middleware that
+// added a header would have handed the page one set of headers and `headers()`
+// another. A rewrite changes the path, the query when it names one, and
+// nothing else.
+//
+// # A rewrite runs the destination's middleware
+//
+// The chain starts again from the root over the middleware that has not run
+// yet, against the new path. So a rewrite into `/admin` passes the guard on
+// `/admin` exactly as a request for it would, and is never an unguarded way to
+// a guarded page; a middleware that already ran for this request does not run
+// a second time, which is also what makes the loop finite.
+//
+// # A payload request is its document
+//
+// A browser navigating a React Server Components application asks for
+// `/pricing/__uf.flight` rather than `/pricing`. The chain is matched against,
+// and every middleware is handed, the document's URL — so the check a
+// middleware writes against `/pricing` holds for a client navigation too, and
+// a rewrite of the document becomes a rewrite of its payload.
 //
 // # The request it runs inside
 //
@@ -68,6 +96,7 @@
 // `routesModuleSource` keeps the middleware table in an export the client
 // never imports, for the same reason it does that with route handlers.
 
+import { documentPathOf, flightUrl } from "./internal/flight.js";
 import { requireRequest } from "./internal/request.js";
 import type { RouteParams } from "./internal/runtime.js";
 
@@ -79,11 +108,39 @@ export type MiddlewareContext = {|
   readonly searchParams: URLSearchParams,
 |};
 
+/**
+ * What a middleware returns to serve another route at the requested address.
+ *
+ * Built by [`rewrite`] and read by the runner; a class so that the runner can
+ * tell it from a `Response` without trusting the shape of an object.
+ */
+export class Rewrite {
+  readonly destination: string;
+
+  constructor(destination: string) {
+    this.destination = destination;
+  }
+}
+
+/**
+ * Serve `destination` — a path of this application — in place of the path the
+ * request named.
+ *
+ * Relative to the request, so `"/beta/pricing"` and `"../pricing"` both work.
+ * A destination that names no query keeps the request's; one that names a
+ * query replaces it. Another origin is refused when the middleware returns it:
+ * sending a visitor elsewhere is `Response.redirect`, and proxying to another
+ * server is a route handler that fetches.
+ */
+export function rewrite(destination: string | URL): Rewrite {
+  return new Rewrite(typeof destination === "string" ? destination : destination.href);
+}
+
 /** One middleware function. */
 export type Middleware = (
   request: Request,
   context: MiddlewareContext,
-) => Response | void | Promise<Response | void>;
+) => Response | Rewrite | void | Promise<Response | Rewrite | void>;
 
 /** A middleware module, as the generated table loads it. */
 export type MiddlewareModule = { readonly [name: string]: mixed };
@@ -100,7 +157,10 @@ export type MiddlewareRecord = {|
  * Build the middleware runner for one application.
  *
  * Returns `null` when every middleware on the path declined, which is the
- * caller's signal to carry on to the handler or the page.
+ * caller's signal to carry on to the handler or the page. Returns a `Request`
+ * when one of them rewrote: the same request at the destination, which the
+ * caller carries on with instead — and which has already been past the
+ * destination's middleware.
  *
  * The runner is called once per request, above both the dispatcher and the
  * renderer, rather than from inside each of them. Putting the call inside
@@ -112,7 +172,7 @@ export type MiddlewareRecord = {|
  */
 export function createMiddlewareRunner(options: {|
   readonly middleware: $ReadOnlyArray<MiddlewareRecord>,
-|}): (request: Request) => Promise<Response | null> {
+|}): (request: Request) => Promise<Response | Request | null> {
   // Root first, so an application-wide check runs before the one that guards a
   // section of it. A shorter path is always an ancestor of a longer one that
   // also matched, so segment count is the whole of the ordering.
@@ -120,7 +180,7 @@ export function createMiddlewareRunner(options: {|
     (a, b) => segmentsOf(a.path).length - segmentsOf(b.path).length,
   );
 
-  return async function runMiddleware(request: Request): Promise<Response | null> {
+  return async function runMiddleware(request: Request): Promise<Response | Request | null> {
     // Checked rather than assumed, and checked before the table so that a host
     // is caught on its first request whether or not this project happens to
     // have a middleware. `createApplicationHandler` makes the same argument
@@ -138,13 +198,26 @@ export function createMiddlewareRunner(options: {|
       return null;
     }
 
-    const url = new URL(request.url);
+    const arrived = new URL(request.url);
+    const document = documentPathOf(arrived.pathname);
+    // The URL the chain is matched against and every middleware is handed: the
+    // document's, for a payload request. See "A payload request is its
+    // document" above.
+    let url = document == null ? arrived : withPathname(arrived, document);
+    let seen = document == null ? request : requestAt(request, url);
+    let rewritten = false;
+    const ran: Set<MiddlewareRecord> = new Set();
 
-    for (const record of table) {
+    for (let index = 0; index < table.length; index += 1) {
+      const record = table[index];
+      if (ran.has(record)) {
+        continue;
+      }
       const params = matchPrefix(record.path, url.pathname);
       if (params == null) {
         continue;
       }
+      ran.add(record);
 
       const middleware = pick(await record.load(), record.file);
       // In the host's context, not one of this module's own. Two middleware on
@@ -152,16 +225,71 @@ export function createMiddlewareRunner(options: {|
       // underneath them: `draftMode().isEnabled` is one answer for the whole
       // request, and every `after()` on the request lands in one ordered list
       // that the host drains once, after the response has gone.
-      const result = await middleware(request, { params, searchParams: url.searchParams });
-      if (result != null) {
-        return result;
+      const result = await middleware(seen, { params, searchParams: url.searchParams });
+      if (result == null) {
+        continue;
+      }
+      if (result instanceof Rewrite) {
+        url = destinationOf(result.destination, url, record.file);
+        seen = requestAt(seen, url);
+        rewritten = true;
+        // From the root again, over what has not run: the destination's guards
+        // are owed their say, and the ones that already had it are not asked
+        // twice.
+        index = -1;
+        continue;
       }
+      return result;
     }
 
-    return null;
+    if (!rewritten) {
+      return null;
+    }
+    return document == null
+      ? seen
+      : requestAt(seen, new URL(flightUrl(url.pathname + url.search), url));
   };
 }
 
+/**
+ * Where a rewrite goes, resolved against the URL the middleware was handed.
+ *
+ * Refused by name when it leaves the origin, because the one thing a rewrite
+ * promises is that this application answers.
+ */
+function destinationOf(destination: string, base: URL, file: string): URL {
+  const next = new URL(destination, base);
+  if (next.origin !== base.origin) {
+    throw new Error(
+      `${file} rewrote ${base.pathname} to ${destination}, which is another origin. A rewrite ` +
+        "serves another route of this application: answer with `Response.redirect` to send the " +
+        "visitor elsewhere, or fetch the other server from a route handler.",
+    );
+  }
+  if (!destination.includes("?")) {
+    next.search = base.search;
+  }
+  next.hash = "";
+  return next;
+}
+
+function withPathname(url: URL, pathname: string): URL {
+  const next = new URL(url.href);
+  next.pathname = pathname;
+  return next;
+}
+
+/**
+ * `request` at another URL: same method, headers, signal and body.
+ *
+ * A `Request` is a valid `RequestInit`, so a streamed body is handed on rather
+ * than read.
+ */
+function requestAt(request: Request, url: URL): Request {
+  // $FlowFixMe[incompatible-call] - a `Request` is read as the `RequestInit` it satisfies.
+  return new Request(url.href, request);
+}
+
 /**
  * The function a middleware module exports.
  *
@@ -171,6 +299,8 @@ export function createMiddlewareRunner(options: {|
  * ignored is the bug this whole module exists to stop happening.
  */
 function pick(module: MiddlewareModule, file: string): Middleware {
+  // `rewrite` is an export a middleware module may well import, and is never
+  // the middleware itself.
   const exported = typeof module.default === "function" ? module.default : module.middleware;
   if (typeof exported !== "function") {
     throw new Error(