feat(preact-query*): support Preact v11

.changeset/preact-v11-peer-dependency.md

@@ -0,0 +1,7 @@
+---
+'@tanstack/preact-query': patch
+'@tanstack/preact-query-devtools': patch
+'@tanstack/preact-query-persist-client': patch
+---
+
+Add Preact v11 to peerDependencies

examples/preact/simple/package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@tanstack/preact-query": "^5.104.1",
-    "preact": "^10.29.8"
+    "preact": "^11.0.1"
   },
   "devDependencies": {
     "@preact/preset-vite": "^2.10.6",

packages/preact-query-devtools/package.json

@@ -87,6 +87,6 @@
   },
   "peerDependencies": {
     "@tanstack/preact-query": "workspace:^",
-    "preact": "^10.0.0"
+    "preact": "^10.0.0 || ^11.0.0-0"
   }
 }

packages/preact-query-devtools/src/__tests__/PreactQueryDevtools.test.tsx

@@ -1,5 +1,5 @@
 import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { render } from '@testing-library/preact'
+import { act, render } from '@testing-library/preact'
 import { QueryClient, QueryClientProvider } from '@tanstack/preact-query'
 import { TanstackQueryDevtools } from '@tanstack/query-devtools'
 import type { PreactQueryDevtools as PreactQueryDevtoolsComponent } from '../PreactQueryDevtools'
@@ -226,7 +226,9 @@ describe('PreactQueryDevtools', () => {
 
   it('should call "unmount" on the devtools instance when the component unmounts', () => {
     const { unmount } = render(<PreactQueryDevtools client={queryClient} />)
-    unmount()
+    act(() => {
+      unmount()
+    })
 
     expect(unmountMock).toHaveBeenCalled()
   })

packages/preact-query-devtools/src/__tests__/PreactQueryDevtoolsPanel.test.tsx

@@ -1,5 +1,5 @@
 import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { render } from '@testing-library/preact'
+import { act, render } from '@testing-library/preact'
 import { QueryClient, QueryClientProvider } from '@tanstack/preact-query'
 import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'
 import type { PreactQueryDevtoolsPanel as PreactQueryDevtoolsPanelComponent } from '../PreactQueryDevtoolsPanel'
@@ -185,7 +185,9 @@ describe('PreactQueryDevtoolsPanel', () => {
     const { unmount } = render(
       <PreactQueryDevtoolsPanel client={queryClient} />,
     )
-    unmount()
+    act(() => {
+      unmount()
+    })
 
     expect(unmountMock).toHaveBeenCalled()
   })

packages/preact-query-devtools/test-setup.ts

@@ -4,8 +4,11 @@ import { notifyManager } from '@tanstack/preact-query'
 import { afterEach } from 'vitest'
 
 // https://testing-library.com/docs/preact-testing-library/api#cleanup
+// Wrap in act so effect cleanups Preact defers on unmount run synchronously
 afterEach(() => {
-  cleanupRTL()
+  act(() => {
+    cleanupRTL()
+  })
 })
 
 // Wrap notifications with act to make sure Preact knows about Query updates

packages/preact-query-persist-client/package.json

@@ -67,6 +67,6 @@
   },
   "peerDependencies": {
     "@tanstack/preact-query": "workspace:^",
-    "preact": "^10.0.0"
+    "preact": "^10.0.0 || ^11.0.0-0"
   }
 }

packages/preact-query-persist-client/test-setup.ts

@@ -4,8 +4,11 @@ import { afterEach } from 'vitest'
 import { notifyManager } from '@tanstack/preact-query'
 
 // https://testing-library.com/docs/preact-testing-library/api#cleanup
+// Wrap in act so effect cleanups Preact defers on unmount run synchronously
 afterEach(() => {
-  cleanupRTL()
+  act(() => {
+    cleanupRTL()
+  })
 })
 
 // Wrap notifications with act to make sure Preact knows about Query updates

packages/preact-query/package.json

@@ -69,10 +69,10 @@
     "@tanstack/query-test-utils": "workspace:*",
     "@testing-library/preact": "catalog:",
     "preact": "catalog:",
-    "preact-render-to-string": "^6.6.4",
+    "preact-render-to-string": "^6.8.0",
     "typescript": "catalog:"
   },
   "peerDependencies": {
-    "preact": "^10.0.0"
+    "preact": "^10.0.0 || ^11.0.0-0"
   }
 }

packages/preact-query/src/__tests__/useQuery.test.tsx

@@ -3966,7 +3966,9 @@ describe('useQuery', () => {
     rendered.getByText('fetched data')
     const setTimeoutSpy = vi.spyOn(globalThis.window, 'setTimeout')
 
-    rendered.unmount()
+    act(() => {
+      rendered.unmount()
+    })
 
     expect(setTimeoutSpy).not.toHaveBeenCalled()
   })
@@ -3990,7 +3992,9 @@ describe('useQuery', () => {
 
     const setTimeoutSpy = vi.spyOn(globalThis.window, 'setTimeout')
 
-    rendered.unmount()
+    act(() => {
+      rendered.unmount()
+    })
 
     expect(setTimeoutSpy).toHaveBeenLastCalledWith(
       expect.any(Function),

packages/preact-query/src/utils.ts

@@ -87,7 +87,7 @@ export function useSyncExternalStoreWithSelector<TSnapshot, TSelected>(
   selector: (snapshot: TSnapshot) => TSelected,
   isEqual: (a: TSelected, b: TSelected) => boolean,
 ): TSelected {
-  const selectedSnapshotRef = useRef<TSelected | undefined>()
+  const selectedSnapshotRef = useRef<TSelected | undefined>(undefined)
 
   const getSelectedSnapshot = () => {
     const snapshot = getSnapshot()

packages/preact-query/test-setup.ts

@@ -4,8 +4,11 @@ import { act, cleanup as cleanupRTL } from '@testing-library/preact'
 import { afterEach } from 'vitest'
 
 // https://testing-library.com/docs/preact-testing-library/api#cleanup
+// Wrap in act so effect cleanups Preact defers on unmount run synchronously
 afterEach(() => {
-  cleanupRTL()
+  act(() => {
+    cleanupRTL()
+  })
 })
 
 // Wrap notifications with act to make sure React knows about React Query updates

pnpm-workspace.yaml

@@ -31,7 +31,7 @@ catalog:
   # preact
   '@preact/preset-vite': ^2.10.6
   '@testing-library/preact': ^3.2.4
-  preact: ^10.29.8
+  preact: ^11.0.1
 
   # solid
   '@solidjs/testing-library': ^0.8.10