@modern-js/runtime 3.9.2 → 3.9.3

package/dist/esm/core/server/requestHandler.mjs

@@ -101,12 +101,14 @@ const createRequestHandler = async (handleRequest, createRequestOptions)=>{
             status: -1
         };
         const activeDeferreds = new Map();
+        const deferredScriptKeys = new Map();
         return storage.run({
             headers: headersData,
             request,
             monitors: options.monitors,
             responseProxy,
             activeDeferreds,
+            deferredScriptKeys,
             serverPayload: void 0
         }, async ()=>{
             const Root = createRoot();

package/dist/esm/core/server/stream/createReadableStream.mjs

@@ -1,4 +1,5 @@
 import { PassThrough, Readable, Transform } from "stream";
+import { StringDecoder } from "string_decoder";
 import { storage } from "@modern-js/runtime-utils/node";
 import { SSR_HYDRATION_ID_PREFIX } from "@modern-js/utils/universal/constants";
 import { ESCAPED_SHELL_STREAM_END_MARK } from "../../../common.mjs";
@@ -6,6 +7,7 @@ import { RenderLevel } from "../../constants.mjs";
 import { getGlobalInternalRuntimeContext } from "../../context/index.mjs";
 import { getMonitors } from "../../context/monitors/index.mjs";
 import { enqueueFromEntries } from "./deferredScript.mjs";
+import { DeferredScriptOutputCoordinator } from "./deferredScriptOutputCoordinator.mjs";
 import { ShellChunkStatus, getReadableStreamFromString, resolveStreamingMode } from "./shared.mjs";
 import { getTemplates } from "./template.mjs";
 const defaultExtender = {
@@ -54,7 +56,14 @@ const createReadableStreamFromElement = async (request, rootElement, options)=>{
                     entryName,
                     styledComponentsStyleTags
                 }).then(({ shellAfter, shellBefore })=>{
+                    const decoder = new StringDecoder('utf8');
                     const pendingScripts = [];
+                    const outputState = {};
+                    let deferredResolversComplete = Promise.resolve();
+                    const writeReact = (content)=>{
+                        if (!outputState.coordinator) throw new Error("Deferred script coordinator is not ready");
+                        outputState.coordinator.writeReact(content);
+                    };
                     const body = new Transform({
                         transform (chunk, _encoding, callback) {
                             try {
@@ -66,17 +75,49 @@ const createReadableStreamFromElement = async (request, rootElement, options)=>{
                                         const beforeMark = concatedChunk.slice(0, markerIndex);
                                         const afterMark = concatedChunk.slice(markerIndex + ESCAPED_SHELL_STREAM_END_MARK.length);
                                         shellChunkStatus = ShellChunkStatus.FINISH;
-                                        this.push(`${shellBefore}${beforeMark}${shellAfter}`);
-                                        if (afterMark) this.push(afterMark);
-                                        if (pendingScripts.length > 0) for (const s of pendingScripts)this.push(s);
+                                        writeReact(`${shellBefore}${beforeMark}${shellAfter}`);
+                                        if (afterMark) writeReact(afterMark);
+                                        if (outputState.coordinator) {
+                                            outputState.coordinator.markShellFinished();
+                                            for (const script of pendingScripts)outputState.coordinator.enqueueResolver(script);
+                                            pendingScripts.length = 0;
+                                        }
                                     }
-                                } else this.push(chunk);
+                                } else {
+                                    const decodedChunk = decoder.write(Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk));
+                                    writeReact(decodedChunk);
+                                }
                                 callback();
                             } catch (e) {
                                 e instanceof Error ? callback(e) : callback(new Error('Received unknown error when streaming'));
                             }
+                        },
+                        flush (callback) {
+                            try {
+                                writeReact(decoder.end());
+                            } catch (error) {
+                                callback(error instanceof Error ? error : new Error('Received unknown error when streaming'));
+                                return;
+                            }
+                            deferredResolversComplete.then(()=>{
+                                try {
+                                    outputState.coordinator?.finish();
+                                    callback();
+                                } catch (error) {
+                                    callback(error instanceof Error ? error : new Error('Received unknown error when streaming'));
+                                }
+                            }, (error)=>{
+                                callback(error instanceof Error ? error : new Error('Received unknown error when streaming'));
+                            });
                         }
                     });
+                    const coordinator = new DeferredScriptOutputCoordinator((content)=>{
+                        body.push(content);
+                    });
+                    outputState.coordinator = coordinator;
+                    body.once('close', ()=>{
+                        coordinator.abort();
+                    });
                     const passThrough = new PassThrough();
                     const stream = Readable.toWeb(body);
                     resolve(stream);
@@ -84,23 +125,25 @@ const createReadableStreamFromElement = async (request, rootElement, options)=>{
                     extenders.forEach((extender)=>{
                         if (extender.processStream) processedStream = extender.processStream(processedStream);
                     });
-                    reactStreamingPipe(passThrough);
-                    processedStream.pipe(body);
                     try {
                         const storageContext = storage.useContext?.();
                         const activeDeferreds = storageContext?.activeDeferreds;
+                        const deferredScriptKeys = storageContext?.deferredScriptKeys;
                         const entries = activeDeferreds instanceof Map ? Array.from(activeDeferreds.entries()) : [];
                         if (entries.length > 0) {
                             const enqueueScript = (s)=>{
-                                if (shellChunkStatus === ShellChunkStatus.FINISH) body.write(s);
+                                if (!outputState.coordinator) throw new Error("Deferred script coordinator is not ready");
+                                if (shellChunkStatus === ShellChunkStatus.FINISH) outputState.coordinator.enqueueResolver(s);
                                 else pendingScripts.push(s);
                             };
-                            enqueueFromEntries(entries, config.nonce, (s)=>enqueueScript(s));
+                            deferredResolversComplete = enqueueFromEntries(entries, deferredScriptKeys, config.nonce, enqueueScript);
                         }
                     } catch (err) {
                         const monitors = getMonitors();
                         monitors.error("cannot inject router data script", err);
                     }
+                    reactStreamingPipe(passThrough);
+                    processedStream.pipe(body);
                 });
             },
             onShellError (error) {

package/dist/esm/core/server/stream/createReadableStream.worker.mjs

@@ -3,6 +3,7 @@ import { storage } from "@modern-js/runtime-utils/node";
 import { ESCAPED_SHELL_STREAM_END_MARK } from "../../../common.mjs";
 import { RenderLevel } from "../../constants.mjs";
 import { enqueueFromEntries } from "./deferredScript.mjs";
+import { DeferredScriptOutputCoordinator } from "./deferredScriptOutputCoordinator.mjs";
 import { ShellChunkStatus, encodeForWebStream, getReadableStreamFromString, resolveStreamingMode } from "./shared.mjs";
 import { getTemplates } from "./template.mjs";
 const createReadableStreamFromElement = async (request, rootElement, options)=>{
@@ -35,10 +36,13 @@ const createReadableStreamFromElement = async (request, rootElement, options)=>{
         const { waitForAllReady } = resolveStreamingMode(request, forceStreamToString);
         if (waitForAllReady) await readableOriginal.allReady;
         const reader = readableOriginal.getReader();
+        let coordinator;
         const stream = new ReadableStream({
             start (controller) {
+                const decoder = new TextDecoder();
                 const pendingScripts = [];
                 let isClosed = false;
+                let deferredResolversComplete = Promise.resolve();
                 const safeEnqueue = (chunk)=>{
                     if (isClosed) return;
                     try {
@@ -55,38 +59,55 @@ const createReadableStreamFromElement = async (request, rootElement, options)=>{
                         } catch  {}
                     }
                 };
-                const flushPendingScripts = ()=>{
-                    for (const s of pendingScripts)safeEnqueue(encodeForWebStream(s));
-                    pendingScripts.length = 0;
-                };
-                const enqueueScript = (script)=>{
-                    if (shellChunkStatus === ShellChunkStatus.FINISH) safeEnqueue(encodeForWebStream(script));
-                    else pendingScripts.push(script);
-                };
+                coordinator = new DeferredScriptOutputCoordinator((content)=>{
+                    safeEnqueue(encodeForWebStream(content));
+                });
                 const storageContext = storage.useContext?.();
                 const activeDeferreds = storageContext?.activeDeferreds;
+                const deferredScriptKeys = storageContext?.deferredScriptKeys;
                 const entries = activeDeferreds instanceof Map ? Array.from(activeDeferreds.entries()) : [];
-                if (entries.length > 0) enqueueFromEntries(entries, config.nonce, enqueueScript);
+                if (entries.length > 0) deferredResolversComplete = enqueueFromEntries(entries, deferredScriptKeys, config.nonce, (script)=>{
+                    if (!coordinator) throw new Error("Deferred script coordinator is not ready");
+                    if (shellChunkStatus === ShellChunkStatus.FINISH) coordinator.enqueueResolver(script);
+                    else pendingScripts.push(script);
+                });
                 async function push() {
                     try {
                         const { done, value } = await reader.read();
-                        if (done) return void closeController();
+                        if (done) {
+                            const trailingText = decoder.decode();
+                            if (trailingText) coordinator?.writeReact(trailingText);
+                            await deferredResolversComplete;
+                            coordinator?.finish();
+                            closeController();
+                            return;
+                        }
                         if (isClosed) return;
                         if (shellChunkStatus !== ShellChunkStatus.FINISH) {
-                            chunkVec.push(new TextDecoder().decode(value));
+                            chunkVec.push(decoder.decode(value, {
+                                stream: true
+                            }));
                             const concatedChunk = chunkVec.join('');
                             const markerIndex = concatedChunk.indexOf(ESCAPED_SHELL_STREAM_END_MARK);
                             if (-1 !== markerIndex) {
                                 const beforeMark = concatedChunk.slice(0, markerIndex);
                                 const afterMark = concatedChunk.slice(markerIndex + ESCAPED_SHELL_STREAM_END_MARK.length);
                                 shellChunkStatus = ShellChunkStatus.FINISH;
-                                safeEnqueue(encodeForWebStream(`${shellBefore}${beforeMark}${shellAfter}`));
-                                if (afterMark) safeEnqueue(encodeForWebStream(afterMark));
-                                flushPendingScripts();
+                                coordinator?.writeReact(`${shellBefore}${beforeMark}${shellAfter}`);
+                                if (afterMark) coordinator?.writeReact(afterMark);
+                                coordinator?.markShellFinished();
+                                for (const script of pendingScripts)coordinator?.enqueueResolver(script);
+                                pendingScripts.length = 0;
                             }
-                        } else safeEnqueue(value);
+                        } else {
+                            const decodedChunk = decoder.decode(value, {
+                                stream: true
+                            });
+                            if (decodedChunk) coordinator?.writeReact(decodedChunk);
+                        }
                         if (!isClosed) push();
                     } catch (error) {
+                        coordinator?.abort();
                         if (!isClosed) {
                             isClosed = true;
                             try {
@@ -98,6 +119,7 @@ const createReadableStreamFromElement = async (request, rootElement, options)=>{
                 push();
             },
             cancel (reason) {
+                coordinator?.abort();
                 reader.cancel(reason).catch(()=>{});
             }
         });

package/dist/esm/core/server/stream/deferredScript.mjs

@@ -40,23 +40,29 @@ function buildDeferredDataScript(nonce, args) {
     const nonceAttr = nonce ? ` nonce="${nonce}"` : '';
     return `<script async${nonceAttr} data-fn-name="r" data-script-src="modern-run-router-data-fn" data-fn-args='${escaped}' suppressHydrationWarning>${runRouterDataFnStr}</script>`;
 }
-function enqueueFromEntries(entries, nonce, emit) {
+function enqueueFromEntries(entries, deferredScriptKeys, nonce, emit) {
+    const pendingResolvers = [];
     entries.forEach(([routeId, value])=>{
         if (!isDeferredDataLike(value)) return;
-        const pendingKeys = new Set(value.pendingKeys ?? []);
-        pendingKeys.forEach((key)=>{
+        const serializedKeys = deferredScriptKeys ? deferredScriptKeys.get(routeId) ?? [] : value.pendingKeys ?? [];
+        serializedKeys.forEach((key)=>{
             const tracked = value.data?.[key];
-            if (isPromiseLike(tracked)) tracked.then((val)=>emit(buildDeferredDataScript(nonce, [
+            if (isPromiseLike(tracked)) pendingResolvers.push(Promise.resolve(tracked).then((val)=>{
+                emit(buildDeferredDataScript(nonce, [
                     routeId,
                     key,
                     val
-                ])), (err)=>emit(buildDeferredDataScript(nonce, [
+                ]));
+            }, (err)=>{
+                emit(buildDeferredDataScript(nonce, [
                     routeId,
                     key,
                     void 0,
                     toErrorInfo(err)
-                ])));
+                ]));
+            }));
         });
     });
+    return Promise.all(pendingResolvers).then(()=>void 0);
 }
 export { buildDeferredDataScript, enqueueFromEntries, escapeAttr, isDeferredDataLike, isPromiseLike, isRecord, toErrorInfo };

package/dist/esm/core/server/stream/deferredScriptOutputCoordinator.mjs

@@ -0,0 +1,332 @@
+import { SSR_HYDRATION_ID_PREFIX } from "@modern-js/utils/universal/constants";
+const VOID_ELEMENTS = new Set([
+    'area',
+    'base',
+    'br',
+    'col',
+    'embed',
+    'hr',
+    'img',
+    'input',
+    'link',
+    'meta',
+    'param',
+    'source',
+    'track',
+    'wbr'
+]);
+const RAW_TEXT_ELEMENTS = new Set([
+    'iframe',
+    'noembed',
+    'noframes',
+    "script",
+    'style',
+    'textarea',
+    'title',
+    'xmp'
+]);
+const REACT_SEGMENT_ID_PATTERN = new RegExp(`^${SSR_HYDRATION_ID_PREFIX}S:[0-9a-f]+$`);
+const TABLE_SEGMENT_CHILDREN = new Set([
+    'tbody',
+    'tr',
+    'colgroup'
+]);
+function isAsciiAlpha(char) {
+    return /[A-Za-z]/.test(char);
+}
+function isWhitespace(char) {
+    return /[\t\n\f\r ]/.test(char);
+}
+function getSuffix(value, pattern) {
+    const start = Math.max(0, value.length - pattern.length);
+    for(let index = start; index < value.length; index++){
+        const suffix = value.slice(index);
+        if (pattern.startsWith(suffix)) return suffix;
+    }
+    return '';
+}
+class DeferredScriptOutputCoordinator {
+    enqueueResolver(script) {
+        if (this.closed) return;
+        this.pendingResolvers.push(script);
+        this.flushResolvers();
+    }
+    markShellFinished() {
+        if (this.closed) return;
+        this.shellFinished = true;
+        this.flushResolvers();
+    }
+    writeReact(chunk) {
+        if (this.closed || !chunk) return;
+        this.flushResolvers();
+        let emittedUntil = 0;
+        for(let index = 0; index < chunk.length; index++){
+            const wasSafe = this.isSafeBoundary();
+            this.consume(chunk[index]);
+            if (!wasSafe && this.isSafeBoundary() && this.pendingResolvers.length) {
+                this.emit(chunk.slice(emittedUntil, index + 1));
+                emittedUntil = index + 1;
+                this.flushResolvers();
+            }
+        }
+        if (emittedUntil < chunk.length) this.emit(chunk.slice(emittedUntil));
+    }
+    finish() {
+        if (this.closed) return;
+        this.flushResolvers();
+        this.closed = true;
+        if (this.pendingResolvers.length > 0) throw new Error("Cannot emit deferred resolver scripts because the React stream ended outside a safe HTML boundary.");
+    }
+    abort() {
+        this.closed = true;
+        this.pendingResolvers.length = 0;
+    }
+    isSafeBoundary() {
+        return this.shellFinished && 'data' === this.state && 0 === this.openElements.length && !this.awaitingContinuationProtocol;
+    }
+    flushResolvers() {
+        if (!this.isSafeBoundary() || 0 === this.pendingResolvers.length) return;
+        while(this.pendingResolvers.length > 0){
+            const resolver = this.pendingResolvers.shift();
+            if (resolver) this.emit(resolver);
+        }
+    }
+    consume(char) {
+        switch(this.state){
+            case 'data':
+                if ('<' === char) this.state = 'tag-open';
+                return;
+            case 'tag-open':
+                if ('/' === char) {
+                    this.currentTagName = '';
+                    this.state = 'end-tag-name';
+                } else if ('!' === char) {
+                    this.declarationPrefix = '';
+                    this.state = 'markup-declaration';
+                } else if ('?' === char) this.state = 'bogus-comment';
+                else if (isAsciiAlpha(char)) {
+                    this.startTag(char);
+                    this.state = 'start-tag-name';
+                } else this.state = 'data';
+                return;
+            case 'start-tag-name':
+                if (isWhitespace(char)) this.state = 'before-attribute-name';
+                else if ('/' === char) this.state = 'self-closing-start-tag';
+                else if ('>' === char) this.completeStartTag(false);
+                else this.currentTagName += char.toLowerCase();
+                return;
+            case 'before-attribute-name':
+                if (isWhitespace(char)) return;
+                if ('/' === char) this.state = 'self-closing-start-tag';
+                else if ('>' === char) this.completeStartTag(false);
+                else {
+                    this.startAttribute(char);
+                    this.state = 'attribute-name';
+                }
+                return;
+            case 'attribute-name':
+                if (isWhitespace(char)) this.state = 'after-attribute-name';
+                else if ('=' === char) {
+                    this.currentAttributeHasValue = true;
+                    this.state = 'before-attribute-value';
+                } else if ('/' === char) {
+                    this.completeAttribute();
+                    this.state = 'self-closing-start-tag';
+                } else if ('>' === char) this.completeStartTag(false);
+                else this.currentAttributeName += char.toLowerCase();
+                return;
+            case 'after-attribute-name':
+                if (isWhitespace(char)) return;
+                if ('=' === char) {
+                    this.currentAttributeHasValue = true;
+                    this.state = 'before-attribute-value';
+                } else if ('/' === char) {
+                    this.completeAttribute();
+                    this.state = 'self-closing-start-tag';
+                } else if ('>' === char) this.completeStartTag(false);
+                else {
+                    this.completeAttribute();
+                    this.startAttribute(char);
+                    this.state = 'attribute-name';
+                }
+                return;
+            case 'before-attribute-value':
+                if (isWhitespace(char)) return;
+                if ('"' === char) this.state = 'attribute-value-double-quoted';
+                else if ("'" === char) this.state = 'attribute-value-single-quoted';
+                else if ('>' === char) this.completeStartTag(false);
+                else {
+                    this.currentAttributeValue += char;
+                    this.state = 'attribute-value-unquoted';
+                }
+                return;
+            case 'attribute-value-double-quoted':
+                if ('"' === char) {
+                    this.completeAttribute();
+                    this.state = 'before-attribute-name';
+                } else this.currentAttributeValue += char;
+                return;
+            case 'attribute-value-single-quoted':
+                if ("'" === char) {
+                    this.completeAttribute();
+                    this.state = 'before-attribute-name';
+                } else this.currentAttributeValue += char;
+                return;
+            case 'attribute-value-unquoted':
+                if (isWhitespace(char)) {
+                    this.completeAttribute();
+                    this.state = 'before-attribute-name';
+                } else if ('>' === char) this.completeStartTag(false);
+                else this.currentAttributeValue += char;
+                return;
+            case 'self-closing-start-tag':
+                if ('>' === char) this.completeStartTag(true);
+                else if (!isWhitespace(char)) {
+                    this.startAttribute(char);
+                    this.state = 'attribute-name';
+                }
+                return;
+            case 'end-tag-name':
+                if (isWhitespace(char)) this.state = 'after-end-tag-name';
+                else if ('>' === char) this.completeEndTag();
+                else this.currentTagName += char.toLowerCase();
+                return;
+            case 'after-end-tag-name':
+                if ('>' === char) this.completeEndTag();
+                return;
+            case 'markup-declaration':
+                if (this.declarationPrefix.length < 2 && '-' === char) {
+                    this.declarationPrefix += char;
+                    if ('--' === this.declarationPrefix) {
+                        this.commentTail = '';
+                        this.state = 'comment';
+                    }
+                } else this.state = '>' === char ? 'data' : 'declaration';
+                return;
+            case 'declaration':
+                if ('>' === char) this.state = 'data';
+                return;
+            case 'comment':
+                this.commentTail = `${this.commentTail}${char}`.slice(-3);
+                if ('-->' === this.commentTail) this.state = 'data';
+                return;
+            case 'bogus-comment':
+                if ('>' === char) this.state = 'data';
+                return;
+            case 'raw-text':
+                this.consumeRawText(char);
+                return;
+            case 'raw-end-tag':
+                if ('>' === char) this.completeRawTextEndTag();
+                else if (!isWhitespace(char)) {
+                    this.state = 'raw-text';
+                    this.rawTextSearch = getSuffix(`${this.rawTextSearch}${char.toLowerCase()}`, `</${this.rawTextElement}`);
+                }
+        }
+    }
+    startTag(char) {
+        this.currentTagName = char.toLowerCase();
+        this.currentAttributes = new Map();
+        this.currentAttributeName = '';
+        this.currentAttributeValue = '';
+        this.currentAttributeHasValue = false;
+    }
+    startAttribute(char) {
+        this.currentAttributeName = char.toLowerCase();
+        this.currentAttributeValue = '';
+        this.currentAttributeHasValue = false;
+    }
+    completeAttribute() {
+        if (!this.currentAttributeName) return;
+        this.currentAttributes.set(this.currentAttributeName, this.currentAttributeHasValue ? this.currentAttributeValue : true);
+        this.currentAttributeName = '';
+        this.currentAttributeValue = '';
+        this.currentAttributeHasValue = false;
+    }
+    completeStartTag(selfClosing) {
+        this.completeAttribute();
+        const tagName = this.currentTagName;
+        const id = this.currentAttributes.get('id');
+        const hasReactSegmentId = 'string' == typeof id && REACT_SEGMENT_ID_PATTERN.test(id);
+        const hasHiddenAttribute = this.currentAttributes.has('hidden');
+        const isHiddenSegmentTable = 'table' === tagName && hasHiddenAttribute && !hasReactSegmentId;
+        const isTableSegmentChild = hasReactSegmentId && TABLE_SEGMENT_CHILDREN.has(tagName) && this.openElements[this.openElements.length - 1]?.isSegmentTableWrapper === true;
+        const isContinuationContainer = hasReactSegmentId && ('div' === tagName && hasHiddenAttribute || ('svg' === tagName || 'math' === tagName) && void 0 !== id && 'true' === this.currentAttributes.get('aria-hidden') && 'display:none' === this.currentAttributes.get('style') || 'table' === tagName && hasHiddenAttribute || isTableSegmentChild);
+        this.continuationProtocolScript = "script" === tagName && this.awaitingContinuationProtocol;
+        this.continuationProtocolTail = '';
+        this.hasContinuationProtocolCall = false;
+        if (!selfClosing && !VOID_ELEMENTS.has(tagName)) this.openElements.push({
+            tagName,
+            isContinuationContainer,
+            isSegmentTableWrapper: isHiddenSegmentTable
+        });
+        this.currentTagName = '';
+        this.currentAttributes = new Map();
+        this.currentAttributeName = '';
+        this.currentAttributeValue = '';
+        this.currentAttributeHasValue = false;
+        if (!selfClosing && RAW_TEXT_ELEMENTS.has(tagName)) {
+            this.rawTextElement = tagName;
+            this.rawTextSearch = '';
+            this.state = 'raw-text';
+        } else this.state = 'data';
+    }
+    completeEndTag() {
+        this.closeOpenElement(this.currentTagName);
+        this.currentTagName = '';
+        this.state = 'data';
+    }
+    consumeRawText(char) {
+        const rawTextElement = this.rawTextElement;
+        if (!rawTextElement) {
+            this.state = 'data';
+            return;
+        }
+        const endTagPrefix = `</${rawTextElement}`;
+        if (this.continuationProtocolScript) {
+            this.continuationProtocolTail = `${this.continuationProtocolTail}${char}`.slice(-4);
+            if (/\$(?:RC|RS|RX|RB|RR)\b/.test(this.continuationProtocolTail)) this.hasContinuationProtocolCall = true;
+        }
+        this.rawTextSearch = getSuffix(`${this.rawTextSearch}${char.toLowerCase()}`, endTagPrefix);
+        if (this.rawTextSearch === endTagPrefix) this.state = 'raw-end-tag';
+    }
+    completeRawTextEndTag() {
+        const rawTextElement = this.rawTextElement;
+        if (rawTextElement) this.closeOpenElement(rawTextElement);
+        if ("script" === rawTextElement && this.continuationProtocolScript && this.hasContinuationProtocolCall) this.awaitingContinuationProtocol = false;
+        this.rawTextElement = void 0;
+        this.rawTextSearch = '';
+        this.continuationProtocolScript = false;
+        this.continuationProtocolTail = '';
+        this.hasContinuationProtocolCall = false;
+        this.state = 'data';
+    }
+    closeOpenElement(tagName) {
+        const matchingIndex = this.openElements.map((element)=>element.tagName).lastIndexOf(tagName);
+        if (-1 === matchingIndex) return;
+        const closedElements = this.openElements.splice(matchingIndex);
+        const closedContinuation = closedElements.some((element)=>element.isContinuationContainer);
+        if (closedContinuation) this.awaitingContinuationProtocol = true;
+    }
+    constructor(emit){
+        this.emit = emit;
+        this.pendingResolvers = [];
+        this.openElements = [];
+        this.shellFinished = false;
+        this.closed = false;
+        this.state = 'data';
+        this.currentTagName = '';
+        this.currentAttributes = new Map();
+        this.currentAttributeName = '';
+        this.currentAttributeValue = '';
+        this.currentAttributeHasValue = false;
+        this.declarationPrefix = '';
+        this.commentTail = '';
+        this.rawTextSearch = '';
+        this.continuationProtocolScript = false;
+        this.continuationProtocolTail = '';
+        this.hasContinuationProtocolCall = false;
+        this.awaitingContinuationProtocol = false;
+    }
+}
+export { DeferredScriptOutputCoordinator };

package/dist/esm/router/runtime/DeferredDataScripts.node.mjs

@@ -13,7 +13,8 @@ const DeferredDataScripts = (props)=>{
     }, []);
     const deferredScripts = useMemo(()=>{
         if (!staticContext) return null;
-        const activeDeferreds = storage.useContext().activeDeferreds;
+        const requestStorage = storage.useContext();
+        const activeDeferreds = requestStorage.activeDeferreds;
         const _ROUTER_DATA = {
             loaderData: staticContext.loaderData,
             errors: serializeErrors(staticContext.errors)
@@ -26,6 +27,7 @@ const DeferredDataScripts = (props)=>{
         const deferredDataScripts = [];
         const initialScripts = Array.from(activeDeferreds.entries()).map(([routeId, deferredData])=>{
             const pendingKeys = new Set(deferredData.pendingKeys);
+            requestStorage.deferredScriptKeys?.set(routeId, Array.from(pendingKeys));
             const { deferredKeys } = deferredData;
             const deferredKeyPromiseManifests = deferredKeys.map((key)=>{
                 if (pendingKeys.has(key)) return {

package/dist/esm-node/core/server/requestHandler.mjs

@@ -102,12 +102,14 @@ const createRequestHandler = async (handleRequest, createRequestOptions)=>{
             status: -1
         };
         const activeDeferreds = new Map();
+        const deferredScriptKeys = new Map();
         return storage.run({
             headers: headersData,
             request,
             monitors: options.monitors,
             responseProxy,
             activeDeferreds,
+            deferredScriptKeys,
             serverPayload: void 0
         }, async ()=>{
             const Root = createRoot();