From cb4896c634ad6c65a1d9b8bfc184c99e339609c0 Mon Sep 17 00:00:00 2001
From: clean99 <53188310+clean99@users.noreply.github.com>
Date: Mon, 2 Nov 2026 22:34:51 +0800
Subject: [PATCH 1/3] fix(virtual-core): wait for a scroll element that has no
 window yet

Solid clones nodes from a <template>, and a suspended <Suspense> keeps them
in the template's document until it resolves. _willUpdate adopted such an
element with targetWindow null, so no observers were attached and the
viewport stayed 0; the call after insertion saw the same element and
returned early, leaving the list empty. Treat an element whose document has
no window like a missing one, so it is adopted once it is inserted.

The new dom-observers test fails without the change.
---
 .changeset/quiet-rows-wait.md                 |  5 +++
 packages/virtual-core/src/index.ts            | 14 ++++++++-
 .../virtual-core/tests/dom-observers.test.ts  | 31 +++++++++++++++++++
 3 files changed, 49 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/quiet-rows-wait.md

diff --git a/.changeset/quiet-rows-wait.md b/.changeset/quiet-rows-wait.md
new file mode 100644
index 000000000..87cb8b819
--- /dev/null
+++ b/.changeset/quiet-rows-wait.md
@@ -0,0 +1,5 @@
+---
+'@tanstack/virtual-core': patch
+---
+
+Wait to observe a scroll element until it is in a document with a window, so lists created inside a suspended Solid `<Suspense>` render their rows once it resolves.
diff --git a/packages/virtual-core/src/index.ts b/packages/virtual-core/src/index.ts
index b0ad7f222..1128623b7 100644
--- a/packages/virtual-core/src/index.ts
+++ b/packages/virtual-core/src/index.ts
@@ -1071,10 +1071,22 @@ export class Virtualizer<
   }
 
   _willUpdate = () => {
-    const scrollElement = this.options.enabled
+    let scrollElement = this.options.enabled
       ? this.options.getScrollElement()
       : null
 
+    // A node that has not been inserted yet can belong to a document with no
+    // window: Solid clones its templates from a <template>, and a suspended
+    // <Suspense> keeps them there. Nothing can be observed through it, so
+    // wait until it is inserted (#1011).
+    if (
+      scrollElement &&
+      'ownerDocument' in scrollElement &&
+      !scrollElement.ownerDocument.defaultView
+    ) {
+      scrollElement = null
+    }
+
     if (this.scrollElement !== scrollElement) {
       this.cleanup()
 
diff --git a/packages/virtual-core/tests/dom-observers.test.ts b/packages/virtual-core/tests/dom-observers.test.ts
index 8056d57a9..be37e0da0 100644
--- a/packages/virtual-core/tests/dom-observers.test.ts
+++ b/packages/virtual-core/tests/dom-observers.test.ts
@@ -251,6 +251,37 @@ test('cleanup resets the scroll flags on unmount', () => {
   expect(virtualizer.scrollDirection).toBe(null)
 })
 
+test('waits to observe a scroll element until it is inserted from a template', () => {
+  // Solid clones nodes from a <template>; a suspended <Suspense> keeps them
+  // in the template's document, which has no window (#1011).
+  const template = document.createElement('template')
+  template.innerHTML = '<div></div>'
+  const el = template.content.firstElementChild!.cloneNode() as HTMLDivElement
+  const observeElementRect = vi.fn((_instance, cb) => {
+    cb({ width: 400, height: 600 })
+    return () => {}
+  })
+
+  const virtualizer = new Virtualizer({
+    count: 100,
+    estimateSize: () => 50,
+    getScrollElement: () => el,
+    scrollToFn: vi.fn(),
+    observeElementRect,
+    observeElementOffset: () => () => {},
+  })
+
+  virtualizer._willUpdate()
+  expect(observeElementRect).not.toHaveBeenCalled()
+
+  document.body.appendChild(el)
+  virtualizer._willUpdate()
+
+  expect(observeElementRect).toHaveBeenCalledOnce()
+  expect(virtualizer.getVirtualItems()).toHaveLength(13)
+  el.remove()
+})
+
 test('observeElementOffset: cleanup drops the queued isScrolling reset', () => {
   vi.useFakeTimers()
   try {

From 1cba1ed37c7b8c1054ffbb46a32bfc195ffe0300 Mon Sep 17 00:00:00 2001
From: clean99 <53188310+clean99@users.noreply.github.com>
Date: Tue, 3 Nov 2026 09:37:53 +0800
Subject: [PATCH 2/3] fix(virtual-core): reattach observers when the scroll
 window changes

Keep handing windowless elements to custom observers, and re-adopt the same element when its document gains a window. This preserves late signal refs with custom observers while fixing Solid Suspense and synchronous signal refs with the built-in observers.

Use built-in observers in the template insertion regression test so the base fails on the missing rows rather than on an observer call count.
---
 .changeset/quiet-rows-wait.md                 |  2 +-
 packages/virtual-core/src/index.ts            | 21 ++++++++-----------
 .../virtual-core/tests/dom-observers.test.ts  | 16 +++++++-------
 3 files changed, 18 insertions(+), 21 deletions(-)

diff --git a/.changeset/quiet-rows-wait.md b/.changeset/quiet-rows-wait.md
index 87cb8b819..14f9b9ce8 100644
--- a/.changeset/quiet-rows-wait.md
+++ b/.changeset/quiet-rows-wait.md
@@ -2,4 +2,4 @@
 '@tanstack/virtual-core': patch
 ---
 
-Wait to observe a scroll element until it is in a document with a window, so lists created inside a suspended Solid `<Suspense>` render their rows once it resolves.
+Reattach observers when a scroll element's window changes, so Solid lists created inside a suspended `<Suspense>` or with a signal ref render their rows after insertion.
diff --git a/packages/virtual-core/src/index.ts b/packages/virtual-core/src/index.ts
index 1128623b7..9cb2304ff 100644
--- a/packages/virtual-core/src/index.ts
+++ b/packages/virtual-core/src/index.ts
@@ -1071,23 +1071,20 @@ export class Virtualizer<
   }
 
   _willUpdate = () => {
-    let scrollElement = this.options.enabled
+    const scrollElement = this.options.enabled
       ? this.options.getScrollElement()
       : null
 
-    // A node that has not been inserted yet can belong to a document with no
-    // window: Solid clones its templates from a <template>, and a suspended
-    // <Suspense> keeps them there. Nothing can be observed through it, so
-    // wait until it is inserted (#1011).
+    // Solid can create the scroll element in a template document without a
+    // window while Suspense is pending (#1011). Once inserted, the element
+    // is the same but its window has changed, so the built-in observers
+    // need to be attached again.
     if (
-      scrollElement &&
-      'ownerDocument' in scrollElement &&
-      !scrollElement.ownerDocument.defaultView
+      this.scrollElement !== scrollElement ||
+      (scrollElement &&
+        'ownerDocument' in scrollElement &&
+        this.targetWindow !== scrollElement.ownerDocument.defaultView)
     ) {
-      scrollElement = null
-    }
-
-    if (this.scrollElement !== scrollElement) {
       this.cleanup()
 
       if (!scrollElement) {
diff --git a/packages/virtual-core/tests/dom-observers.test.ts b/packages/virtual-core/tests/dom-observers.test.ts
index be37e0da0..11a36f200 100644
--- a/packages/virtual-core/tests/dom-observers.test.ts
+++ b/packages/virtual-core/tests/dom-observers.test.ts
@@ -251,34 +251,34 @@ test('cleanup resets the scroll flags on unmount', () => {
   expect(virtualizer.scrollDirection).toBe(null)
 })
 
-test('waits to observe a scroll element until it is inserted from a template', () => {
+test('renders items after the scroll element is inserted from a template', () => {
   // Solid clones nodes from a <template>; a suspended <Suspense> keeps them
   // in the template's document, which has no window (#1011).
   const template = document.createElement('template')
   template.innerHTML = '<div></div>'
   const el = template.content.firstElementChild!.cloneNode() as HTMLDivElement
-  const observeElementRect = vi.fn((_instance, cb) => {
-    cb({ width: 400, height: 600 })
-    return () => {}
+  Object.defineProperties(el, {
+    clientWidth: { value: 400 },
+    clientHeight: { value: 600 },
   })
 
   const virtualizer = new Virtualizer({
     count: 100,
     estimateSize: () => 50,
     getScrollElement: () => el,
-    scrollToFn: vi.fn(),
+    scrollToFn: elementScroll,
     observeElementRect,
-    observeElementOffset: () => () => {},
+    observeElementOffset,
   })
 
   virtualizer._willUpdate()
-  expect(observeElementRect).not.toHaveBeenCalled()
+  expect(virtualizer.getVirtualItems()).toHaveLength(0)
 
   document.body.appendChild(el)
   virtualizer._willUpdate()
 
-  expect(observeElementRect).toHaveBeenCalledOnce()
   expect(virtualizer.getVirtualItems()).toHaveLength(13)
+  virtualizer._didMount()()
   el.remove()
 })
 

From 53e757c810abc484ad7220178e532465b96b6842 Mon Sep 17 00:00:00 2001
From: clean99 <53188310+clean99@users.noreply.github.com>
Date: Wed, 4 Nov 2026 10:57:51 +0800
Subject: [PATCH 3/3] test(solid-virtual): render rows after a suspended list
 resolves

Cover the #1011 shape through the Solid adapter: the virtualizer is
created inside a component that suspends on a resource, and its rows
render once the boundary resolves. Without the virtual-core change the
list stays empty.
---
 .../solid-virtual/tests/suspense.test.tsx     | 65 +++++++++++++++++++
 1 file changed, 65 insertions(+)
 create mode 100644 packages/solid-virtual/tests/suspense.test.tsx

diff --git a/packages/solid-virtual/tests/suspense.test.tsx b/packages/solid-virtual/tests/suspense.test.tsx
new file mode 100644
index 000000000..9df97a59b
--- /dev/null
+++ b/packages/solid-virtual/tests/suspense.test.tsx
@@ -0,0 +1,65 @@
+import { beforeEach, expect, test } from 'vitest'
+import { For, Suspense, createResource } from 'solid-js'
+import { render } from 'solid-js/web'
+
+import { createVirtualizer } from '../src/index'
+
+beforeEach(() => {
+  Object.defineProperties(HTMLElement.prototype, {
+    clientHeight: {
+      configurable: true,
+      get: () => 200,
+    },
+  })
+})
+
+test('renders rows once a suspended list resolves', async () => {
+  let resolve!: (count: number) => void
+  const pending = new Promise<number>((r) => (resolve = r))
+
+  function List() {
+    const [count] = createResource(() => pending)
+    let parentRef!: HTMLDivElement
+
+    const virtualizer = createVirtualizer({
+      get count() {
+        return count() ?? 0
+      },
+      getScrollElement: () => parentRef,
+      estimateSize: () => 50,
+      overscan: 0,
+    })
+
+    return (
+      <div ref={parentRef}>
+        <For each={virtualizer.getVirtualItems()}>
+          {(row) => <div>Row {row.index}</div>}
+        </For>
+      </div>
+    )
+  }
+
+  const container = document.createElement('div')
+  document.body.appendChild(container)
+  const dispose = render(
+    () => (
+      <Suspense fallback="Loading...">
+        <List />
+      </Suspense>
+    ),
+    container,
+  )
+
+  expect(container.textContent).toBe('Loading...')
+
+  resolve(100)
+  await pending
+  await Promise.resolve()
+
+  expect(
+    Array.from(container.firstElementChild!.children, (el) => el.textContent),
+  ).toEqual(['Row 0', 'Row 1', 'Row 2', 'Row 3'])
+
+  dispose()
+  container.remove()
+})