@hyperspan/framework 1.0.24 → 1.0.26

package/src/client/_hs/hyperspan-actions.client.ts

@@ -94,6 +94,8 @@ function formSubmitToRoute(e: Event, form: HTMLFormElement, opts: TFormSubmitOpt
       }
     }
 
+    activateScriptsIn(isFullDocument ? document.body : (target as ParentNode));
+
     opts.afterResponse && opts.afterResponse();
     lazyLoadScripts();
   }
@@ -126,13 +128,7 @@ function formSubmitToRoute(e: Event, form: HTMLFormElement, opts: TFormSubmitOpt
         return;
       }
 
-      const content = await res.text();
-      // No content = DO NOTHING (redirect or something else happened)
-      if (!content) {
-        return;
-      }
-
-      applyResponseHtml(content);
+      await consumeStreamingHtmlResponse(res, applyResponseHtml);
     })
     .catch((error) => {
       console.error('[Hyperspan] Error submitting form action:', error);
@@ -153,28 +149,60 @@ function splitInitialStreamHtml(html: string): { initial: string; streamTail: st
   };
 }
 
-/** Append streamed HTML to body and run any inline scripts (e.g. window._hsc.push). */
+/** Clone a script node so the browser will execute it (preserves module type). */
+function cloneScriptForExecution(script: HTMLScriptElement): HTMLScriptElement {
+  const executable = document.createElement('script');
+  if (script.src) {
+    executable.src = script.src;
+  } else if (script.textContent) {
+    executable.textContent = script.textContent;
+  }
+  if (script.type) {
+    executable.type = script.type;
+  }
+  for (const attr of script.getAttributeNames()) {
+    if (attr === 'src' || attr === 'type') {
+      continue;
+    }
+    executable.setAttribute(attr, script.getAttribute(attr) || '');
+  }
+  return executable;
+}
+
+/** Run scripts inserted by Idiomorph (innerHTML/morph does not execute them). */
+function activateScriptsIn(root: ParentNode) {
+  root.querySelectorAll('script').forEach((script) => {
+    if (script.closest('template[id$="_content"]')) {
+      return;
+    }
+    script.replaceWith(cloneScriptForExecution(script));
+  });
+}
+
+/** Append streamed HTML to body and run top-level chunk scripts (e.g. window._hsc.push). */
 function appendHtmlToBody(html: string) {
   if (!html) {
     return;
   }
 
-  const template = document.createElement('template');
-  template.innerHTML = html;
+  const container = document.createElement('template');
+  container.innerHTML = html;
   const scripts: HTMLScriptElement[] = [];
-  template.content.querySelectorAll('script').forEach((script) => {
-    scripts.push(script);
+
+  for (const node of Array.from(container.content.childNodes)) {
+    if (node.nodeName === 'SCRIPT') {
+      scripts.push(node as HTMLScriptElement);
+    }
+  }
+
+  for (const script of scripts) {
     script.remove();
-  });
-  document.body.appendChild(template.content);
+  }
+
+  document.body.appendChild(container.content);
+
   for (const script of scripts) {
-    const executable = document.createElement('script');
-    if (script.src) {
-      executable.src = script.src;
-    } else {
-      executable.textContent = script.textContent;
-    }
-    document.body.appendChild(executable);
+    document.body.appendChild(cloneScriptForExecution(script));
   }
 }
 
@@ -227,4 +255,4 @@ async function consumeStreamingHtmlResponse(
     }
     processChunk(decoder.decode(value, { stream: true }));
   }
-}
+}

package/src/index.ts

@@ -1,2 +1,12 @@
-export { createConfig, createContext, createRoute, createServer, getRunnableRoute, StreamResponse, IS_PROD, HTTPResponseException } from './server';
-export type { Hyperspan } from './types';
+export {
+  createConfig,
+  createContext,
+  createRoute,
+  createServer,
+  getRunnableRoute,
+  StreamResponse,
+  IS_PROD,
+  HTTPResponseException,
+  hyperspanDisableStreaming,
+} from './server';
+export type { Hyperspan } from './types';

package/src/server.test.ts

@@ -1,5 +1,7 @@
-import { test, expect } from 'bun:test';
+import { test, expect, describe } from 'bun:test';
 import { createRoute, createServer, createContext } from './server';
+import { createAction } from './actions';
+import { html, placeholder } from '@hyperspan/html';
 import type { Hyperspan as HS } from './types';
 
 test('route fetch() returns a Response', async () => {
@@ -53,7 +55,6 @@ test('server with two routes can return Response from one', async () => {
     return context.res.html('<h1>Posts Page</h1>');
   });
 
-
   // Test that we can get a Response from one of the routes
   const request = new Request('http://localhost:3000/users');
   const testRoute = server._routes.find((route: HS.Route) => route._path() === '/users');
@@ -80,7 +81,9 @@ test('server returns a route with a POST request', async () => {
     return context.res.html('<h1>POST /users</h1>');
   });
 
-  const route = server._routes.find((route: HS.Route) => route._path() === '/users' && route._methods().includes('POST')) as HS.Route;
+  const route = server._routes.find(
+    (route: HS.Route) => route._path() === '/users' && route._methods().includes('POST')
+  ) as HS.Route;
   const request = new Request('http://localhost:3000/users', { method: 'POST' });
   const response = await route.fetch(request);
 
@@ -100,7 +103,9 @@ test('server returns a route with a ALL request', async () => {
     return context.res.html('<h1>ALL /users</h1>');
   });
 
-  const route = server._routes.find((route: HS.Route) => route._path() === '/users' && route._methods().includes('*')) as HS.Route;
+  const route = server._routes.find(
+    (route: HS.Route) => route._path() === '/users' && route._methods().includes('*')
+  ) as HS.Route;
 
   // GET request
   let request = new Request('http://localhost:3000/users', { method: 'GET' });
@@ -144,7 +149,7 @@ test('createContext() can get and set cookies', () => {
   // Create a request with cookies in the Cookie header
   const request = new Request('http://localhost:3000/', {
     headers: {
-      'Cookie': 'sessionId=abc123; theme=dark; userId=42',
+      Cookie: 'sessionId=abc123; theme=dark; userId=42',
     },
   });
 
@@ -369,3 +374,184 @@ test('createContext() merge() function allows response headers to override conte
   expect(response.headers.get('X-Header')).toBe('response-value');
   expect(response.headers.get('Content-Type')).toBe('text/html; charset=UTF-8');
 });
+
+describe('when streaming is disabled', () => {
+  test('placeholder resolves to real content in the initial response on the route', async () => {
+    const route = createRoute({
+      responseOptions: {
+        disableStreaming: () => true,
+      },
+    }).get(() => {
+      return html`<div>
+        ${placeholder(html`<span>Loading...</span>`, Promise.resolve(html`<p>Real content</p>`))}
+      </div>`;
+    });
+
+    const request = new Request('http://localhost:3000/');
+    const response = await route.fetch(request);
+
+    expect(response).toBeInstanceOf(Response);
+    expect(response.status).toBe(200);
+    expect(response.headers.get('Transfer-Encoding')).not.toBe('chunked');
+
+    const text = await response.text();
+    expect(text).toContain('<p>Real content</p>');
+    expect(text).not.toContain('Loading...');
+    expect(text).not.toContain('hs:loading');
+  });
+
+  test('placeholder resolves to real content in the initial response on the server', async () => {
+    const server = await createServer({
+      appDir: './app',
+      publicDir: './public',
+      plugins: [],
+      responseOptions: {
+        disableStreaming: () => true,
+      },
+    });
+
+    server.get('/', () => {
+      return html`<div>
+        ${placeholder(html`<span>Loading...</span>`, Promise.resolve(html`<p>Real content</p>`))}
+      </div>`;
+    });
+
+    const route = server._routes[0];
+    route._serverConfig = server._config;
+
+    const request = new Request('http://localhost:3000/');
+    const response = await route.fetch(request);
+
+    expect(response).toBeInstanceOf(Response);
+    expect(response.status).toBe(200);
+    expect(response.headers.get('Transfer-Encoding')).not.toBe('chunked');
+
+    const text = await response.text();
+    expect(text).toContain('<p>Real content</p>');
+    expect(text).not.toContain('Loading...');
+    expect(text).not.toContain('hs:loading');
+  });
+
+  test('disableStreaming receives hyperspanDisableStreaming for custom logic with framework fallback', async () => {
+    const route = createRoute({
+      responseOptions: {
+        disableStreaming(c, { hyperspanDisableStreaming }) {
+          if (c.req.query.get('no-stream') === '1') {
+            return true;
+          }
+          return hyperspanDisableStreaming(c);
+        },
+      },
+    }).get(() => {
+      return html`<div>
+        ${placeholder(html`<span>Loading...</span>`, Promise.resolve(html`<p>Real content</p>`))}
+      </div>`;
+    });
+
+    const normalRequest = new Request('http://localhost:3000/');
+    const normalResponse = await route.fetch(normalRequest);
+    expect(normalResponse.headers.get('Transfer-Encoding')).toBe('chunked');
+
+    const customRequest = new Request('http://localhost:3000/?no-stream=1');
+    const customResponse = await route.fetch(customRequest);
+    expect(customResponse.headers.get('Transfer-Encoding')).not.toBe('chunked');
+    expect(await customResponse.text()).toContain('<p>Real content</p>');
+
+    const botRequest = new Request('http://localhost:3000/', {
+      headers: { 'User-Agent': 'Googlebot/2.1 (+http://www.google.com/bot.html)' },
+    });
+    const botResponse = await route.fetch(botRequest);
+    expect(botResponse.headers.get('Transfer-Encoding')).not.toBe('chunked');
+    expect(await botResponse.text()).toContain('<p>Real content</p>');
+  });
+
+  test('nested promise and placeholder content fully resolves on initial load', async () => {
+    const route = createRoute({
+      responseOptions: {
+        disableStreaming: () => true,
+      },
+    }).get(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 10));
+
+      const sectionPromise = (async () => {
+        await new Promise((resolve) => setTimeout(resolve, 10));
+        return placeholder(
+          html`<span>Outer placeholder</span>`,
+          (async () => {
+            await new Promise((resolve) => setTimeout(resolve, 10));
+            return html`<p>Inner resolved content</p>`;
+          })()
+        );
+      })();
+
+      return html`<main>
+        <h1>Static heading</h1>
+        ${sectionPromise}
+      </main>`;
+    });
+
+    const request = new Request('http://localhost:3000/');
+    const response = await route.fetch(request);
+
+    expect(response).toBeInstanceOf(Response);
+    expect(response.status).toBe(200);
+    expect(response.headers.get('Transfer-Encoding')).not.toBe('chunked');
+
+    const text = await response.text();
+    expect(text).toContain('<h1>Static heading</h1>');
+    expect(text).toContain('<p>Inner resolved content</p>');
+    expect(text).not.toContain('Outer placeholder');
+    expect(text).not.toContain('hs:loading');
+  });
+
+  test('nested promise and async action form fully resolve on initial load', async () => {
+    const action = createAction({ name: 'nested-async-form-action' })
+      .form(async () => {
+        await new Promise((resolve) => setTimeout(resolve, 10));
+        return html`<form>
+          <p>Action form content</p>
+          <button type="submit">Submit</button>
+        </form>`;
+      })
+      .post(async () => html`<p>Submitted</p>`);
+
+    const route = createRoute({
+      responseOptions: {
+        disableStreaming: () => true,
+      },
+    }).get(async (c: HS.Context) => {
+      await new Promise((resolve) => setTimeout(resolve, 10));
+
+      const sectionPromise = (async () => {
+        await new Promise((resolve) => setTimeout(resolve, 10));
+        return placeholder(
+          html`<span>Outer placeholder</span>`,
+          (async () => {
+            await new Promise((resolve) => setTimeout(resolve, 10));
+            return action.render(c);
+          })()
+        );
+      })();
+
+      return html`<main>
+        <h1>Static heading</h1>
+        ${sectionPromise}
+      </main>`;
+    });
+
+    const request = new Request('http://localhost:3000/');
+    const response = await route.fetch(request);
+
+    expect(response).toBeInstanceOf(Response);
+    expect(response.status).toBe(200);
+    expect(response.headers.get('Transfer-Encoding')).not.toBe('chunked');
+
+    const text = await response.text();
+    expect(text).toContain('<h1>Static heading</h1>');
+    expect(text).toContain('<hs-action');
+    expect(text).toContain('<p>Action form content</p>');
+    expect(text).toContain('type="submit"');
+    expect(text).not.toContain('Outer placeholder');
+    expect(text).not.toContain('hs:loading');
+  });
+});

package/src/server.ts

@@ -1,5 +1,13 @@
 import './ssr/install-server-dom-mock';
-import { HSHtml, html, isHSHtml, renderStream, renderAsync, render, _typeOf } from '@hyperspan/html';
+import {
+  HSHtml,
+  html,
+  isHSHtml,
+  renderStream,
+  renderAsync,
+  render,
+  _typeOf,
+} from '@hyperspan/html';
 import { isbot } from 'isbot';
 import { executeMiddleware } from './middleware';
 import { parsePath, removeUndefined } from './utils';
@@ -9,6 +17,22 @@ import type { Hyperspan as HS } from './types';
 
 export const IS_PROD = process.env.NODE_ENV === 'production';
 
+/**
+ * Default streaming disable detection (bots receive fully rendered HTML).
+ */
+export function hyperspanDisableStreaming(context: HS.Context): boolean {
+  return isbot(context.req.raw.headers.get('user-agent') ?? '');
+}
+
+const disableStreamingOptions = { hyperspanDisableStreaming };
+
+function shouldDisableStreaming(
+  disableStreaming: HS.DisableStreamingFn | undefined,
+  context: HS.Context
+): boolean {
+  return disableStreaming?.(context, disableStreamingOptions) ?? false;
+}
+
 export class HTTPResponseException extends Error {
   public _error?: Error;
   public _response?: Response;
@@ -28,8 +52,7 @@ export function createConfig(config: Partial<HS.Config> = {}): HS.Config {
     publicDir: './public',
     plugins: [],
     responseOptions: {
-      // Disable streaming for bots by default
-      disableStreaming: (c) => isbot(c.req.raw.headers.get('user-agent') ?? ''),
+      disableStreaming: hyperspanDisableStreaming,
     },
   };
   return {
@@ -51,11 +74,15 @@ export function createContext(req: Request, route?: HS.Route): HS.Context {
   const method = req.method.toUpperCase();
   const headers = new Headers(req.headers);
   const path = route?._path() || '/';
-  // @ts-ignore - Bun will put 'params' on the Request object even though it's not standardized
-  const params: HS.RouteParamsParser<path> & Record<string, string | undefined> = Object.assign({}, req?.params || {}, removeUndefined(route?._config.params || {}));
+  const requestParams = (req as Request & { params?: Record<string, string | undefined> }).params;
+  const params: Record<string, string | undefined> = Object.assign(
+    {},
+    requestParams || {},
+    removeUndefined(route?._config.params || {})
+  );
 
   // Replace catch-all param with the value from the URL path
-  const catchAllParam = Object.keys(params).find(key => key.startsWith('...'));
+  const catchAllParam = Object.keys(params).find((key) => key.startsWith('...'));
   if (catchAllParam && path.includes('/*')) {
     const catchAllValue = url.pathname.split(path.replace('/*', '/')).pop();
     params[catchAllParam.replace('...', '')] = catchAllValue;
@@ -84,7 +111,7 @@ export function createContext(req: Request, route?: HS.Route): HS.Context {
       name: route?._config.name || undefined,
       path,
       params: params,
-      cssImports: route ? route._config.cssImports ?? [] : [],
+      cssImports: route ? (route._config.cssImports ?? []) : [],
     },
     req: {
       raw: req,
@@ -93,21 +120,50 @@ export function createContext(req: Request, route?: HS.Route): HS.Context {
       headers,
       query,
       cookies: new Cookies(req),
-      async text() { return req.clone().text() },
-      async json<T = unknown>() { return await req.clone().json() as T },
-      async formData<T = unknown>() { return await req.clone().formData() as T },
-      async urlencoded() { return new URLSearchParams(await req.clone().text()) },
+      async text() {
+        return req.clone().text();
+      },
+      async json<T = unknown>() {
+        return (await req.clone().json()) as T;
+      },
+      async formData<T = unknown>() {
+        return (await req.clone().formData()) as T;
+      },
+      async urlencoded() {
+        return new URLSearchParams(await req.clone().text());
+      },
     },
     res: {
       cookies: new Cookies(req, headers),
       headers,
       status,
-      html: (html: string, options?: ResponseInit) => merge(new Response(html, { ...options, headers: { 'Content-Type': 'text/html; charset=UTF-8', ...options?.headers } })),
-      json: (json: any, options?: ResponseInit) => merge(new Response(JSON.stringify(json), { ...options, headers: { 'Content-Type': 'application/json', ...options?.headers } })),
-      text: (text: string, options?: ResponseInit) => merge(new Response(text, { ...options, headers: { 'Content-Type': 'text/plain; charset=UTF-8', ...options?.headers } })),
-      redirect: (url: string, options?: ResponseInit) => merge(new Response(null, { status: 302, headers: { Location: url, ...options?.headers } })),
-      error: (error: Error, options?: ResponseInit) => merge(new Response(error.message, { status: 500, ...options })),
-      notFound: (options?: ResponseInit) => merge(new Response('Not Found', { status: 404, ...options })),
+      html: (html: string, options?: ResponseInit) =>
+        merge(
+          new Response(html, {
+            ...options,
+            headers: { 'Content-Type': 'text/html; charset=UTF-8', ...options?.headers },
+          })
+        ),
+      json: (json: any, options?: ResponseInit) =>
+        merge(
+          new Response(JSON.stringify(json), {
+            ...options,
+            headers: { 'Content-Type': 'application/json', ...options?.headers },
+          })
+        ),
+      text: (text: string, options?: ResponseInit) =>
+        merge(
+          new Response(text, {
+            ...options,
+            headers: { 'Content-Type': 'text/plain; charset=UTF-8', ...options?.headers },
+          })
+        ),
+      redirect: (url: string, options?: ResponseInit) =>
+        merge(new Response(null, { status: 302, headers: { Location: url, ...options?.headers } })),
+      error: (error: Error, options?: ResponseInit) =>
+        merge(new Response(error.message, { status: 500, ...options })),
+      notFound: (options?: ResponseInit) =>
+        merge(new Response('Not Found', { status: 404, ...options })),
       merge,
     },
   };
@@ -137,7 +193,16 @@ export function createRoute(config: Partial<HS.RouteConfig> = {}): HS.Route {
   const api: HS.Route = {
     _kind: 'hsRoute',
     _config: config,
-    _middleware: { GET: [], POST: [], PUT: [], PATCH: [], DELETE: [], HEAD: [], OPTIONS: [], '*': [] },
+    _middleware: {
+      GET: [],
+      POST: [],
+      PUT: [],
+      PATCH: [],
+      DELETE: [],
+      HEAD: [],
+      OPTIONS: [],
+      '*': [],
+    },
     _methods: () => Object.keys(_handlers),
     _path() {
       if (this._config.path) {
@@ -215,7 +280,7 @@ export function createRoute(config: Partial<HS.RouteConfig> = {}): HS.Route {
      */
     use(middleware: HS.MiddlewareFunction, opts: HS.MiddlewareMethodOptions = {}) {
       if (opts?.methods) {
-        opts.methods.forEach(method => {
+        opts.methods.forEach((method) => {
           api._middleware[method].push(middleware);
         });
       } else {
@@ -229,7 +294,7 @@ export function createRoute(config: Partial<HS.RouteConfig> = {}): HS.Route {
      */
     middleware(middleware: Array<HS.MiddlewareFunction>, opts: HS.MiddlewareMethodOptions = {}) {
       if (opts?.methods) {
-        opts.methods.forEach(method => {
+        opts.methods.forEach((method) => {
           api._middleware[method] = middleware;
         });
       } else {
@@ -252,25 +317,24 @@ export function createRoute(config: Partial<HS.RouteConfig> = {}): HS.Route {
         if (method === 'OPTIONS' && !_handlers['OPTIONS']) {
           return context.res.html(
             render(html`
-                <!DOCTYPE html>
-                <html lang="en"></html>
-              `),
+              <!DOCTYPE html>
+              <html lang="en"></html>
+            `),
             {
               status: 200,
               headers: {
                 'Access-Control-Allow-Origin': '*',
-                'Access-Control-Allow-Methods': [
-                  'HEAD',
-                  'OPTIONS',
-                  ...Object.keys(_handlers),
-                ].join(', '),
+                'Access-Control-Allow-Methods': ['HEAD', 'OPTIONS', ...Object.keys(_handlers)].join(
+                  ', '
+                ),
                 'Access-Control-Allow-Headers': 'Content-Type, Authorization',
               },
             }
           );
         }
 
-        const handler = (method === 'HEAD' ? _handlers['GET'] : _handlers[method]) ?? _handlers['*'];
+        const handler =
+          (method === 'HEAD' ? _handlers['GET'] : _handlers[method]) ?? _handlers['*'];
 
         if (!handler) {
           return context.res.error(new Error('Method not allowed'), { status: 405 });
@@ -296,7 +360,10 @@ export function createRoute(config: Partial<HS.RouteConfig> = {}): HS.Route {
 
         if (isHTMLContent(routeContent)) {
           // Merge server and route-specific response options
-          const responseOptions = { ...(api._serverConfig?.responseOptions ?? {}), ...(api._config?.responseOptions ?? {}) };
+          const responseOptions = {
+            ...(api._serverConfig?.responseOptions ?? {}),
+            ...(api._config?.responseOptions ?? {}),
+          };
           return returnHTMLResponse(context, () => routeContent, responseOptions);
         }
 
@@ -324,11 +391,22 @@ export function createRoute(config: Partial<HS.RouteConfig> = {}): HS.Route {
       // Run the route handler and any middleware
       // If an error occurs, run the error handler if it exists
       try {
-        return await executeMiddleware(context, [...globalMiddleware, ...methodMiddleware, methodHandler]);
+        return await executeMiddleware(context, [
+          ...globalMiddleware,
+          ...methodMiddleware,
+          methodHandler,
+        ]);
       } catch (e) {
         if (_errorHandler !== undefined) {
-          const responseOptions = { ...(api._serverConfig?.responseOptions ?? {}), ...(api._config?.responseOptions ?? {}) };
-          return returnHTMLResponse(context, () => (_errorHandler as HS.ErrorHandler)(context, e as Error), responseOptions);
+          const responseOptions = {
+            ...(api._serverConfig?.responseOptions ?? {}),
+            ...(api._config?.responseOptions ?? {}),
+          };
+          return returnHTMLResponse(
+            context,
+            () => (_errorHandler as HS.ErrorHandler)(context, e as Error),
+            responseOptions
+          );
         }
         throw e;
       }
@@ -346,16 +424,25 @@ export async function createServer(config: HS.Config = {} as HS.Config): Promise
 
   // Load plugins, if any
   if (config.plugins && config.plugins.length > 0) {
-    await Promise.all(config.plugins.map(plugin => plugin(config)));
+    await Promise.all(config.plugins.map((plugin) => plugin(config)));
   }
 
   const api: HS.Server = {
     _config: config,
     _routes: _routes,
-    _middleware: { GET: [], POST: [], PUT: [], PATCH: [], DELETE: [], HEAD: [], OPTIONS: [], '*': [] },
+    _middleware: {
+      GET: [],
+      POST: [],
+      PUT: [],
+      PATCH: [],
+      DELETE: [],
+      HEAD: [],
+      OPTIONS: [],
+      '*': [],
+    },
     use(middleware: HS.MiddlewareFunction, opts?: HS.MiddlewareMethodOptions) {
       if (opts?.methods) {
-        opts.methods.forEach(method => {
+        opts.methods.forEach((method) => {
           api._middleware[method].push(middleware);
         });
       } else {
@@ -414,7 +501,8 @@ export async function createServer(config: HS.Config = {} as HS.Config): Promise
  * Checks if a response is HTML content
  */
 function isHTMLContent(response: unknown): response is Response {
-  const hasHTMLContentType = response instanceof Response && response.headers.get('Content-Type') === 'text/html';
+  const hasHTMLContentType =
+    response instanceof Response && response.headers.get('Content-Type') === 'text/html';
   const isHTMLTemplate = isHSHtml(response);
   const isHTMLString = typeof response === 'string' && response.trim().startsWith('<');
 
@@ -427,7 +515,11 @@ function isHTMLContent(response: unknown): response is Response {
 export async function returnHTMLResponse(
   context: HS.Context,
   handlerFn: () => unknown,
-  responseOptions?: { status?: number; headers?: Record<string, string>; disableStreaming?: (context: HS.Context) => boolean }
+  responseOptions?: {
+    status?: number;
+    headers?: Record<string, string>;
+    disableStreaming?: HS.DisableStreamingFn;
+  }
 ): Promise<Response> {
   try {
     const routeContent = await handlerFn();
@@ -439,7 +531,7 @@ export async function returnHTMLResponse(
 
     // Render HSHtml if returned from route handler
     if (isHSHtml(routeContent)) {
-      const disableStreaming = responseOptions?.disableStreaming?.(context) ?? false;
+      const disableStreaming = shouldDisableStreaming(responseOptions?.disableStreaming, context);
 
       // Stream only if enabled and there is async content to stream
       if (!disableStreaming && (routeContent as HSHtml).asyncContent?.length > 0) {
@@ -447,13 +539,13 @@ export async function returnHTMLResponse(
           renderStream(routeContent as HSHtml, {
             renderChunk: (chunk) => {
               return html`
-              <template id="${chunk.id}_content">${html.raw(chunk.content)}<!--end--></template>
-              <script>
-                window._hsc = window._hsc || [];
-                window._hsc.push({id: "${chunk.id}" });
-              </script>
-            `;
-            }
+                <template id="${chunk.id}_content">${html.raw(chunk.content)}<!--end--></template>
+                <script>
+                  window._hsc = window._hsc || [];
+                  window._hsc.push({ id: '${chunk.id}' });
+                </script>
+              `;
+            },
           }),
           responseOptions
         ) as Response;
@@ -559,7 +651,6 @@ async function showErrorReponse(
   return context.res.html(output, Object.assign({ status }, responseOptions));
 }
 
-
 /**
  * Streaming response: chunked transfer with Transfer-Encoding and Content-Encoding.
  * Pass an async iterator (HTML chunks) or a ReadableStream; default Content-Type is HTML for iterators