@blotch/rsbuild-plugin-angular-lynx 22.2.2 → 22.2.3

package/README.md

@@ -52,4 +52,4 @@ Media and fonts aren't counted. Under plain `rspeedy dev` budgets are skipped: t
 
 ## Documentation
 
-Full docs at [angularlynx.dev](https://angularlynx.dev).
+Full docs at [angularlynx.js.org](https://angularlynx.js.org).

package/dist/544.js

@@ -0,0 +1,21 @@
+const HMR_FETCH = 'AngularLynx.HmrFetch';
+const HMR_FETCH_RESULT = 'AngularLynx.HmrFetchResult';
+const HMR_CHECK = 'AngularLynx.HmrCheck';
+const HMR_CHECK_RESULT = 'AngularLynx.HmrCheckResult';
+const HMR_RELOAD = 'AngularLynx.HmrReload';
+const send = (context, type, message)=>{
+    context.dispatchEvent({
+        type,
+        data: JSON.stringify(message)
+    });
+};
+const listen = (context, type, listener)=>{
+    context.addEventListener(type, (event)=>listener(JSON.parse(event.data)));
+};
+const formatError = (error)=>{
+    if (!(error instanceof Error)) return String(error);
+    const heading = `${error.name}: ${error.message}`;
+    if (!error.stack) return heading;
+    return error.stack.startsWith(heading) ? error.stack : `${heading}\n${error.stack}`;
+};
+export { HMR_CHECK, HMR_CHECK_RESULT, HMR_FETCH, HMR_FETCH_RESULT, HMR_RELOAD, formatError, listen, send };

package/dist/angular-rebuild-coordinator.d.ts

@@ -18,7 +18,7 @@ export type AngularCompileResult = {
     /**
      * Every file the compilation read: program sources plus component
      * resources such as external templates and stylesheets. Changes to any
-     * other non-TypeScript file (global CSS, assets, the scoped-CSS cache this
+     * other non-TypeScript file (global CSS, assets, the component-CSS cache this
      * plugin writes itself) can't affect Angular's output, so they don't
      * trigger a recompile.
      */

package/dist/angular.d.ts

@@ -1,5 +1,6 @@
 import type { RsbuildPluginAPI } from '@lynx-js/rspeedy';
-import type { PluginAngularLynxOptions } from './utils/options.js';
+import type { BackgroundEntries } from './background-entry.js';
+import type { NormalizedPluginAngularLynxOptions } from './utils/options.js';
 /**
  * Wires Angular's AOT/JIT compilation pipeline into the rsbuild/rspack build
  * graph. This is the heart of the AngularLynx build — it bridges three worlds:
@@ -29,4 +30,4 @@ import type { PluginAngularLynxOptions } from './utils/options.js';
  * string transform (import-prepend + ɵcmp.id + worklet) to
  * `buildTransformedCode` in transform-module.ts.
  */
-export declare const applyAngularRules: (api: RsbuildPluginAPI, pluginOptions: Required<PluginAngularLynxOptions>) => Promise<void>;
+export declare const applyAngularRules: (api: RsbuildPluginAPI, pluginOptions: NormalizedPluginAngularLynxOptions, backgroundEntries: BackgroundEntries, appEntries: ReadonlySet<string>) => Promise<void>;

package/dist/background-entry.d.ts

@@ -0,0 +1,96 @@
+/**
+ * The background half of each bundle starts from a module this file
+ * generates, not from the app's own entry.
+ *
+ * Angular runs on the main thread only (issue #81). The background thread
+ * needs three things from the bundle:
+ *
+ * - **the runtime**, whose module-level code installs the background half of
+ *   each bridge (the call relay, the log relay, the exposure bridge and so on);
+ * - **each module-level `backgroundFn()`**, so the function registers there;
+ * - **each module-level `createMainThreadRef()` / `new MainThreadRef()`**, so a
+ *   ref the main thread passes to a background function arrives as the
+ *   background thread's copy.
+ *
+ * Starting from `main.ts` reached every component, the router and Angular
+ * itself, which the background thread evaluated on every launch and never ran
+ * (issue #84). The generated entry imports the runtime and the modules that
+ * make those calls, and nothing else. They load at startup, so a background
+ * function in a lazy route's file is there before the route is.
+ *
+ * The modules are the app's own files, found in Angular's compiled output, and
+ * the files of any installed package that depends on the runtime (see
+ * {@link findLibraryBackgroundModules}).
+ */
+export type BackgroundEntries = {
+    /**
+     * The file the background half of `entryName` starts from, in
+     * `environmentName`. Created with the runtime alone if it doesn't exist yet,
+     * so the entry resolves even before the first compile has written it.
+     */
+    fileFor: (environmentName: string, entryName: string) => string;
+    /**
+     * Whether `file` is one of the background entry's modules: a file it
+     * imports. entry.ts marks them as having side effects in the background
+     * layer, because the entry imports them only for their side effects and a
+     * package's `"sideEffects": false` would otherwise drop them.
+     */
+    isBackgroundModule: (file: string) => boolean;
+    /** Whether `file` is one of the generated entries. */
+    isEntryFile: (file: string) => boolean;
+    /**
+     * Writes `environmentName`'s entry files for the compile about to start.
+     *
+     * @returns The files whose contents changed. The caller adds them to the
+     *   compiler's `modifiedFiles`, so rspack rebuilds them in this compile.
+     */
+    update: (environmentName: string, options: {
+        /** The app's modules that define a cross-thread value. */
+        appModules: Iterable<string>;
+        /**
+         * Set for a watch build's compiles. The entry then also changes on every
+         * compile with {@link rebuilt} set: see {@link renderBackgroundEntry}.
+         */
+        watch: boolean;
+        /** Whether something the bundle is built from changed. */
+        rebuilt: boolean;
+    }) => string[];
+};
+export declare const createBackgroundEntries: ({ rootPath, findLibraryModules, }: {
+    rootPath: string;
+    findLibraryModules?: (rootPath: string) => string[];
+}) => BackgroundEntries;
+/**
+ * The background entry's source.
+ *
+ * @param options.modules - The files to import, in order.
+ * @param options.rebuild - In a watch build, the number of compiles so far
+ *   that rebuilt something. It's written into the entry so that every such
+ *   compile changes the background bundle. The main thread doesn't run
+ *   webpack's HMR runtime (issue #9), so a hot update only reaches the
+ *   background thread, and an edit to a component would otherwise give it
+ *   nothing to apply: the HMR client would report the app up to date and keep
+ *   showing the old screen. With the entry changed, the update reaches a
+ *   module that doesn't accept it, so it aborts, and the client falls back to
+ *   a full reload, as it did when the background bundle held the whole app.
+ */
+export declare const renderBackgroundEntry: ({ modules, rebuild, }: {
+    modules: readonly string[];
+    rebuild?: number;
+}) => string;
+/**
+ * The files in installed packages that define a cross-thread value at module
+ * level, such as a UI library with its own background functions.
+ *
+ * A package can only call the runtime's functions if it depends on the runtime,
+ * so only the packages whose `package.json` lists `@blotch/angular-lynx` (as a
+ * dependency, peer dependency or optional dependency) are read: every one of
+ * their JavaScript files, outside nested `node_modules` folders. Packages are
+ * found by walking the dependencies from the app's `package.json`, resolved as
+ * Node does, so a nested or hoisted copy is found where the app's build
+ * finds it.
+ *
+ * @param rootPath - The app's directory, which holds its `package.json`.
+ * @returns The files' real paths, sorted.
+ */
+export declare const findLibraryBackgroundModules: (rootPath: string) => string[];

package/dist/client/background-hot-updates.d.ts

@@ -0,0 +1,50 @@
+import { type HotApi, type ThreadContext } from './hmr-protocol.js';
+/**
+ * How long the background thread waits for the main thread to apply an
+ * update. A main thread without the client, or one stuck in a module that
+ * never returns, would otherwise block every later update.
+ */
+export declare const MAIN_THREAD_TIMEOUT_MS = 60000;
+type Log = (level: 'info' | 'warning', message: string) => void;
+export type BackgroundHotUpdatesOptions = {
+    /** The background thread's `import.meta.webpackHot`. */
+    hot: HotApi;
+    /** Where the dev transport announces each new build's hash. */
+    emitter: {
+        on(event: 'webpackHotUpdate', listener: (hash: string) => void): void;
+    };
+    /** The hash of the code the background thread runs, `__webpack_hash__`. */
+    currentHash: () => string;
+    /** Lynx's `getCoreContext()`, which reaches the main thread. */
+    context: ThreadContext;
+    fetch: (url: string) => Promise<{
+        status: number;
+        text(): Promise<string>;
+    }>;
+    /** Reloads the whole page, through Lynx DevTool. */
+    reloadPage: () => void;
+    log: Log;
+    logApplyResult: (updatedModules: (string | number)[], renewedModules: (string | number)[]) => void;
+};
+/**
+ * Applies hot updates on both threads, replacing `@rspack/core/hot/dev-server`
+ * on the background thread.
+ *
+ * Webpack's hot update client runs on the background thread, where the dev
+ * server's connection is, and only updates the code there. But on Lynx the
+ * app runs on the main thread, which has no network access of its own (its
+ * `fetch` is the runtime's relay to this thread). So for each new
+ * build this:
+ *
+ * 1. applies the update on the background thread, which registers the
+ *    updated modules' background functions again;
+ * 2. asks the main thread to apply its own half of the update (see
+ *    main-thread-hot-updates.ts), and fetches the files it needs for it;
+ * 3. falls back to a full page reload if either thread can't apply it, so the
+ *    screen never keeps showing old code.
+ *
+ * The background thread goes first so that a background function the updated
+ * app calls straight away is already the new one.
+ */
+export declare const startBackgroundHotUpdates: ({ hot, emitter, currentHash, context, fetch, reloadPage, log, logApplyResult, }: BackgroundHotUpdatesOptions) => void;
+export {};

package/dist/client/background-hot-updates.js

@@ -0,0 +1,77 @@
+import { HMR_CHECK_RESULT, HMR_FETCH_RESULT, HMR_CHECK, listen, HMR_FETCH, HMR_RELOAD, send, formatError } from "../544.js";
+const MAIN_THREAD_TIMEOUT_MS = 60000;
+const startBackgroundHotUpdates = ({ hot, emitter, currentHash, context, fetch, reloadPage, log, logApplyResult })=>{
+    listen(context, HMR_FETCH, ({ id, url })=>{
+        fetch(url).then(async (response)=>({
+                id,
+                status: response.status,
+                text: await response.text()
+            })).catch((error)=>({
+                id,
+                error: formatError(error)
+            })).then((result)=>send(context, HMR_FETCH_RESULT, result));
+    });
+    const checks = new Map();
+    let nextCheckId = 0;
+    listen(context, HMR_CHECK_RESULT, (result)=>{
+        checks.get(result.id)?.(result);
+    });
+    const checkMainThread = (hash)=>{
+        const id = nextCheckId++;
+        return new Promise((resolve)=>{
+            const timer = setTimeout(()=>finish({
+                    id,
+                    ok: false,
+                    reason: `The main thread didn't apply the update within ${MAIN_THREAD_TIMEOUT_MS / 1000}s.`
+                }), MAIN_THREAD_TIMEOUT_MS);
+            const finish = (result)=>{
+                clearTimeout(timer);
+                checks.delete(id);
+                resolve(result);
+            };
+            checks.set(id, finish);
+            send(context, HMR_CHECK, {
+                id,
+                hash
+            });
+        });
+    };
+    const fullReload = (reason)=>{
+        log('warning', '[HMR] Cannot apply update. Need to do a full reload!');
+        log('warning', `[HMR] ${reason}`);
+        reloadPage();
+    };
+    listen(context, HMR_RELOAD, ({ reason })=>fullReload(`Main thread: ${reason}`));
+    let lastHash = '';
+    let checking = false;
+    const upToDate = ()=>lastHash.includes(currentHash());
+    const check = async ()=>{
+        const hash = lastHash;
+        let updatedModules;
+        try {
+            updatedModules = await hot.check(true);
+        } catch (error) {
+            const status = hot.status();
+            if ('abort' === status || 'fail' === status) fullReload(formatError(error));
+            else log('warning', `[HMR] Update failed: ${formatError(error)}`);
+            return;
+        }
+        if (!updatedModules) return void fullReload('Cannot find update.');
+        const mainThread = await checkMainThread(hash);
+        if (!mainThread.ok) return void fullReload(`Main thread: ${mainThread.reason}`);
+        logApplyResult(updatedModules, updatedModules);
+        if (!upToDate()) return void await check();
+        log('info', '[HMR] App is up to date.');
+    };
+    emitter.on('webpackHotUpdate', (hash)=>{
+        lastHash = hash;
+        if (upToDate() || checking || 'idle' !== hot.status()) return;
+        log('info', '[HMR] Checking for updates on the server...');
+        checking = true;
+        check().finally(()=>{
+            checking = false;
+        });
+    });
+    log('info', '[HMR] Waiting for update signal from WDS...');
+};
+export { MAIN_THREAD_TIMEOUT_MS, startBackgroundHotUpdates };

package/dist/client/background-hot-updates.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/client/css-hot-update.cjs

@@ -0,0 +1,9 @@
+'use strict';
+const { createCssHotUpdate } = require('./css-hot-update.js');
+module.exports = createCssHotUpdate({
+    isMainThread: __MAIN_THREAD__,
+    lynx,
+    publicPath: __webpack_require__.p,
+    cssHotUpdateList: ()=>__webpack_require__.cssHotUpdateList,
+    flushElementTree: ()=>__FlushElementTree()
+});

package/dist/client/css-hot-update.d.ts

@@ -0,0 +1,44 @@
+import { type ThreadContext } from './hmr-protocol.js';
+/** The CSS hot update file css-extract writes for each chunk. */
+type CssHotUpdate = {
+    /** The chunk's whole stylesheet, encoded as Lynx's CSS binary in base64. */
+    content?: string;
+    /** For each CSS ID, the IDs of the stylesheets that import it. */
+    deps: Record<string, string[]>;
+};
+export type CssHotUpdateOptions = {
+    isMainThread: boolean;
+    lynx: {
+        requireModuleAsync?: (url: string, callback: (error: Error | null, update?: CssHotUpdate) => void) => void;
+        getDevtool?: () => {
+            replaceStyleSheetByIdWithBase64?: (id: number, base64: string) => void;
+        } | undefined;
+        getJSContext(): ThreadContext;
+    };
+    /** `__webpack_require__.p`, the dev server's address. */
+    publicPath: string;
+    /** `__webpack_require__.cssHotUpdateList`: each chunk's CSS update file. */
+    cssHotUpdateList: () => [chunkName: string, path: string][] | null;
+    flushElementTree: () => void;
+};
+/**
+ * Applies a stylesheet edit on the main thread. It replaces css-extract's
+ * `runtime/hotModuleReplacement.cjs` (entry.ts swaps the module), which every
+ * CSS module calls when a hot update replaces it.
+ *
+ * css-extract's version runs on the background thread: it loads the new
+ * stylesheet there and sends it to a main-thread listener React Lynx adds. In
+ * an AngularLynx app the main thread takes its own hot updates (see
+ * main-thread-hot-updates.ts), which include the CSS modules, so the stylesheet
+ * is loaded and applied there, with the same Lynx call React Lynx's listener
+ * makes. On the background thread the CSS modules do nothing.
+ *
+ * Lynx can't apply a stylesheet if `replaceStyleSheetByIdWithBase64` is
+ * missing, or the file can't be loaded. Then it asks the background thread to
+ * reload the page, rather than leave the old styles on screen.
+ *
+ * @returns css-extract's `update(moduleId, options, cssId)`, which returns the
+ *   function each CSS module calls when it's replaced.
+ */
+export declare const createCssHotUpdate: ({ isMainThread, lynx, publicPath, cssHotUpdateList, flushElementTree, }: CssHotUpdateOptions) => (_moduleId: unknown, _options: unknown, cssId?: string) => (() => void);
+export {};

package/dist/client/css-hot-update.js

@@ -0,0 +1,42 @@
+import { send, HMR_RELOAD, formatError } from "../544.js";
+const createCssHotUpdate = ({ isMainThread, lynx, publicPath, cssHotUpdateList, flushElementTree })=>{
+    const fail = (reason)=>send(lynx.getJSContext(), HMR_RELOAD, {
+            reason: `Can't apply the stylesheet update: ${reason}`
+        });
+    const apply = (update, ids)=>{
+        const { content } = update;
+        if (!content) return;
+        const devtool = lynx.getDevtool?.();
+        if (!devtool?.replaceStyleSheetByIdWithBase64) return void fail('lynx.getDevtool().replaceStyleSheetByIdWithBase64 is missing.');
+        try {
+            for (const id of ids){
+                for (const dependent of update.deps[id] ?? [])devtool.replaceStyleSheetByIdWithBase64(Number(dependent), content);
+                devtool.replaceStyleSheetByIdWithBase64(id, content);
+            }
+            flushElementTree();
+        } catch (error) {
+            fail(formatError(error));
+        }
+    };
+    const pending = new Set();
+    let timer;
+    const updateStyles = ()=>{
+        const ids = new Set(pending);
+        pending.clear();
+        timer = void 0;
+        for (const [, path] of cssHotUpdateList() ?? [])lynx.requireModuleAsync?.(publicPath + path, (error, update)=>{
+            if (error) return void fail(formatError(error));
+            apply(update, ids);
+        });
+    };
+    return (_moduleId, _options, cssId)=>{
+        if (!isMainThread) return ()=>{};
+        const id = Number(cssId || 0);
+        return ()=>{
+            pending.add(id);
+            if (void 0 !== timer) clearTimeout(timer);
+            timer = setTimeout(updateStyles, 50);
+        };
+    };
+};
+export { createCssHotUpdate };

package/dist/client/css-hot-update.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/client/hmr-background.js

@@ -0,0 +1,16 @@
+import { reloadPage } from '@lynx-js/webpack-dev-transport/reloadApp';
+import { emitter } from '@rspack/core/hot/emitter.js';
+import { logApplyResult } from '@rspack/core/hot/log-apply-result.js';
+import { log } from '@rspack/core/hot/log.js';
+import { startBackgroundHotUpdates } from './background-hot-updates.js';
+if (!import.meta.webpackHot) throw new Error('[HMR] Hot Module Replacement is disabled.');
+startBackgroundHotUpdates({
+    hot: import.meta.webpackHot,
+    emitter,
+    currentHash: ()=>__webpack_hash__,
+    context: lynx.getCoreContext(),
+    fetch: (url)=>fetch(url),
+    reloadPage,
+    log,
+    logApplyResult
+});

package/dist/client/hmr-main-thread.js

@@ -0,0 +1,9 @@
+import { startMainThreadHotUpdates } from './main-thread-hot-updates.js';
+if (!import.meta.webpackHot) throw new Error('[HMR] Hot Module Replacement is disabled.');
+startMainThreadHotUpdates({
+    hot: import.meta.webpackHot,
+    lynx,
+    context: lynx.getJSContext(),
+    currentBootstrap: ()=>globalThis.__LYNX_ANGULAR_BOOTSTRAP__,
+    appRunning: ()=>void 0 !== globalThis.__LYNX_ANGULAR_APP_REF__
+});

package/dist/client/hmr-protocol.d.ts

@@ -0,0 +1,74 @@
+/**
+ * The messages the two hot update clients exchange (hmr-background.ts and
+ * hmr-main-thread.ts). They travel over Lynx's cross-thread event channel:
+ * the background thread dispatches on `lynx.getCoreContext()` and the main
+ * thread listens on `lynx.getJSContext()`, and the reverse. Each payload is a
+ * JSON string, as in the runtime's other relays.
+ */
+/** Main → background: fetch a hot update file the main thread needs. */
+export declare const HMR_FETCH = "AngularLynx.HmrFetch";
+/** Background → main: the fetched file, or why it couldn't be fetched. */
+export declare const HMR_FETCH_RESULT = "AngularLynx.HmrFetchResult";
+/** Background → main: check for and apply the update to `hash`. */
+export declare const HMR_CHECK = "AngularLynx.HmrCheck";
+/** Main → background: whether the main thread applied it. */
+export declare const HMR_CHECK_RESULT = "AngularLynx.HmrCheckResult";
+/**
+ * Main → background: an update the main thread took in can't be shown, so
+ * reload the page. Sent by the stylesheet updater (css-hot-update.ts), which
+ * runs after the update itself has already succeeded.
+ */
+export declare const HMR_RELOAD = "AngularLynx.HmrReload";
+export type FetchRequest = {
+    id: number;
+    url: string;
+};
+export type FetchResult = {
+    id: number;
+    status: number;
+    text: string;
+} | {
+    id: number;
+    error: string;
+};
+export type CheckRequest = {
+    id: number;
+    hash: string;
+};
+export type ReloadRequest = {
+    reason: string;
+};
+/** Whether the main thread applied an update, and if not, why. */
+export type CheckOutcome = {
+    ok: true;
+    updatedModules: number;
+} | {
+    ok: false;
+    reason: string;
+};
+export type CheckResult = {
+    id: number;
+} & CheckOutcome;
+/** A thread's end of the cross-thread event channel. */
+export type ThreadContext = {
+    addEventListener(type: string, listener: (event: {
+        data: string;
+    }) => void): void;
+    dispatchEvent(event: {
+        type: string;
+        data: string;
+    }): void;
+};
+/** The parts of webpack's `module.hot` API the clients use. */
+export type HotApi = {
+    check(autoApply: true): Promise<(string | number)[] | null>;
+    status(): string;
+};
+export declare const send: (context: ThreadContext, type: string, message: object) => void;
+export declare const listen: <T>(context: ThreadContext, type: string, listener: (message: T) => void) => void;
+/**
+ * An error as text for the logs, with its stack. PrimJS, which runs the main
+ * thread, leaves the name and message out of `error.stack`, so they're added
+ * when the stack doesn't start with them.
+ */
+export declare const formatError: (error: unknown) => string;

package/dist/client/main-thread-hot-updates.d.ts

@@ -0,0 +1,40 @@
+import { type HotApi, type ThreadContext } from './hmr-protocol.js';
+/** Lynx's `requireModuleAsync`, which the hot update runtime loads with. */
+type RequireModuleAsync = (url: string, callback: (error: (Error & {
+    code?: string;
+}) | null, exports?: unknown) => void) => void;
+export type MainThreadHotUpdatesOptions = {
+    /** The main thread's `import.meta.webpackHot`. */
+    hot: HotApi;
+    /** The main thread's `lynx` global. */
+    lynx: {
+        requireModuleAsync?: RequireModuleAsync;
+    };
+    /** Lynx's `getJSContext()`, which reaches the background thread. */
+    context: ThreadContext;
+    /**
+     * Where `bootstrapApplication()` leaves its latest promise. Read through a
+     * function because each call replaces it.
+     */
+    currentBootstrap: () => unknown;
+    /** Whether an app is running: the last bootstrap succeeded. */
+    appRunning: () => boolean;
+};
+/**
+ * Applies the main thread's half of each hot update, when the background
+ * thread asks (see background-hot-updates.ts).
+ *
+ * Webpack's hot update runtime is already in the main-thread bundle, with
+ * `module.hot` on every module, but nothing ever asked it to check, and it
+ * loads updates with `lynx.requireModuleAsync()`, which the main thread
+ * doesn't have. This gives the main thread one that has the background
+ * thread fetch the file (only it has network access) and runs it here, then
+ * runs the checks.
+ *
+ * After an update, it waits for the app to bootstrap again if the update
+ * re-ran the app's entry: the old app is gone by then, so a failure has to
+ * reload the page rather than leave it blank. It reports failure too when no
+ * app is running at all.
+ */
+export declare const startMainThreadHotUpdates: ({ hot, lynx, context, currentBootstrap, appRunning, }: MainThreadHotUpdatesOptions) => void;
+export {};

package/dist/client/main-thread-hot-updates.js

@@ -0,0 +1,78 @@
+import { HMR_CHECK_RESULT, HMR_FETCH_RESULT, HMR_CHECK, send, listen, formatError, HMR_FETCH } from "../544.js";
+const evaluateChunk = (source, url)=>{
+    const module = {
+        exports: {}
+    };
+    new Function('module', 'exports', `${source}\n//# sourceURL=${url}`)(module, module.exports);
+    return module.exports;
+};
+const startMainThreadHotUpdates = ({ hot, lynx, context, currentBootstrap, appRunning })=>{
+    const fetches = new Map();
+    let nextFetchId = 0;
+    listen(context, HMR_FETCH_RESULT, (result)=>{
+        fetches.get(result.id)?.(result);
+        fetches.delete(result.id);
+    });
+    lynx.requireModuleAsync ??= (url, callback)=>{
+        const id = nextFetchId++;
+        fetches.set(id, (result)=>{
+            if ('error' in result) return void callback(new Error(`Loading ${url} failed: ${result.error}`));
+            if (404 === result.status) {
+                const error = new Error(`Cannot find module '${url}'`);
+                error.code = 'MODULE_NOT_FOUND';
+                callback(error);
+                return;
+            }
+            if (result.status >= 400) return void callback(new Error(`Loading ${url} failed with HTTP ${result.status}`));
+            let exports;
+            try {
+                exports = url.endsWith('.json') ? JSON.parse(result.text) : evaluateChunk(result.text, url);
+            } catch (error) {
+                callback(error);
+                return;
+            }
+            callback(null, exports);
+        });
+        send(context, HMR_FETCH, {
+            id,
+            url
+        });
+    };
+    const apply = async ()=>{
+        const status = hot.status();
+        if ('idle' !== status) return {
+            ok: false,
+            reason: `The hot update status is "${status}".`
+        };
+        const bootstrapBefore = currentBootstrap();
+        try {
+            const updatedModules = await hot.check(true);
+            if (!updatedModules) return {
+                ok: false,
+                reason: 'Cannot find update.'
+            };
+            const bootstrap = currentBootstrap();
+            if (bootstrap !== bootstrapBefore) await bootstrap;
+            if (!appRunning()) return {
+                ok: false,
+                reason: 'The app is not running.'
+            };
+            return {
+                ok: true,
+                updatedModules: updatedModules.length
+            };
+        } catch (error) {
+            return {
+                ok: false,
+                reason: formatError(error)
+            };
+        }
+    };
+    listen(context, HMR_CHECK, ({ id })=>{
+        apply().then((result)=>send(context, HMR_CHECK_RESULT, {
+                id,
+                ...result
+            }));
+    });
+};
+export { startMainThreadHotUpdates };

package/dist/client/main-thread-hot-updates.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/client/testing/test-context.d.ts

@@ -0,0 +1,16 @@
+import type { ThreadContext } from '../hmr-protocol.js';
+/**
+ * One thread's end of the cross-thread channel, for the client tests. It
+ * records what the code under test sends, and `receive()` plays a message
+ * from the other thread.
+ */
+export declare const createTestContext: () => {
+    context: ThreadContext;
+    sent: {
+        type: string;
+        message: any;
+    }[];
+    /** The messages of one type, in order. */
+    sentOf: (type: string) => any[];
+    receive: (type: string, message: object) => void;
+};