fix: guard use-size against non-element refs

Author: unadlib

packages/use-size/src/index.ts

@@ -35,6 +35,10 @@ function isBorderBoxSize(value: unknown): value is BorderBoxSize {
   )
 }
 
+function isElement(value: unknown): value is HTMLElement {
+  return typeof Element !== 'undefined' && value instanceof Element
+}
+
 function useSize(target: ElementTarget<HTMLElement>): () => Size | undefined {
   const size = createSignal<Size | undefined>(undefined)
 
@@ -46,7 +50,7 @@ function useSize(target: ElementTarget<HTMLElement>): () => Size | undefined {
       cleanup?.()
       cleanup = undefined
 
-      if (!element) {
+      if (!element || !isElement(element)) {
         size(undefined)
         return
       }

packages/use-size/test/index.test.tsx

@@ -107,4 +107,31 @@ describe('@fictjs/use-size', () => {
 
     expect(container.querySelector('output')?.textContent).toBe('180x72')
   })
+
+  it('ignores temporary ref targets that are not elements', async () => {
+    const observe = vi.fn()
+    vi.stubGlobal('ResizeObserver', class {
+      observe = observe
+      unobserve(): void {}
+      disconnect(): void {}
+    })
+
+    function Test() {
+      const target = {
+        current: document.createComment('placeholder') as unknown as HTMLDivElement,
+      }
+      const size = useSize(target)
+
+      return <output>{size() ? 'ready' : 'none'}</output>
+    }
+
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(() => <Test />, container)
+    await flushMicrotasks()
+
+    expect(container.querySelector('output')?.textContent).toBe('none')
+    expect(observe).not.toHaveBeenCalled()
+  })
 })