npm - what-server - Versions diffs - 0.8.4 → 0.11.0 - Mend

what-server 0.8.4 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (25) hide show

package/README.md +148 -0
package/dist/actions.js +32 -1
package/dist/actions.js.map +3 -3
package/dist/actions.min.js +1 -1
package/dist/actions.min.js.map +4 -4
package/dist/index.js +743 -23
package/dist/index.js.map +4 -4
package/dist/index.min.js +10 -10
package/dist/index.min.js.map +4 -4
package/dist/islands.js +23 -1
package/dist/islands.js.map +3 -3
package/dist/islands.min.js +1 -1
package/dist/islands.min.js.map +4 -4
package/package.json +8 -2
package/src/action-handler.js +331 -0
package/src/actions.js +13 -1
package/src/adapter/cloudflare.js +18 -0
package/src/adapter/core.js +203 -0
package/src/adapter/node.js +77 -0
package/src/adapter/static.js +62 -0
package/src/adapter/vercel.js +93 -0
package/src/index.js +203 -9
package/src/islands.js +12 -2
package/src/revalidation-registry.js +37 -0
package/src/serialize.js +34 -0

package/src/index.js CHANGED Viewed

@@ -2,7 +2,22 @@
 // SSR, static site generation, server components.
 // Zero-JS pages by default. Islands opt-in to client JS.
-import { h } from 'what-core';
+import { h, runWithServerContext, beginHeadCollection, endHeadCollection } from 'what-core';
+import { serializeState } from './serialize.js';
+import { getIslandStoresSnapshot } from './islands.js';
+import { csrfMetaTag } from './actions.js';
+// Build a fresh render-scoped server context (head sink, loader data, resources).
+function createRenderContext(loaderData) {
+  return {
+    head: beginHeadCollection(),
+    loaderData,
+    resources: new Map(),
+    resourceCounter: 0,
+    boundaryCounter: 0,
+    suspended: [],
+  };
+}
 // --- Hydration ID Generator ---
 let _hydrationIdCounter = 0;
@@ -122,6 +137,20 @@ export function renderToString(vnode) {
     return vnode.map(renderToString).join('');
   }
+  // Suspense boundary — render children; if a child suspends (throws a thenable),
+  // show the fallback (a synchronous render cannot await). renderToStringAsync /
+  // renderToStream await the pending resources and re-render with real content.
+  if (vnode.tag === '__suspense') {
+    try {
+      return (vnode.children || []).map(renderToString).join('');
+    } catch (e) {
+      if (e && typeof e.then === 'function') {
+        return renderToString(vnode.props && vnode.props.fallback);
+      }
+      throw e;
+    }
+  }
   // Component
   if (typeof vnode.tag === 'function') {
     const result = vnode.tag({ ...vnode.props, children: vnode.children });
@@ -141,10 +170,110 @@ export function renderToString(vnode) {
   return `${open}${inner}</${tag}>`;
 }
+// --- Render to String + collected <head> ---
+// Like renderToString, but captures any <Head> tags declared anywhere in the
+// tree into a render-scoped sink and returns them as escaped <head> HTML.
+//
+// Concurrency: renderToString is synchronous, so the render context set by
+// runWithServerContext lives within one uninterrupted tick — safe under
+// concurrent requests (no two renders interleave in the sync path).
+export function renderToStringWithHead(vnode) {
+  const ctx = createRenderContext(undefined);
+  const body = runWithServerContext(ctx, () => renderToString(vnode));
+  return { body, head: endHeadCollection(ctx.head) };
+}
+// --- Render a page module (loader + component) ---
+// Runs the page's `export const loader` (if any) BEFORE the synchronous render,
+// so the resolved value is plain data by the time the render reads it. The
+// loader receives { params, query, request }. Its result is passed to the page
+// component as a `loaderData` prop and is readable anywhere via useLoaderData().
+//
+// `pageModule` is `{ default: Component, loader? }` (the shape file-router emits).
+export async function renderPage(pageModule, reqCtx = {}) {
+  const Component = pageModule.default || pageModule;
+  const loaderData = typeof pageModule.loader === 'function'
+    ? await pageModule.loader(reqCtx)
+    : undefined;
+  const ctx = createRenderContext(loaderData);
+  const params = reqCtx.params || {};
+  const body = runWithServerContext(ctx, () =>
+    renderToString(h(Component, { ...params, loaderData }))
+  );
+  return { body, head: endHeadCollection(ctx.head), loaderData };
+}
+// --- Async render (resolves Suspense / createResource data) ---
+// Renders, then awaits any resources that suspended, then re-renders with the
+// resolved data — repeating until the tree is stable. Returns the body, the
+// collected head, and the resolved resources for the hydration payload.
+const MAX_RESOLVE_PASSES = 12;
+export async function renderToStringAsync(vnode, ctx) {
+  if (!ctx) ctx = createRenderContext(undefined);
+  let body = '';
+  for (let pass = 0; pass < MAX_RESOLVE_PASSES; pass++) {
+    body = runWithServerContext(ctx, () => renderToString(vnode));
+    const pending = [...ctx.resources.values()]
+      .filter((r) => r.status === 'pending')
+      .map((r) => r.promise);
+    if (pending.length === 0) break;
+    await Promise.all(pending);
+  }
+  const resources = {};
+  for (const [k, v] of ctx.resources) if (v.status === 'ready') resources[k] = v.value;
+  return { body, head: endHeadCollection(ctx.head), loaderData: ctx.loaderData, resources, ctx };
+}
+// --- Render a complete HTML document (loader + data + head + hydration payload) ---
+// The full-stack entry: runs the loader, renders (resolving async resources),
+// and emits one consolidated <script id="__what_data"> with { loaderData,
+// resources, islandStores } for the client to hydrate from without refetching.
+export async function renderDocument(pageModule, reqCtx = {}, options = {}) {
+  const Component = pageModule.default || pageModule;
+  const loaderData = typeof pageModule.loader === 'function'
+    ? await pageModule.loader(reqCtx)
+    : undefined;
+  const ctx = createRenderContext(loaderData);
+  const params = reqCtx.params || {};
+  const { body, head, resources } = await renderToStringAsync(
+    h(Component, { ...params, loaderData }),
+    ctx
+  );
+  const payload = {
+    loaderData: loaderData ?? null,
+    resources,
+    islandStores: getIslandStoresSnapshot(),
+  };
+  return wrapHtmlDocument({ body, head, payload, options });
+}
+function wrapHtmlDocument({ body, head, payload, options = {} }) {
+  const lang = options.lang || 'en';
+  const dataScript = `<script id="__what_data" type="application/json">${serializeState(payload)}</script>`;
+  const clientScript = options.clientEntry
+    ? `<script type="module" src="${escapeHtml(options.clientEntry)}"></script>`
+    : '';
+  // CSRF auto-provisioning: when the caller (e.g. the deploy adapter with
+  // default-on CSRF) passes the per-request token, embed it as the meta tag
+  // the client action() wrapper and plain <form> posts read it from.
+  const csrfHead = options.csrfToken ? csrfMetaTag(options.csrfToken) : '';
+  const extraHead = csrfHead + (options.head || '');
+  const bodyClass = options.bodyClass ? ` class="${escapeHtml(options.bodyClass)}"` : '';
+  return (
+    `<!DOCTYPE html><html lang="${escapeHtml(lang)}"><head>` +
+    `<meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">` +
+    `${head || ''}${extraHead}</head><body${bodyClass}>` +
+    `${body}${dataScript}${clientScript}</body></html>`
+  );
+}
 // --- Stream Render ---
-// Returns an async iterator for streaming SSR.
+// Returns an async iterator for streaming SSR. `ctx` is threaded explicitly so
+// concurrent streams never share state across `await` points.
-export async function* renderToStream(vnode) {
+export async function* renderToStream(vnode, ctx) {
+  if (ctx === undefined) ctx = createRenderContext(undefined);
   if (vnode == null || vnode === false || vnode === true) return;
   if (typeof vnode === 'string' || typeof vnode === 'number') {
@@ -154,14 +283,14 @@ export async function* renderToStream(vnode) {
   // Signal — unwrap by calling it
   if (typeof vnode === 'function' && vnode._signal) {
-    yield* renderToStream(vnode());
+    yield* renderToStream(vnode(), ctx);
     return;
   }
   // Reactive function child — call to get value
   if (typeof vnode === 'function') {
     try {
-      yield* renderToStream(vnode());
+      yield* renderToStream(vnode(), ctx);
     } catch (e) {
       if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {
         console.warn('[what-server] Error rendering reactive function in stream SSR:', e.message);
@@ -172,8 +301,33 @@ export async function* renderToStream(vnode) {
   if (Array.isArray(vnode)) {
     for (const child of vnode) {
-      yield* renderToStream(child);
+      yield* renderToStream(child, ctx);
+    }
+    return;
+  }
+  // Suspense boundary — render the subtree, awaiting any suspended resources,
+  // then emit the resolved content. (In-order; out-of-order swap is a future
+  // enhancement.) The synchronous render runs inside the threaded ctx.
+  if (vnode.tag === '__suspense') {
+    let html = null;
+    for (let attempt = 0; attempt < MAX_RESOLVE_PASSES && html === null; attempt++) {
+      let suspended = null;
+      try {
+        html = runWithServerContext(ctx, () => (vnode.children || []).map(renderToString).join(''));
+      } catch (e) {
+        if (e && typeof e.then === 'function') suspended = e;
+        else throw e;
+      }
+      if (html === null) {
+        const pending = [...ctx.resources.values()].filter((r) => r.status === 'pending').map((r) => r.promise);
+        await Promise.all([suspended, ...pending].filter(Boolean));
+      }
+    }
+    if (html === null) {
+      html = runWithServerContext(ctx, () => renderToString(vnode.props && vnode.props.fallback));
     }
+    yield html;
     return;
   }
@@ -182,7 +336,7 @@ export async function* renderToStream(vnode) {
       const result = vnode.tag({ ...vnode.props, children: vnode.children });
       // Support async components
       const resolved = result instanceof Promise ? await result : result;
-      yield* renderToStream(resolved);
+      yield* renderToStream(resolved, ctx);
     } catch (e) {
       if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {
         console.warn('[what-server] Error rendering component in stream SSR:', e.message);
@@ -204,7 +358,7 @@ export async function* renderToStream(vnode) {
       yield String(rawInner);
     } else {
       for (const child of children) {
-        yield* renderToStream(child);
+        yield* renderToStream(child, ctx);
       }
     }
     yield `</${tag}>`;
@@ -327,12 +481,26 @@ function _resolveInnerHTML(props) {
   return null;
 }
+// Attribute NAMES are emitted verbatim into the HTML, so they must be
+// validated (values are escaped, names cannot be). Anything outside this
+// pattern (spaces, quotes, equals, ...) could otherwise inject attributes:
+//   h('div', { 'x" onload="alert(1)': '' })  ->  <div x" onload="alert(1)>
+// Allows letters, digits, '_', ':', '.', '-' — covers data-*, aria-*,
+// xlink:href, SVG names like stroke-width, and namespaced attributes.
+const SAFE_ATTR_NAME = /^[a-zA-Z_:][a-zA-Z0-9:._-]*$/;
 function renderAttrs(props) {
   let out = '';
   for (const [key, val] of Object.entries(props)) {
     if (key === 'key' || key === 'ref' || key === 'children' || key === 'dangerouslySetInnerHTML' || key === 'innerHTML') continue;
     if (key.startsWith('on') && key.length > 2) continue; // Skip event handlers in SSR
     if (val === false || val == null) continue;
+    if (!SAFE_ATTR_NAME.test(key)) {
+      if (_isDevMode) {
+        console.warn(`[what-server] Skipping invalid attribute name in SSR: ${JSON.stringify(key)}`);
+      }
+      continue;
+    }
     if (key === 'className' || key === 'class') {
       out += ` class="${escapeHtml(String(val))}"`;
@@ -362,7 +530,7 @@ function isUnsafeUrlAttribute(key, val) {
   const normalizedKey = key.toLowerCase();
   if (!URL_ATTRS.has(normalizedKey)) return false;
   const normalizedValue = String(val).trim().replace(/[\u0000-\u001f\u007f\s]+/g, '').toLowerCase();
-  return normalizedValue.startsWith('javascript:') || normalizedValue.startsWith('vbscript:');
+  return normalizedValue.startsWith('javascript:') || normalizedValue.startsWith('vbscript:') || normalizedValue.startsWith('data:');
 }
 const URL_ATTRS = new Set([
@@ -404,3 +572,29 @@ export {
   validateCsrfToken,
   csrfMetaTag,
 } from './actions.js';
+// Served server actions: wire the /__what_action route (Node + fetch adapters)
+export {
+  createActionHandler,
+  nodeActionMiddleware,
+  fetchActionHandler,
+} from './action-handler.js';
+// Revalidation registry — app code calls revalidatePath/revalidateTag; the
+// deploy adapter binds a what-isr engine via setRevalidationHandler.
+export {
+  revalidatePath,
+  revalidateTag,
+  setRevalidationHandler,
+  getRevalidationHandler,
+} from './revalidation-registry.js';
+// Deploy adapters — framework-agnostic core + Node / static / edge wrappers
+export { createRequestHandler } from './adapter/core.js';
+export { createServer, toNodeListener, whatMiddleware } from './adapter/node.js';
+export { exportStatic } from './adapter/static.js';
+export { createCloudflareHandler } from './adapter/cloudflare.js';
+export { createVercelHandler, buildVercelOutput } from './adapter/vercel.js';
+// Safe state serialization for inlining into <script> tags (AUDIT-2026-06-06 M13)
+export { serializeState } from './serialize.js';

package/src/islands.js CHANGED Viewed

@@ -17,6 +17,7 @@
 //   'action'  - Hydrate on first user interaction (click, focus, hover)
 import { mount, hydrate, signal, batch } from 'what-core';
+import { serializeState } from './serialize.js';
 const islandRegistry = new Map();
 const hydratedIslands = new Set();
@@ -83,13 +84,22 @@ export function useIslandStore(name, fallbackInitial = {}) {
   return createIslandStore(name, fallbackInitial);
 }
-// Serialize all shared stores for SSR
+// Serialize all shared stores for SSR.
+// Uses serializeState (not bare JSON.stringify) so user-controlled store values
+// containing "</script>" cannot break out of the <script> tag this is embedded
+// in. (AUDIT-2026-06-06 H3)
 export function serializeIslandStores() {
+  return serializeState(getIslandStoresSnapshot());
+}
+// Raw (unserialized) snapshot of all shared island stores, so renderDocument can
+// merge it into the single consolidated #__what_data payload (one serialize pass).
+export function getIslandStoresSnapshot() {
   const data = {};
   for (const [name, store] of sharedStores) {
     data[name] = store._getSnapshot();
   }
-  return JSON.stringify(data);
+  return data;
 }
 // Hydrate shared stores from SSR data

package/src/revalidation-registry.js ADDED Viewed

@@ -0,0 +1,37 @@
+// Revalidation registry — the indirection that lets app code call
+// revalidatePath()/revalidateTag() from `what-framework/server` while the actual
+// cache engine lives in the optional `what-isr` package. The deploy adapter
+// binds the engine at startup via setRevalidationHandler(); until then these are
+// safe no-ops (with a dev hint).
+let _handler = null;
+const isDev = typeof process !== 'undefined' ? process.env?.NODE_ENV !== 'production' : true;
+/** Bind a cache engine: setRevalidationHandler({ revalidatePath, revalidateTag }). */
+export function setRevalidationHandler(handler) {
+  _handler = handler;
+}
+export function getRevalidationHandler() {
+  return _handler;
+}
+export async function revalidatePath(path, options) {
+  if (_handler && _handler.revalidatePath) return _handler.revalidatePath(path, options);
+  if (isDev) {
+    console.warn(
+      `[what] revalidatePath('${path}') had no effect: no cache engine is bound. ` +
+      'Create a what-isr engine and bind it in your adapter (setRevalidationHandler).'
+    );
+  }
+}
+export async function revalidateTag(tag, options) {
+  if (_handler && _handler.revalidateTag) return _handler.revalidateTag(tag, options);
+  if (isDev) {
+    console.warn(
+      `[what] revalidateTag('${tag}') had no effect: no cache engine is bound.`
+    );
+  }
+}

package/src/serialize.js ADDED Viewed

@@ -0,0 +1,34 @@
+// Safe serialization of state for inlining into an HTML <script> tag.
+//
+// Stateless on purpose: this module holds no shared state, so it is safe for
+// the bundler to inline into multiple server entry points without creating
+// divergent instances (unlike islands.js's sharedStores).
+//
+// JSON.stringify alone is NOT safe to drop inside <script>...</script>: a value
+// containing "</script>" (or "<!--", "<script") breaks out of the element and
+// injects markup -- stored XSS when any value is user-controlled
+// (AUDIT-2026-06-06 H3). Escaping "<", ">", "&" as \uXXXX keeps the output
+// valid JSON (so JSON.parse on hydrate still works) while making it inert in
+// HTML. U+2028/U+2029 are also escaped: they are valid in JSON strings but are
+// illegal in JS string literals and can break inline script parsing.
+// Built via new RegExp from escape sequences so this source file contains no
+// invisible separator characters. Matches: < > & U+2028 U+2029.
+const SCRIPT_UNSAFE = new RegExp('[<>&\\u2028\\u2029]', 'g');
+const ESCAPES = {
+  0x3c: '\\u003c', // <
+  0x3e: '\\u003e', // >
+  0x26: '\\u0026', // &
+  0x2028: '\\u2028',
+  0x2029: '\\u2029',
+};
+/**
+ * Serialize a value to a JSON string that is safe to embed verbatim inside an
+ * HTML <script> element. Always use this instead of bare JSON.stringify when
+ * inlining hydration/state payloads into server-rendered HTML.
+ */
+export function serializeState(value) {
+  return JSON.stringify(value).replace(SCRIPT_UNSAFE, (c) => ESCAPES[c.charCodeAt(0)]);
+}