what-core 0.6.0 → 0.6.1

package/dist/testing.js

@@ -285,43 +285,66 @@ function scheduleMicrotask() {
     });
   }
 }
+var isFlushing = false;
 function flush() {
-  let iterations = 0;
-  while (pendingEffects.length > 0 && iterations < 25) {
-    const batch2 = pendingEffects;
-    pendingEffects = [];
-    if (batch2.length > 1 && pendingNeedSort) {
-      batch2.sort((a, b) => a._level - b._level);
-    }
-    pendingNeedSort = false;
-    for (let i = 0; i < batch2.length; i++) {
-      const e = batch2[i];
-      e._pending = false;
-      if (!e.disposed && !e._onNotify) {
-        const prevDepsLen = e.deps.length;
-        _runEffect(e);
-        if (!e._computed && e.deps.length !== prevDepsLen) {
-          _updateLevel(e);
+  if (isFlushing) return;
+  isFlushing = true;
+  try {
+    let iterations = 0;
+    while (pendingEffects.length > 0 && iterations < 25) {
+      const batch2 = pendingEffects;
+      pendingEffects = [];
+      if (batch2.length > 1 && pendingNeedSort) {
+        batch2.sort((a, b) => a._level - b._level);
+      }
+      pendingNeedSort = false;
+      for (let i = 0; i < batch2.length; i++) {
+        const e = batch2[i];
+        e._pending = false;
+        if (!e.disposed && !e._onNotify) {
+          const prevDepsLen = e.deps.length;
+          _runEffect(e);
+          if (!e._computed && e.deps.length !== prevDepsLen) {
+            _updateLevel(e);
+          }
         }
       }
+      iterations++;
+    }
+    if (iterations >= 25) {
+      for (let i = 0; i < pendingEffects.length; i++) pendingEffects[i]._pending = false;
+      pendingEffects.length = 0;
+      if (__DEV__) {
+        const remaining = pendingEffects.slice(0, 3);
+        const effectNames = remaining.map((e) => e.fn?.name || e.fn?.toString().slice(0, 60) || "(anonymous)");
+        console.warn(
+          `[what] Possible infinite effect loop detected (25 iterations). Likely cause: an effect writes to a signal it also reads, creating a cycle. Use untrack() to read signals without subscribing. Looping effects: ${effectNames.join(", ")}`
+        );
+      } else {
+        console.warn("[what] Possible infinite effect loop detected");
+      }
     }
-    iterations++;
+  } finally {
+    isFlushing = false;
   }
-  if (iterations >= 25) {
+}
+function flushSync() {
+  if (isFlushing) {
     if (__DEV__) {
-      const remaining = pendingEffects.slice(0, 3);
-      const effectNames = remaining.map((e) => e.fn?.name || e.fn?.toString().slice(0, 60) || "(anonymous)");
       console.warn(
-        `[what] Possible infinite effect loop detected (25 iterations). Likely cause: an effect writes to a signal it also reads, creating a cycle. Use untrack() to read signals without subscribing. Looping effects: ${effectNames.join(", ")}`
+        "[what] flushSync() called during an active flush (e.g., inside a component render or effect). This is a no-op to prevent infinite loops. Move flushSync() to an event handler or onMount callback."
       );
-    } else {
-      console.warn("[what] Possible infinite effect loop detected");
     }
-    for (let i = 0; i < pendingEffects.length; i++) pendingEffects[i]._pending = false;
-    pendingEffects.length = 0;
+    return;
+  }
+  if (currentEffect) {
+    if (__DEV__) {
+      console.warn(
+        "[what] flushSync() called during effect execution. This is a no-op to prevent infinite loops. Move flushSync() to an event handler or onMount callback."
+      );
+    }
+    return;
   }
-}
-function flushSync() {
   microtaskScheduled = false;
   flush();
 }
@@ -762,8 +785,8 @@ function createComponent(vnode, parent, isSvg) {
 function createErrorBoundary(vnode, parent) {
   const { errorState, handleError, fallback, reset } = vnode.props;
   const children = vnode.children;
-  const wrapper = document.createElement("span");
-  wrapper.style.display = "contents";
+  const startComment = document.createComment("eb:start");
+  const endComment = document.createComment("eb:end");
   const boundaryCtx = {
     hooks: [],
     hookIndex: 0,
@@ -772,15 +795,24 @@ function createErrorBoundary(vnode, parent) {
     mounted: false,
     disposed: false,
     _parentCtx: componentStack[componentStack.length - 1] || null,
-    _errorBoundary: handleError
+    _errorBoundary: handleError,
+    _startComment: startComment,
+    _endComment: endComment
   };
-  wrapper._componentCtx = boundaryCtx;
+  _commentCtxMap.set(startComment, boundaryCtx);
+  const container2 = document.createDocumentFragment();
+  container2._componentCtx = boundaryCtx;
+  container2.appendChild(startComment);
+  container2.appendChild(endComment);
   const dispose = effect(() => {
     const error = errorState();
     componentStack.push(boundaryCtx);
-    while (wrapper.firstChild) {
-      disposeTree(wrapper.firstChild);
-      wrapper.removeChild(wrapper.firstChild);
+    if (startComment.parentNode) {
+      while (startComment.nextSibling && startComment.nextSibling !== endComment) {
+        const old = startComment.nextSibling;
+        disposeTree(old);
+        old.parentNode.removeChild(old);
+      }
     }
     let vnodes;
     if (error) {
@@ -790,19 +822,25 @@ function createErrorBoundary(vnode, parent) {
     }
     vnodes = Array.isArray(vnodes) ? vnodes : [vnodes];
     for (const v of vnodes) {
-      const node = createDOM(v, wrapper);
-      if (node) wrapper.appendChild(node);
+      const node = createDOM(v, parent);
+      if (node) {
+        if (endComment.parentNode) {
+          endComment.parentNode.insertBefore(node, endComment);
+        } else {
+          container2.insertBefore(node, endComment);
+        }
+      }
     }
     componentStack.pop();
   });
   boundaryCtx.effects.push(dispose);
-  return wrapper;
+  return container2;
 }
 function createSuspenseBoundary(vnode, parent) {
   const { boundary, fallback, loading } = vnode.props;
   const children = vnode.children;
-  const wrapper = document.createElement("span");
-  wrapper.style.display = "contents";
+  const startComment = document.createComment("sb:start");
+  const endComment = document.createComment("sb:end");
   const boundaryCtx = {
     hooks: [],
     hookIndex: 0,
@@ -810,26 +848,41 @@ function createSuspenseBoundary(vnode, parent) {
     cleanups: [],
     mounted: false,
     disposed: false,
-    _parentCtx: componentStack[componentStack.length - 1] || null
+    _parentCtx: componentStack[componentStack.length - 1] || null,
+    _startComment: startComment,
+    _endComment: endComment
   };
-  wrapper._componentCtx = boundaryCtx;
+  _commentCtxMap.set(startComment, boundaryCtx);
+  const container2 = document.createDocumentFragment();
+  container2._componentCtx = boundaryCtx;
+  container2.appendChild(startComment);
+  container2.appendChild(endComment);
   const dispose = effect(() => {
     const isLoading = loading();
     const vnodes = isLoading ? [fallback] : children;
     const normalized = Array.isArray(vnodes) ? vnodes : [vnodes];
     componentStack.push(boundaryCtx);
-    while (wrapper.firstChild) {
-      disposeTree(wrapper.firstChild);
-      wrapper.removeChild(wrapper.firstChild);
+    if (startComment.parentNode) {
+      while (startComment.nextSibling && startComment.nextSibling !== endComment) {
+        const old = startComment.nextSibling;
+        disposeTree(old);
+        old.parentNode.removeChild(old);
+      }
     }
     for (const v of normalized) {
-      const node = createDOM(v, wrapper);
-      if (node) wrapper.appendChild(node);
+      const node = createDOM(v, parent);
+      if (node) {
+        if (endComment.parentNode) {
+          endComment.parentNode.insertBefore(node, endComment);
+        } else {
+          container2.insertBefore(node, endComment);
+        }
+      }
     }
     componentStack.pop();
   });
   boundaryCtx.effects.push(dispose);
-  return wrapper;
+  return container2;
 }
 function createPortalDOM(vnode, parent) {
   const { container: container2 } = vnode.props;