@webjsdev/core 0.7.40 → 0.7.41

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webjsdev/core",
-  "version": "0.7.40",
+  "version": "0.7.41",
   "type": "module",
   "description": "webjs core runtime - html/css tags, WebComponent base, isomorphic renderers",
   "types": "./index.d.ts",

package/src/component.js

@@ -9,9 +9,11 @@ import {
   adoptSSRAssignments,
   ensureSlotState,
   hasSlotState,
-  slotsView,
-  hasSlotContent,
-  setSlotContent,
+  hasFrameworkRenderedSubtree,
+  installSlotInterception,
+  installSlotSensors,
+  teardownSlotSensors,
+  reconnectSweep,
 } from './slot.js';
 
 const isBrowser = typeof window !== 'undefined' && typeof HTMLElement !== 'undefined';
@@ -843,17 +845,45 @@ class WebComponentBase extends Base {
       // c. First mount, no SSR. Partition authored children into the
       //    record before _performRender wipes the host.
       //
-      // There are NO mutation observers: an external appendChild or a
-      // slot=""-attribute flip after mount is inert by design, and the
-      // dynamic path is setSlotContent() (children as values).
+      // After capture, installSlotInterception + installSlotSensors below make
+      // native DOM writes on a mounted host live (appendChild, slot= flips,
+      // innerHTML, HTMLSlotElement.assign), so light-DOM slots match shadow DOM
+      // through the standard API.
       if (hasSlotState(this)) {
-        // (a) Reconnection. Record already populated; nothing to do here.
-      } else if (this.__isHydrating()) {
+        // (a) Reconnection. Record already populated. Sweep any direct child
+        //     added by a raw bypass write while the host was disconnected (no
+        //     sensor was live to catch it), then re-arm the sensors below.
+        reconnectSweep(this);
+      } else if (
+        this.__isHydrating() ||
+        this.hasAttribute('data-wj-serialized') ||
+        hasFrameworkRenderedSubtree(this)
+      ) {
+        // (b) Framework-rendered markup, from any of three signals: boot-time
+        //     SSR hydration (the webjs-hydrate marker), the router's
+        //     data-wj-serialized stamp (applySwap marks every host in a parsed
+        //     doc, covering a snapshot restore whose serialized shape has no
+        //     projected slot to detect), or the structural detector (own
+        //     data-webjs-light[data-projection] slots, attributes only the
+        //     renderer / SSR stamps). Adopt-not-capture: capturing restored
+        //     post-hydration HTML would hoover the rendered tree into the
+        //     record and duplicate content on the next render (the #1006
+        //     shape, on the restore path).
+        this.removeAttribute('data-wj-serialized');
         ensureSlotState(this);
         adoptSSRAssignments(this);
       } else {
+        // (c) First mount with author-written children. Capture them.
         captureAuthoredChildren(this);
       }
+      // Install native-write interception AFTER capture (capture uses the
+      // host's still-native methods), then arm the sensors. Together they make
+      // appendChild / insertBefore / removeChild / innerHTML / slot= flips on a
+      // mounted light host drive the slot record, restoring full shadow-DOM
+      // parity through the standard DOM API. Interception installs once;
+      // sensors are armed on every connect and torn down on disconnect.
+      installSlotInterception(this);
+      installSlotSensors(this);
     }
 
     // Notify all controllers that the host is connected.
@@ -888,50 +918,13 @@ class WebComponentBase extends Base {
       } catch (err) {
         console.error(`[webjs] lifecycle hook threw during initial render:`, err);
       }
-      // No slot observers to attach (#1015): the renderer's slot parts
-      // place the record content as part of the commit, and the only
-      // dynamic path is setSlotContent().
+      // The renderer's slot parts place the record content as part of the
+      // commit; native DOM writes on the host (appendChild, slot= flips,
+      // innerHTML) drive the record live through the interception + sensors
+      // installed on connect. There is no WebJs-specific slot API.
     });
   }
 
-  /**
-   * Read view of this host's slot record (#1015): captured (or
-   * programmatically set) children per slot name, e.g.
-   * `this.slots.default` / `this.slots.header`. Fresh arrays each read.
-   * Enables conditional-on-slot rendering:
-   * `this.slots.header ? html\`...\` : ''`.
-   *
-   * @returns {Record<string, Node[]>}
-   */
-  get slots() {
-    return slotsView(this);
-  }
-
-  /**
-   * Does this host's slot record carry content for `name` (#1015)?
-   * `hasSlot()` / `hasSlot('default')` query the default slot.
-   *
-   * @param {string | null} [name]
-   * @returns {boolean}
-   */
-  hasSlot(name) {
-    return hasSlotContent(this, name);
-  }
-
-  /**
-   * Replace a slot's content (#1015): the ONE dynamic path for slotted
-   * children (external appendChild / slot="" flips after mount are inert
-   * by design). Accepts a Node, Node[], a string, or null to reset the
-   * slot to its fallback content. Fires `slotchange` when the assignment
-   * changes.
-   *
-   * @param {string | null} name
-   * @param {Node | Node[] | string | null} value
-   */
-  setSlotContent(name, value) {
-    setSlotContent(this, name, value);
-  }
-
   /**
    * True when this host's first child is the framework's hydration
    * marker, meaning the SSR pipeline already rendered the template's
@@ -969,8 +962,11 @@ class WebComponentBase extends Base {
       this.__hydrationObserver.disconnect();
       this.__hydrationObserver = null;
     }
-    // No slot observers to detach (#1015). The per-host slot record is
-    // preserved so a subsequent reconnection picks up where it left off.
+    // Tear down the slot sensors, processing any queued records first (a bare
+    // disconnect() drops them). The per-host slot record + interception are
+    // preserved so a reconnection picks up where it left off (sensors re-arm in
+    // connectedCallback).
+    teardownSlotSensors(this);
     // Dispose the signal watcher so dependency edges drop. Without
     // this the element holds references to module-scope signals
     // (and vice versa) forever.

package/src/render-client.js

@@ -10,11 +10,28 @@ import {
   PROJECTION_FALLBACK,
   SLOT_FALLBACK_FRAG,
   SLOT_STATE,
+  SLOT_OWNER,
+  RENDERING,
   applySlotAssignments,
   rescueAssignedNodes,
-  ensureSlotState,
+  withRendererWrites,
+  drainRendererBackstop,
 } from './slot.js';
 
+/**
+ * Open the renderer-write window on a light-DOM host while `fn` commits into
+ * it, so the host's patched slot-interception methods delegate to native and
+ * a renderer commit is never mistaken for authored content. A no-op (just runs
+ * `fn`) when `node` is not a slot host, so nested and non-host commits pay
+ * nothing. Covers the ASYNC commit paths (async directives, streaming) that
+ * run outside a synchronous render() call.
+ */
+function commitInto(node, fn) {
+  const host = node && /** @type {any} */ (node)[SLOT_STATE] ? node : null;
+  if (!host) return fn();
+  return withRendererWrites(host, fn);
+}
+
 /**
  * Client-side renderer with **fine-grained** updates.
  *
@@ -88,43 +105,67 @@ const INSTANCE = Symbol.for('webjs.instance');
  */
 export function render(value, container) {
   const host = /** @type any */ (container);
-  const prev = host[INSTANCE];
+  // Open the renderer-write window for the whole commit: every host-receiver
+  // write below (and in createInstance / updateInstance / clearInstance / all
+  // part commits they reach synchronously) then bypasses the slot interception
+  // that is patched onto a light host. This is the single discriminator
+  // between a renderer commit and an author write.
+  const prevRendering = host[RENDERING];
+  host[RENDERING] = true;
+  try {
+    const prev = host[INSTANCE];
 
-  if (isTemplate(value)) {
-    const tr = /** @type {import('./html.js').TemplateResult} */ (value);
-    if (prev && prev.strings === tr.strings) {
-      updateInstance(prev, tr.values);
-      return;
-    }
-    if (prev) clearInstance(prev, container);
+    if (isTemplate(value)) {
+      const tr = /** @type {import('./html.js').TemplateResult} */ (value);
+      if (prev && prev.strings === tr.strings) {
+        updateInstance(prev, tr.values);
+        return;
+      }
+      if (prev) clearInstance(prev, container);
+
+      // Light DOM hydration: if container has SSR content (marked by
+      // <!--webjs-hydrate-->), remove the marker and proceed with normal
+      // rendering. The content will be replaced with identical output -
+      // no visible flash because SSR and client render produce the same HTML.
+      const firstChild = container.firstChild;
+      if (firstChild && firstChild.nodeType === 8 && /** @type {Comment} */ (firstChild).data === 'webjs-hydrate') {
+        firstChild.remove();
+      }
 
-    // Light DOM hydration: if container has SSR content (marked by
-    // <!--webjs-hydrate-->), remove the marker and proceed with normal
-    // rendering. The content will be replaced with identical output -
-    // no visible flash because SSR and client render produce the same HTML.
-    const firstChild = container.firstChild;
-    if (firstChild && firstChild.nodeType === 8 && /** @type {Comment} */ (firstChild).data === 'webjs-hydrate') {
-      firstChild.remove();
+      // Pre-set the symbol to an explicit null BEFORE the commit,
+      // UNCONDITIONALLY: if createInstance throws after its replaceChildren
+      // (e.g. inside the slot-part apply loop), the finally-drain must see
+      // "rendered, no instance" (discard the commit's records), never
+      // "never rendered" (fold and corrupt) and never a STALE cleared prev
+      // instance on the template-swap path (whose bookends would misclassify
+      // the half-committed new roots as unowned and fold them).
+      host[INSTANCE] = null;
+      const inst = createInstance(tr, container);
+      host[INSTANCE] = inst;
+      return;
     }
 
-    const inst = createInstance(tr, container);
-    host[INSTANCE] = inst;
-    return;
-  }
-
-  // Non-template value: treat as a single text child.
-  if (prev) clearInstance(prev, container);
-  host[INSTANCE] = null;
-  container.replaceChildren();
-  if (value == null || value === false || value === true) return;
-  if (Array.isArray(value)) {
-    for (const v of value) {
-      const text = document.createTextNode(String(v ?? ''));
-      container.appendChild(text);
+    // Non-template value: treat as a single text child.
+    if (prev) clearInstance(prev, container);
+    host[INSTANCE] = null;
+    container.replaceChildren();
+    if (value == null || value === false || value === true) return;
+    if (Array.isArray(value)) {
+      for (const v of value) {
+        const text = document.createTextNode(String(v ?? ''));
+        container.appendChild(text);
+      }
+      return;
     }
-    return;
+    container.appendChild(document.createTextNode(String(value)));
+  } finally {
+    host[RENDERING] = prevRendering;
+    // Outermost window closing: drain this commit's childList records off the
+    // slot backstop (drainRendererBackstop processes them with a renderer-output
+    // skip when an instance exists, else discards), so the backstop never folds
+    // renderer output. Mirrors withRendererWrites, used by the async paths.
+    if (!prevRendering) drainRendererBackstop(host);
   }
-  container.appendChild(document.createTextNode(String(value)));
 }
 
 /* ================================================================
@@ -483,9 +524,21 @@ function createInstance(tr, container) {
   // Slot parts have no value-hole to drive applyPart from the loop above.
   // Apply them once now that the fragment is inserted into the live
   // container, so each slot can locate its host by walking parents and
-  // schedule the first projection through slot.js.
+  // schedule the first projection through slot.js. Stamp each slot with the
+  // host whose TEMPLATE produced it (this container), so a FORWARDED slot
+  // (rendered here but nested inside a child component) routes to this host
+  // rather than to the child the structural walk would pick. Only an element
+  // container is a host; a fragment/shadow container leaves the structural
+  // path in place.
+  const ownerHost =
+    /** @type {any} */ (container).nodeType === 1 && /** @type {any} */ (container)[SLOT_STATE]
+      ? container
+      : null;
   for (const part of bound) {
-    if (part.kind === 'slot') applyPart(part, undefined, undefined, []);
+    if (part.kind === 'slot') {
+      if (ownerHost && part.slotEl) /** @type {any} */ (part.slotEl)[SLOT_OWNER] = ownerHost;
+      applyPart(part, undefined, undefined, []);
+    }
   }
 
   return { strings: tr.strings, bound, lastValues, startNode, endNode };
@@ -665,9 +718,24 @@ function applyPart(part, value, _prev, allValues) {
       if (part.applied) break;
       const slotEl = part.slotEl;
       const finalize = () => {
-        part.applied = true;
         const host = findSlotHost(slotEl);
-        if (!host) return; // truly orphan slot
+        if (!host) {
+          part.applied = true;
+          return; // truly orphan slot (no owner, no structural host)
+        }
+        // A FORWARDED slot's owner is known immediately (the SLOT_OWNER
+        // stamp) but the child component has not yet PLACED the slot into
+        // the owner's subtree, so the owner's apply cannot find it yet.
+        // Re-defer until the child places it (host.contains becomes true);
+        // the child WILL place it, or the owner disconnects and the retries
+        // stop. A normal own slot is already inside its host, so this passes
+        // on the first call with no extra deferral.
+        if (!host.contains(slotEl)) {
+          if (host.isConnected) queueMicrotask(finalize);
+          else part.applied = true;
+          return;
+        }
+        part.applied = true;
         // Shadow DOM: native projection. Leave fallback in place.
         if (isInShadowRootEl(slotEl)) return;
         // Light DOM: harvest the cloned fallback into a holding
@@ -681,7 +749,7 @@ function applyPart(part, value, _prev, allValues) {
         queueMicrotask(() => applySlotAssignments(host));
       };
       const directHost = findSlotHost(slotEl);
-      if (directHost) {
+      if (directHost && directHost.contains(slotEl)) {
         finalize();
       } else {
         queueMicrotask(finalize);
@@ -703,6 +771,10 @@ function applyPart(part, value, _prev, allValues) {
  * @returns {Element | null}
  */
 function findSlotHost(slotEl) {
+  // Template-owner stamp wins (a forwarded slot's true host), else the
+  // nearest SLOT_STATE ancestor structurally.
+  const owner = /** @type any */ (slotEl)[SLOT_OWNER];
+  if (owner && owner.isConnected) return owner;
   let p = slotEl.parentElement;
   while (p) {
     if (/** @type any */ (p)[SLOT_STATE]) return p;
@@ -819,6 +891,22 @@ function applyChild(part, value) {
  * @param {unknown} value
  */
 function applyChildInner(part, value) {
+  // Open the renderer-write window around this commit. Most calls are
+  // synchronous inside render() (the window is already open, this nests
+  // harmlessly), but the async directive paths (until, watch, asyncAppend /
+  // asyncReplace, streaming) re-enter here from a promise / microtask OUTSIDE
+  // any render() window, so this is where those commits into a light host are
+  // marked as renderer writes rather than authored content.
+  return commitInto(part.marker && part.marker.parentNode, () =>
+    applyChildInnerRaw(part, value),
+  );
+}
+
+/**
+ * @param {Extract<BoundPart, {kind:'child'}>} part
+ * @param {unknown} value
+ */
+function applyChildInnerRaw(part, value) {
   const marker = part.marker;
 
   // unsafeHTML directive: inject raw HTML string as DOM nodes.
@@ -1072,6 +1160,16 @@ function buildDetached(tr) {
     applyPart(bound[i], tr.values[i], undefined, tr.values);
     lastValues.push(tr.values[i]);
   }
+  // Slot parts need their one-shot apply exactly like createInstance and the
+  // nested-template path. The fragment is still detached here, so the
+  // slot-part's own deferred finalize (a one-microtask retry when the parent
+  // walk cannot reach a host yet) carries it: every caller inserts the
+  // returned fragment synchronously in the same task, so the retry lands in
+  // the live tree. Without this loop a <slot> inside a repeat() / array item
+  // never finalizes and its content is never placeable.
+  for (const p of bound) {
+    if (p.kind === 'slot') applyPart(p, undefined, undefined, []);
+  }
   const outFrag = document.createDocumentFragment();
   outFrag.appendChild(startNode);
   while (frag.firstChild) outFrag.appendChild(frag.firstChild);
@@ -1516,6 +1614,35 @@ function applyCache(part, inner) {
       // Reconcile values so any state changes since detachment apply.
       updateInstance(cached.inst, tr.values);
       part.child = cached.inst;
+      // A re-attached instance may carry ALREADY-APPLIED slot parts, whose
+      // finalize will never fire again, while the host's record moved on
+      // during the stash (content for these slots was parked when an apply
+      // ran with the slot unreachable). Re-run the apply for each owning
+      // host so parked content is pulled back out. The collection walks the
+      // re-attached DOM RANGE (not the instance tree): slot parts live on
+      // whatever template level contains the <slot> (nested holes, repeat /
+      // array items, streamed chunks), so a structural DOM walk is the only
+      // shape that covers every composition uniformly. moveRange already
+      // ran, so the range is live and each slot's parent walk reaches its
+      // host.
+      const hosts = new Set();
+      for (
+        let n = cached.inst.startNode.nextSibling;
+        n && n !== cached.inst.endNode;
+        n = n.nextSibling
+      ) {
+        if (n.nodeType !== 1) continue;
+        const el = /** @type {Element} */ (n);
+        if (el.matches('slot[data-webjs-light]')) {
+          const h = findSlotHost(el);
+          if (h) hosts.add(h);
+        }
+        for (const s of el.querySelectorAll('slot[data-webjs-light]')) {
+          const h = findSlotHost(s);
+          if (h) hosts.add(h);
+        }
+      }
+      for (const h of hosts) applySlotAssignments(h);
       return;
     }
   }
@@ -1829,17 +1956,23 @@ async function consumeAsyncStream(state, part, dir) {
       const mapped = dir.mapper ? dir.mapper(result.value, i) : result.value;
       const newNodes = renderToNodes(mapped);
 
-      if (state.mode === 'replace') {
-        for (const n of state.nodes) {
-          if (n.parentNode) n.parentNode.removeChild(n);
+      // This chunk commit runs in an async loop OUTSIDE any render() window,
+      // so open the renderer-write window explicitly: without it, committing a
+      // stream chunk into a light slot host would hit the patched insertBefore /
+      // removeChild and fold the renderer's own output into `authored`.
+      commitInto(marker.parentNode, () => {
+        if (state.mode === 'replace') {
+          for (const n of state.nodes) {
+            if (n.parentNode) n.parentNode.removeChild(n);
+          }
+          state.nodes = [];
         }
-        state.nodes = [];
-      }
 
-      const frag = document.createDocumentFragment();
-      for (const n of newNodes) frag.appendChild(n);
-      marker.parentNode?.insertBefore(frag, marker);
-      state.nodes.push(...newNodes);
+        const frag = document.createDocumentFragment();
+        for (const n of newNodes) frag.appendChild(n);
+        marker.parentNode?.insertBefore(frag, marker);
+        state.nodes.push(...newNodes);
+      });
 
       i++;
     }
@@ -1867,6 +2000,15 @@ function renderToNodes(value) {
     for (let i = 0; i < tr.values.length; i++) {
       applyPart(bound[i], tr.values[i], undefined, tr.values);
     }
+    // Slot parts need their one-shot apply here too (same contract as
+    // createInstance / nested templates / buildDetached): the caller
+    // (consumeAsyncStream) inserts these nodes synchronously in the same
+    // task, so the slot-part's one-microtask finalize retry lands in the
+    // live tree. Without this, a <slot> inside streamed chunk content never
+    // finalizes and its name suppresses parking forever.
+    for (const p of bound) {
+      if (p.kind === 'slot') applyPart(p, undefined, undefined, []);
+    }
     return [...frag.childNodes];
   }
   if (Array.isArray(value)) {

package/src/render-server.js

@@ -8,7 +8,6 @@ import { isSuspense } from './suspense.js';
 import { unsafeHTML, isUnsafeHTML, isLive, isKeyed, isGuard, isTemplateContent, isRef, isCache, isUntil, isAsyncAppend, isAsyncReplace, isWatch } from './directives.js';
 import { stringify, parse } from './serialize.js';
 import { cspNonce } from './csp-nonce.js';
-import { ensureSlotState } from './slot.js';
 
 /**
  * Render a TemplateResult (or any renderable value) to an HTML string.
@@ -487,14 +486,12 @@ async function injectDSD(html, ctx, ancestors = [], dev) {
       seedServerAttrs(instance, attrMap);
       applyAttrsToInstance(instance, attrMap, Cls);
       for (const [k, v] of Object.entries(propValues)) instance[k] = v;
-      // Extract the authored inner HTML BEFORE the render (#1015, the
-      // injectDSD reorder): the source scan needs no render output, and
-      // hoisting it lets the slot record be seeded so `this.hasSlot()` /
-      // `this.slots` inside render() see the authored children at SSR
-      // exactly as they will on the client (conditional-on-slot parity).
-      // The light-DOM branch below reuses these for the slot pipeline;
-      // the shadow branch is a read-only peek (its authored children stay
-      // in place for native projection, and its edit keeps the old end).
+      // Extract the authored inner HTML BEFORE the render (the injectDSD
+      // reorder): the source scan needs no render output, and hoisting it lets
+      // the light-DOM branch below project the authored children into the
+      // rendered slots. The shadow branch is a read-only peek (its authored
+      // children stay in place for native projection, and its edit keeps the
+      // old end).
       let authoredInner = '';
       let closeEnd = m.index + match.length;
       if (!selfClose) {
@@ -515,20 +512,6 @@ async function injectDSD(html, ctx, ancestors = [], dev) {
         }
       }
       const partitioned = partitionAuthoredBySlot(authoredInner);
-      // Seed the slot record for SSR-side reads: LIGHT DOM only, matching the
-      // client (which only creates slot state on the light-DOM path, since
-      // shadow slots are native browser projection). Seeding shadow here
-      // would make hasSlot() true at SSR and false after hydration, flipping
-      // conditional-on-slot markup on the first client render. At SSR the
-      // record value is the authored RAW HTML (one string per name; there is
-      // no DOM to hold Nodes), so PRESENCE and KEYS match the client record,
-      // which is the conditional-on-slot contract. Node access is client-side.
-      if (!isShadow) {
-        const slotState = ensureSlotState(instance);
-        for (const [name, htmlChunk] of partitioned) {
-          if (htmlChunk && htmlChunk.length) slotState.assignedByName.set(name, [htmlChunk]);
-        }
-      }
       // Run the pre-render lifecycle (willUpdate, controllers' hostUpdate,
       // then reflect reflect:true props) so derived state computed there is
       // correct in the SSR'd HTML, matching how lit runs the update cycle at
@@ -613,7 +596,7 @@ async function injectDSD(html, ctx, ancestors = [], dev) {
         // 2. Recursively run injectDSD on the substituted output so
         //    nested custom elements (inside projected children) get
         //    their own DSD pass.
-        const innerWithSlots = substituteSlotsInRender(rawInner, partitioned);
+        const innerWithSlots = substituteSlotsInRender(rawInner, partitioned, tag);
         const innerProcessed = await injectDSD(innerWithSlots, ctx, [...ancestors, instance], dev);
         edits.push({
           start: m.index,
@@ -967,11 +950,19 @@ function appendStringToMap(map, key, value) {
  * slots with the same name follow the first-wins rule per spec; later
  * same-named slots fall back regardless of available projection.
  *
+ * The `ownerTag` (the tag of the component whose template rendered these
+ * slots) is emitted as `data-wj-slot-owner` so the client resolves template
+ * ownership on hydration the same way the client renderer stamps SLOT_OWNER,
+ * which is what makes a FORWARDED slot (rendered by this component but nested
+ * inside a child) route to this component and not the child (#1023).
+ *
  * @param {string} rendered
  * @param {Map<string|null, string>} partitioned
+ * @param {string} ownerTag
  * @returns {string}
  */
-function substituteSlotsInRender(rendered, partitioned) {
+function substituteSlotsInRender(rendered, partitioned, ownerTag) {
+  const ownerAttr = ownerTag ? ` data-wj-slot-owner="${escapeAttr(ownerTag)}"` : '';
   /** @type {Set<string|null>} */
   const consumedNames = new Set();
   let result = '';
@@ -1016,9 +1007,9 @@ function substituteSlotsInRender(rendered, partitioned) {
     const extraAttrs = otherAttrs ? ` ${otherAttrs}` : '';
     if (projected !== undefined && !consumedNames.has(slotKey)) {
       consumedNames.add(slotKey);
-      result += `<slot data-webjs-light data-projection="actual"${nameAttr}${extraAttrs}>${projected}</slot>`;
+      result += `<slot data-webjs-light data-projection="actual"${ownerAttr}${nameAttr}${extraAttrs}>${projected}</slot>`;
     } else {
-      result += `<slot data-webjs-light data-projection="fallback"${nameAttr}${extraAttrs}>${fallback}</slot>`;
+      result += `<slot data-webjs-light data-projection="fallback"${ownerAttr}${nameAttr}${extraAttrs}>${fallback}</slot>`;
     }
     cursor = totalEnd;
     slotRe.lastIndex = totalEnd;