Skip to content

fix: preserve source order for shared structural slots - #465

Merged
Mohamed Mansour (mohamedmansour) merged 5 commits into
mainfrom
mohamedmansour-prove-nested-loop-order
Aug 24, 2026
Merged

fix: preserve source order for shared structural slots#465
Mohamed Mansour (mohamedmansour) merged 5 commits into
mainfrom
mohamedmansour-prove-nested-loop-order

Conversation

@mohamedmansour

@mohamedmansour Mohamed Mansour (mohamedmansour) commented Aug 22, 2026

Copy link
Copy Markdown
Contributor

Client-created repeat items can still render adjacent dynamic regions out of template order on current main. A nested <for> followed by a trailing <if> produces the conditional first, while SSR and refresh preserve the declared order.

The compiler already emits TemplateSlot.order, but $wire() previously inserted text, conditional, and repeat nodes in separate type batches. When different binding kinds shared one static insertion point, their DOM order followed the batch order instead of the template.

This change keeps each binding section explicit while using one small placement model:

  • Text, Conditional, and Repeat sections create their normal direct nodes or stable anchors.
  • Each queues a PendingSlot containing its parent, static reference, compiler order, node, and optional raw-HTML end anchor.
  • insertPendingSlots() sorts only when slots collide, then commits all nodes after every reference has been captured from the untouched DOM.
  • The comparator is shared, so client creation does not allocate a new sort closure per instance.

The reactive update path is unchanged: bindings still retain direct DOM references, with no virtual DOM and no new per-update work.

Reduced regression coverage proves:

  • the exact keyed nested-loop consumer shape
  • the minimal unkeyed single-assignment trigger
  • both <for> -> <if> and <if> -> <for> order
  • initially false conditionals activated after an existing repeat
  • initially empty repeats grown before an active conditional
  • empty text slots around structural bindings
  • Light-DOM structural parity
  • unkeyed append, prepend, middle insert, and middle delete behavior
  • live shadow bindings alongside projected slot content

A shared-slot hydration benchmark keeps the high-collision shape measurable.

Validation after rebasing onto origin/main:

  • pnpm test: 319 unit tests passed; 263 Playwright tests passed, 2 skipped
  • focused cross-kind/raw/Light-DOM/slot matrix: 26 passed
  • cargo xtask check: all phases passed

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@mohamedmansour
Mohamed Mansour (mohamedmansour) force-pushed the mohamedmansour-prove-nested-loop-order branch from 45010a9 to 043d4b1 Compare August 24, 2026 19:41
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@mohamedmansour
Mohamed Mansour (mohamedmansour) merged commit a003a86 into main Aug 24, 2026
35 checks passed
@mohamedmansour
Mohamed Mansour (mohamedmansour) deleted the mohamedmansour-prove-nested-loop-order branch August 24, 2026 22:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants