@webjsdev/core 0.7.56 → 0.7.58

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webjsdev/core",
-  "version": "0.7.56",
+  "version": "0.7.58",
   "type": "module",
   "description": "The runtime for WebJs, a full-stack JavaScript framework built on web components with server-side rendering and no build step. Ships the html and css template tags, the WebComponent base class, signals, directives, and the isomorphic renderers.",
   "types": "./index.d.ts",

package/src/component/lifecycle.js

@@ -1,6 +1,6 @@
 import { render as clientRender } from '../render-client.js';
 import { readAttributeValue, resolveAttributeProperty } from '../attribute-reader.js';
-import { setActiveActionSignal } from '../action-abort-client.js';
+import { setActiveActionSignal, activeActionSignal } from '../action-abort-client.js';
 import { carriesFunction } from '../form-action.js';
 import { isCSS, adoptStyles } from '../css.js';
 import { register, tagOf } from '../registry.js';
@@ -872,23 +872,18 @@ class WebComponentBase extends Base {
         // by-sync case (#469); a shouldUpdate=false cycle never reaches here,
         // so it does not invalidate an in-flight async render.
         this.__renderToken = (this.__renderToken || 0) + 1;
-        // Abort the superseded render's in-flight action fetches (#492), start a
-        // fresh controller for this render, and bind it as the active signal so
-        // the RPC stub ties its fetches to this render. A superseded fetch's
-        // AbortError is dropped by the render-token guard in _commitAsync.
+        // Abort the superseded render's in-flight action fetches (#492) and
+        // start a fresh controller for this render. update() binds its signal
+        // around render() alone (see there), never the DOM commit. A
+        // superseded fetch's AbortError is dropped by the render-token guard
+        // in _commitAsync.
         if (this.__renderAbort) this.__renderAbort.abort();
         this.__renderAbort = typeof AbortController !== 'undefined' ? new AbortController() : null;
-        setActiveActionSignal(this.__renderAbort ? this.__renderAbort.signal : null);
         try {
           const r = this.update(changedProperties);
           if (r && typeof r.then === 'function') pendingCommit = r;
         } catch (error) {
           this._handleRenderError(/** @type {Error} */ (error));
-        } finally {
-          // The synchronous portion of render() has run; actions invoked there
-          // already captured the signal. Clear it so a later event handler is
-          // not bound to a stale render's controller.
-          setActiveActionSignal(null);
         }
 
         if (!pendingCommit) {
@@ -1126,7 +1121,21 @@ class WebComponentBase extends Base {
       });
     }
     let tpl;
-    this.__signalWatcher.observe(() => { tpl = this.render(); });
+    // Bind this render's abort signal (#492) around the synchronous part of
+    // render() ONLY, so the RPC stub ties an action called there to this
+    // render and the next render cancels it. The commit below runs unbound:
+    // it connects the child elements this template creates, and an action a
+    // child starts in its connectedCallback belongs to the child, not to this
+    // render, so the parent's next render must not cancel it (#1514). The
+    // previous binding is restored rather than cleared, so a render nested
+    // inside another's synchronous work leaves the outer one intact.
+    const outer = activeActionSignal();
+    setActiveActionSignal(this.__renderAbort ? this.__renderAbort.signal : null);
+    try {
+      this.__signalWatcher.observe(() => { tpl = this.render(); });
+    } finally {
+      setActiveActionSignal(outer || null);
+    }
     // Bare-await async render (#469): render() returned a promise. Use
     // stale-while-revalidate: keep the current DOM (the SSR first paint on
     // hydration, or the prior content on a re-fetch) visible until the new

package/src/signal.js

@@ -81,7 +81,7 @@ let batchDepth = 0;
  * @property {boolean} dirty
  * @property {ReactiveNode[]} producers
  * @property {number[]} producerLastReadVersions
- * @property {Set<ReactiveNode>=} liveConsumers
+ * @property {Map<ReactiveNode, number>=} liveConsumers live consumer -> how many of its producer slots read this node
  * @property {boolean} consumerAllowSignalWrites
  * @property {boolean} consumerIsAlwaysLive
  * @property {(this: ReactiveNode) => boolean} producerMustRecompute
@@ -105,11 +105,18 @@ const FALSE_FN = () => false;
  * This is how source `set()` calls reach watchers across computed
  * chains: the push side of the graph propagates upward only when
  * something downstream is actually live.
+ *
+ * The edge is REFERENCE COUNTED, one count per producer slot (#1508). A
+ * consumer that reads the same signal twice in one run holds it in two slots,
+ * and every slot is added and removed on its own as runs shrink, grow or
+ * reorder. With a plain set the first removal dropped the edge outright, so a
+ * render that went from reading a signal twice to once (or swapped the order
+ * of two reads) stopped hearing about that signal while still depending on it.
  */
 function producerAddLiveConsumer(node, consumer) {
-  if (!node.liveConsumers) node.liveConsumers = new Set();
+  if (!node.liveConsumers) node.liveConsumers = new Map();
   const wasEmpty = node.liveConsumers.size === 0;
-  node.liveConsumers.add(consumer);
+  node.liveConsumers.set(consumer, (node.liveConsumers.get(consumer) || 0) + 1);
   if (wasEmpty) {
     if (node.producers && node.producers.length > 0) {
       for (const p of node.producers) producerAddLiveConsumer(p, node);
@@ -120,9 +127,12 @@ function producerAddLiveConsumer(node, consumer) {
   }
 }
 
-/** Inverse of producerAddLiveConsumer. Cascades teardown upward. */
+/** Inverse of producerAddLiveConsumer: drops one slot's count, and the edge with the last one. Cascades teardown upward. */
 function producerRemoveLiveConsumer(node, consumer) {
   if (!node.liveConsumers) return;
+  const n = node.liveConsumers.get(consumer);
+  if (n === undefined) return;
+  if (n > 1) { node.liveConsumers.set(consumer, n - 1); return; }
   node.liveConsumers.delete(consumer);
   if (node.liveConsumers.size === 0) {
     if (node.producers && node.producers.length > 0) {
@@ -181,7 +191,7 @@ function producerNotifyConsumers(node) {
   const prev = inNotificationPhase;
   inNotificationPhase = true;
   try {
-    for (const consumer of node.liveConsumers) {
+    for (const consumer of node.liveConsumers.keys()) {
       if (!consumer.dirty) {
         consumerMarkDirty(consumer);
       }
@@ -316,7 +326,7 @@ function collectBatched(node) {
   inNotificationPhase = true;
   try {
     if (!node.liveConsumers) return;
-    for (const consumer of node.liveConsumers) {
+    for (const consumer of node.liveConsumers.keys()) {
       if (consumer.dirty) continue;
       consumer.dirty = true;
       if (consumer.__isWatcher) {
@@ -550,7 +560,7 @@ function introspectSources(sink) {
 
 /** @param {SignalState | SignalComputed} producer */
 function introspectSinks(producer) {
-  return producer.liveConsumers ? [...producer.liveConsumers] : [];
+  return producer.liveConsumers ? [...producer.liveConsumers.keys()] : [];
 }
 
 /** @param {SignalState | SignalComputed} producer */

package/src/webjs-config.d.ts

@@ -146,6 +146,14 @@ export interface WebjsDevTasks {
    * one run. Ignored by `webjs start`.
    */
   sourceLocations?: boolean;
+  /**
+   * Live-reload idle close (#1507), DEV-ONLY, off by default. Seconds with no
+   * edit and no interaction after which the dev live-reload stream closes, so a
+   * host that counts an open request as activity can sleep with a preview tab
+   * open; interaction, a tab showing, or an embed-bridge host command reopens
+   * it. `WEBJS_DEV_RELOAD_IDLE` (seconds) overrides it. Ignored by `webjs start`.
+   */
+  reloadIdle?: number;
 }
 
 /** Start task orchestration in `webjs.start` (#550). Read by the CLI, not the server. */