@webjsdev/server 0.8.81 → 0.8.83

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webjsdev/server",
-  "version": "0.8.81",
+  "version": "0.8.83",
   "type": "module",
   "description": "The server for WebJs, a full-stack JavaScript framework built on web components with server-side rendering and no build step. Provides the file-based router, SSR, server actions, route handlers, middleware, and live reload on Node 24+ or Bun.",
   "main": "index.js",

package/src/component-elision.js

@@ -285,6 +285,118 @@ const PURE_DATA_CONSTRUCTORS = new Set([
   'BigInt64Array', 'BigUint64Array',
 ]);
 
+/**
+ * Marks where `hasModuleScopeSideEffect` dropped a top-level `{...}` body from
+ * its depth-0 frame, so an arrow followed by a block body is not mistaken for
+ * an expression body that runs on into the next statement. Removed again
+ * before the call scan.
+ */
+const BLOCK = '\x01';
+
+/** `function`, `function*`, `async function name` up to its parameter list's `(`. */
+const FUNCTION_PARAMS_RE = /(?<![\w$.])function\s*\*?\s*(?:[A-Za-z_$][\w$]*)?\s*\(/g;
+
+/**
+ * The text before an arrow's `=>` when that arrow is a declarator initializer
+ * (`const usd = (m) =>`, `let f = async x =>`, `, g = (a) =>`). The parameter
+ * list must hold no parens, so a call in a parameter default
+ * (`(a = init()) =>`) keeps its arrow unrecognised and still ships.
+ */
+const ARROW_DECLARATOR_RE =
+  /(?:(?<![\w$.])(?:const|let|var)\s+|,\s*)[A-Za-z_$][\w$]*\s*=\s*(?:async\s*)?(?:\([^()]*\)|[A-Za-z_$][\w$]*)\s*$/;
+
+/**
+ * An expression body that ends this way cannot stop at the newline (a binary
+ * operator, `?`, `:`, or a curried `=>`). Postfix `++` / `--` and a regex
+ * literal's closing `/` end a statement, so neither is listed.
+ */
+const BODY_CONTINUES_RE = /(?:=>|&&|\|\||\?\?|[?:=*%|&^<>]|(?<![+])\+|(?<![-])-)\s*$/;
+
+/** A line starting this way continues the previous one: no statement starts with it. */
+const LINE_CONTINUES_RE = /^\s*(?:\?|:|&&|\|\||\.(?![.\d])|\*|%|=(?!>)|\|)/;
+
+/**
+ * Removes the two depth-0 shapes that look like calls and run nothing at module
+ * load: a `function` declaration's parameter list (a default such as
+ * `now = Date.now()` runs per call) and an arrow's expression body when the
+ * arrow initializes a declarator (`const usd = (m) => Math.round(m) / MICROS`).
+ *
+ * The arrow body ends at a `,` or `;` at its own paren/bracket depth 0, at a
+ * `)` / `]` closing something outside it, or at a newline once the body has
+ * content, unless `BODY_CONTINUES_RE` / `LINE_CONTINUES_RE` prove the
+ * expression carries on. Ending early is always safe, because whatever is left
+ * stays in the frame and is still scanned; ending late could swallow a real
+ * statement, so every rule errs towards ending.
+ *
+ * @param {string} frame depth-0 text, with `BLOCK` where a `{...}` was dropped
+ * @returns {string | null} the frame without those parts, or null when a
+ *   parameter list does not close (the caller then ships)
+ */
+function blankDeclarationOnlyCode(frame) {
+  let out = '';
+  let last = 0;
+  for (const m of frame.matchAll(FUNCTION_PARAMS_RE)) {
+    if (m.index < last) continue;
+    const open = m.index + m[0].length - 1;
+    let depth = 0;
+    let close = -1;
+    for (let j = open; j < frame.length; j++) {
+      if (frame[j] === '(') depth++;
+      else if (frame[j] === ')' && --depth === 0) { close = j; break; }
+    }
+    if (close < 0) return null;
+    out += frame.slice(last, open + 1);
+    last = close;
+  }
+  frame = out + frame.slice(last);
+
+  out = '';
+  let depth = 0;
+  for (let i = 0; i < frame.length; i++) {
+    const c = frame[i];
+    if (c === '(' || c === '[') depth++;
+    else if ((c === ')' || c === ']') && depth > 0) depth--;
+    if (depth === 0 && c === '=' && frame[i + 1] === '>' && ARROW_DECLARATOR_RE.test(out)) {
+      out += '=>';
+      i = arrowBodyEnd(frame, i + 2) - 1;
+      continue;
+    }
+    out += c;
+  }
+  return out;
+}
+
+/**
+ * Index where an arrow's expression body starting at `start` ends (see
+ * `blankDeclarationOnlyCode`).
+ *
+ * @param {string} frame
+ * @param {number} start index just past the `=>`
+ * @returns {number}
+ */
+function arrowBodyEnd(frame, start) {
+  let depth = 0;
+  let i = start;
+  for (; i < frame.length; i++) {
+    const c = frame[i];
+    if (c === '(' || c === '[') { depth++; continue; }
+    if (c === ')' || c === ']') {
+      if (depth === 0) return i;
+      depth--;
+      continue;
+    }
+    if (depth > 0) continue;
+    if (c === ',' || c === ';') return i;
+    if (c === '\n') {
+      const body = frame.slice(start, i);
+      if (!body.trim() || BODY_CONTINUES_RE.test(body)) continue;
+      if (LINE_CONTINUES_RE.test(frame.slice(i + 1))) continue;
+      return i;
+    }
+  }
+  return i;
+}
+
 /**
  * Module-scope client work, detected by an ALLOWLIST of safe top-level forms
  * rather than a denylist of browser globals. A module that runs ANY code when
@@ -320,8 +432,13 @@ const PURE_DATA_CONSTRUCTORS = new Set([
  * request path is covered; a DIRECT caller handing it `.ts` source as authored
  * is opting into that false positive.
  *
- * Over-detection is safe (a top-level arrow whose body calls something, or a
- * pure top-level helper call, only ships). The accepted residual misses, all
+ * A `function` declaration's parameter list and the expression body of an
+ * arrow that initializes a `const` / `let` / `var` declarator are dropped from
+ * the frame first (`blankDeclarationOnlyCode`): `now = Date.now()` and
+ * `(m) => Math.round(m) / MICROS` declare code, they do not run it.
+ *
+ * Over-detection is safe (a pure top-level helper call, or an arrow outside a
+ * declarator whose body calls something, only ships). The accepted residual misses, all
  * contrived and structural (so they do not rot), are a call buried inside a
  * top-level object / array initializer or a destructuring default, and a
  * side-effecting tagged-template hole evaluated at module scope.
@@ -361,7 +478,7 @@ export function hasModuleScopeSideEffect(src, literals) {
       if (depth === 0) frame += "''";
       continue;
     }
-    if (c === '{') { depth++; continue; }
+    if (c === '{') { if (depth === 0) frame += BLOCK; depth++; continue; }
     if (c === '}') { if (depth > 0) depth--; continue; }
     if (depth === 0) frame += c;
   }
@@ -369,6 +486,11 @@ export function hasModuleScopeSideEffect(src, literals) {
   // literal with a stray brace is the common case). Ship rather than risk a
   // hidden top-level statement.
   if (depth !== 0) return true;
+  // Parameter lists and declarator arrow bodies are declarations, not code
+  // that runs at load.
+  const declared = blankDeclarationOnlyCode(frame);
+  if (declared === null) return true;
+  frame = declared.replaceAll(BLOCK, '');
   // Optional-chaining call/index: `foo?.()`, `x?.[i]()` (the `?.` defeats the
   // identifier-before-paren match below).
   if (/\?\.\s*[([]/.test(frame)) return true;

package/src/form-dispatch.js

@@ -385,6 +385,28 @@ function textValuesOf(formData) {
   return out;
 }
 
+/**
+ * A failure result with `values` completed from the submission (#1581).
+ *
+ * Every submitted text field is there, so a page refills a field with
+ * `value=${actionData?.values?.x}` without the action having to echo it, which
+ * is the one step generated and hand-written actions both keep forgetting. The
+ * action's own `values` win, so an action that normalizes or deliberately
+ * blanks a field (a password) still decides. A repeated name (a checkbox group)
+ * keeps its last value, as `textValuesOf` does; read the FormData for the full
+ * list. Files are left out. The author's object is copied, never mutated.
+ *
+ * @param {unknown} result
+ * @param {FormData} formData
+ * @returns {unknown}
+ */
+function withSubmittedValues(result, formData) {
+  if (!result || typeof result !== 'object' || Array.isArray(result)) return result;
+  const own = /** @type any */ (result).values;
+  const ownValues = own && typeof own === 'object' && !Array.isArray(own) ? own : {};
+  return { ...result, values: { ...textValuesOf(formData), ...ownValues } };
+}
+
 /**
  * A page path exists but only renders: the method is the problem, not the url.
  * @returns {Response}
@@ -523,8 +545,9 @@ export async function runFormAction(route, params, url, req, ssrOpts, deps) {
         return await formActionErrorResponse(v.thrown, ssrOpts.dev);
       }
       // A structured failure envelope is a NORMAL result the page renders, so
-      // it takes the 422 re-render path exactly as a failing action would.
-      return ssrPage(route, params, url, { ...ssrOpts, req, actionData: v.result, status: 422 });
+      // it takes the 422 re-render path exactly as a failing action would,
+      // submitted values included (#1581).
+      return ssrPage(route, params, url, { ...ssrOpts, req, actionData: withSubmittedValues(v.result, formData), status: 422 });
     }
     args = [v.value];
   }
@@ -634,10 +657,11 @@ export async function runFormAction(route, params, url, req, ssrOpts, deps) {
   }
 
   // FAILURE: re-render the SAME page with the action result available on
-  // ctx.actionData, status 422. Repopulation is the page author's job (native
-  // `value=${actionData.values?.field}`).
+  // ctx.actionData, status 422. `actionData.values` carries every submitted
+  // text field (#1581), so `value=${actionData?.values?.field}` refills a field
+  // whether or not the action echoed it.
   const status = typeof result.status === 'number' && result.status >= 400 ? result.status : 422;
-  const page = await ssrPage(route, params, url, { ...ssrOpts, req, actionData: result, status });
+  const page = await ssrPage(route, params, url, { ...ssrOpts, req, actionData: withSubmittedValues(result, formData), status });
   // A failure result can still have mutated (a partial write, then a rejected
   // second step), so the eviction above applies here too and this response, not
   // being a redirect, is one the router can actually read the header off.